/* Minification failed. Returning unminified contents.
(2,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(9,15): run-time error CSS1039: Token not allowed after unary operator: '-web-space-2'
(10,22): run-time error CSS1039: Token not allowed after unary operator: '-web-space-6'
(13,21): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm'
(14,23): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm-lh'
(15,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-meta'
(20,28): run-time error CSS1039: Token not allowed after unary operator: '-web-space-2'
(21,21): run-time error CSS1039: Token not allowed after unary operator: '-web-rule'
(30,25): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(36,21): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(42,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-title'
(49,15): run-time error CSS1039: Token not allowed after unary operator: '-web-space-8'
(51,21): run-time error CSS1039: Token not allowed after unary operator: '-web-integration-content'
(59,25): run-time error CSS1039: Token not allowed after unary operator: '-web-space-6'
(63,25): run-time error CSS1039: Token not allowed after unary operator: '-web-space-3'
(64,21): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm'
(65,23): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm-lh'
(69,17): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(74,21): run-time error CSS1039: Token not allowed after unary operator: '-web-display-md'
(75,23): run-time error CSS1039: Token not allowed after unary operator: '-web-display-md-lh'
(78,17): run-time error CSS1039: Token not allowed after unary operator: '-kv-heading'
(85,15): run-time error CSS1039: Token not allowed after unary operator: '-web-space-2'
(86,22): run-time error CSS1039: Token not allowed after unary operator: '-web-space-4'
(87,26): run-time error CSS1039: Token not allowed after unary operator: '-web-space-4'
(88,35): run-time error CSS1039: Token not allowed after unary operator: '-web-rule'
(89,21): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm'
(90,23): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm-lh'
(91,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-meta'
(100,25): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(106,21): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(112,17): run-time error CSS1039: Token not allowed after unary operator: '-web-rule'
(130,21): run-time error CSS1039: Token not allowed after unary operator: '-web-text-md'
(132,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-body'
(136,29): run-time error CSS1039: Token not allowed after unary operator: '-web-space-6'
(144,21): run-time error CSS1039: Token not allowed after unary operator: '-web-text-lg'
(147,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-title'
(151,18): run-time error CSS1039: Token not allowed after unary operator: '-web-space-12'
(151,40): run-time error CSS1039: Token not allowed after unary operator: '-web-space-4'
(152,21): run-time error CSS1039: Token not allowed after unary operator: '-web-display-xs'
(153,23): run-time error CSS1039: Token not allowed after unary operator: '-web-display-xs-lh'
(155,17): run-time error CSS1039: Token not allowed after unary operator: '-kv-heading'
(156,34): run-time error CSS1039: Token not allowed after unary operator: '-web-header-h'
(156,56): run-time error CSS1039: Token not allowed after unary operator: '-web-space-6'
(164,17): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(170,21): run-time error CSS1039: Token not allowed after unary operator: '-web-primary-dark'
(175,21): run-time error CSS1039: Token not allowed after unary operator: '-web-primary-dark'
(181,22): run-time error CSS1039: Token not allowed after unary operator: '-web-space-6'
(182,24): run-time error CSS1039: Token not allowed after unary operator: '-web-space-6'
(187,25): run-time error CSS1039: Token not allowed after unary operator: '-web-space-2'
(191,22): run-time error CSS1039: Token not allowed after unary operator: '-web-space-6'
(192,24): run-time error CSS1039: Token not allowed after unary operator: '-web-space-6'
(193,33): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(194,21): run-time error CSS1039: Token not allowed after unary operator: '-web-text-lg'
(196,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-title'
(200,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-title'
(205,22): run-time error CSS1039: Token not allowed after unary operator: '-web-space-8'
(208,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-title'
(219,25): run-time error CSS1039: Token not allowed after unary operator: '-web-space-6'
(231,25): run-time error CSS1039: Token not allowed after unary operator: '-web-space-8'
(235,22): run-time error CSS1039: Token not allowed after unary operator: '-web-space-3'
(237,21): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm'
(238,23): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm-lh'
(239,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-meta'
(251,15): run-time error CSS1039: Token not allowed after unary operator: '-web-space-3'
(252,22): run-time error CSS1039: Token not allowed after unary operator: '-web-space-8'
(253,23): run-time error CSS1039: Token not allowed after unary operator: '-web-space-6'
(254,32): run-time error CSS1039: Token not allowed after unary operator: '-web-rule'
(258,21): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm'
(259,23): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm-lh'
(261,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-title'
(271,28): run-time error CSS1039: Token not allowed after unary operator: '-web-rule'
(275,17): run-time error CSS1039: Token not allowed after unary operator: '-web-news-meta'
(277,28): run-time error CSS1039: Token not allowed after unary operator: '-web-ease'
(277,58): run-time error CSS1039: Token not allowed after unary operator: '-web-ease'
(281,21): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(282,28): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(287,21): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(288,28): run-time error CSS1039: Token not allowed after unary operator: '-web-primary'
(293,21): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm'
(294,23): run-time error CSS1039: Token not allowed after unary operator: '-web-text-sm-lh'
(295,17): run-time error CSS1039: Token not allowed after unary operator: '-web-accent-dark'
(308,19): run-time error CSS1039: Token not allowed after unary operator: '-web-space-8'
(319,25): run-time error CSS1039: Token not allowed after unary operator: '-web-text-xl'
 */
.art-layout {
    --kv-heading: #002249;
}

.art-crumb-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--web-space-2);
    margin: 0 0 var(--web-space-6);
    padding: 0;
    list-style: none;
    font-size: var(--web-text-sm);
    line-height: var(--web-text-sm-lh);
    color: var(--web-news-meta);
}

    .art-crumb-list li + li::before {
        content: "/";
        margin-right: var(--web-space-2);
        color: var(--web-rule);
    }

    .art-crumb-list a {
        color: inherit;
        text-decoration: none;
    }

        .art-crumb-list a:focus-visible {
            color: var(--web-primary);
            text-decoration: underline;
        }

@media (hover: hover) and (pointer: fine) and (min-width: 1025px) {
    .art-crumb-list a:hover {
        color: var(--web-primary);
        text-decoration: underline;
    }
}

.art-crumb-list [aria-current="page"] {
    color: var(--web-news-title);
    font-weight: 600;
}

.art-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 344px;
    gap: var(--web-space-8);
    align-items: start;
    max-width: var(--web-integration-content);
}

.art-main {
    min-width: 0;
}

.art-head {
    margin-bottom: var(--web-space-6);
}

.art-eyebrow {
    margin-bottom: var(--web-space-3);
    font-size: var(--web-text-sm);
    line-height: var(--web-text-sm-lh);
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--web-primary);
}

.art-title {
    margin: 0;
    font-size: var(--web-display-md);
    line-height: var(--web-display-md-lh);
    font-weight: 700;
    letter-spacing: -.02em;
    color: var(--kv-heading);
}

.art-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--web-space-2);
    margin-top: var(--web-space-4);
    padding-bottom: var(--web-space-4);
    border-bottom: 1px solid var(--web-rule);
    font-size: var(--web-text-sm);
    line-height: var(--web-text-sm-lh);
    color: var(--web-news-meta);
}

    .art-meta a {
        color: inherit;
        text-decoration: none;
    }

        .art-meta a:focus-visible {
            color: var(--web-primary);
            text-decoration: underline;
        }

@media (hover: hover) and (pointer: fine) and (min-width: 1025px) {
    .art-meta a:hover {
        color: var(--web-primary);
        text-decoration: underline;
    }
}

.art-meta-sep {
    color: var(--web-rule);
}

/* 🔴 CHỖ DUY NHẤT CỦA TRANG NỚI RA NGOÀI THANG CHỮ — và chỉ nới LINE-HEIGHT,
      cỡ chữ vẫn đúng bậc:
   
        đoạn thân   16 / **28**   (thang: 16/24)
        đoạn dẫn    18 / **30**   (thang: 18/28)
   
      Lý do là ĐỘ DÀI DÒNG, đo được: cột chính rộng ~904px ở 1920, tức ~110 ký tự
      mỗi dòng ở cỡ 16 — gần gấp đôi mức 60–75 mà chữ dài dễ đọc. Dòng càng dài thì
      mắt càng cần khoảng nghỉ dọc lớn hơn để không nhảy nhầm dòng khi quét về đầu
      dòng sau. 24 là con số hợp cho chữ TRONG THẺ (dòng ngắn), không hợp cho một
      bài 1.400 chữ.
      📌 Cách khác là bó bề rộng đoạn văn về ~680px, nhưng làm thế thì mép phải của
      chữ không còn thẳng với mép ảnh — bài này có 9 ảnh nên cái lệch đó thấy rõ
      suốt trang. Chọn nới line-height. */
.art-body {
    font-size: var(--web-text-md);
    line-height: 28px;
    color: var(--web-news-body);
}

    .art-body > p {
        margin-bottom: var(--web-space-6);
    }

        .art-body > p:last-child {
            margin-bottom: 0;
        }

.art-lead {
    font-size: var(--web-text-lg);
    line-height: 30px;
    font-weight: 500;
    color: var(--web-news-title);
}

.art-body h2 {
    margin: var(--web-space-12) 0 var(--web-space-4);
    font-size: var(--web-display-xs);
    line-height: var(--web-display-xs-lh);
    font-weight: 700;
    color: var(--kv-heading);
    scroll-margin-top: calc(var(--web-header-h) + var(--web-space-6));
}

    .art-body h2:first-child {
        margin-top: 0;
    }

.art-body a {
    color: var(--web-primary);
    text-decoration: underline;
    text-underline-offset: 2px;
}

    .art-body a:focus-visible {
        color: var(--web-primary-dark);
    }

@media (hover: hover) and (pointer: fine) and (min-width: 1025px) {
    .art-body a:hover {
        color: var(--web-primary-dark);
    }
}

.art-body ul,
.art-body ol {
    margin: 0 0 var(--web-space-6);
    padding-left: var(--web-space-6);
    list-style: revert;
}

.art-body li {
    margin-bottom: var(--web-space-2);
}

.art-body blockquote {
    margin: 0 0 var(--web-space-6);
    padding-left: var(--web-space-6);
    border-left: 3px solid var(--web-primary);
    font-size: var(--web-text-lg);
    line-height: 30px;
    color: var(--web-news-title);
}

.art-body strong {
    color: var(--web-news-title);
    font-weight: 600;
}

.art-signature {
    margin-top: var(--web-space-8);
    font-weight: 600;
    font-style: italic;
    color: var(--web-news-title);
}

/* 🔴 **0 BO GÓC** — yêu cầu tường minh của Designer, và cùng hệ với thẻ tin từ
      B51. `border-radius: 0` viết TƯỜNG MINH chứ không dựa vào mặc định: `<figure>`
      không có bán kính mặc định, nhưng dòng này là chỗ để người sau đọc ra rằng
      "phẳng" là quyết định chứ không phải bỏ sót.
      ⚠ `margin: 0` cũng bắt buộc — `css/base.css` KHÔNG reset `<figure>`, mà UA cho
      nó `margin: 1em 40px`. Lỗi này đã dính một lần ở B34 (trang Giới thiệu). */
.art-figure {
    max-width: 720px;
    margin: 0 auto var(--web-space-6);
    border-radius: 0;
}

    .art-figure img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 0;
    }

.art-figure--hero {
    margin-bottom: var(--web-space-8);
}

.art-figure figcaption {
    margin-top: var(--web-space-3);
    text-align: center;
    font-size: var(--web-text-sm);
    line-height: var(--web-text-sm-lh);
    color: var(--web-news-meta);
}

.art-credit {
    font-style: italic;
    white-space: nowrap;
}

.art-share {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--web-space-3);
    margin-top: var(--web-space-8);
    padding-top: var(--web-space-6);
    border-top: 1px solid var(--web-rule);
}

.art-share-label {
    font-size: var(--web-text-sm);
    line-height: var(--web-text-sm-lh);
    font-weight: 600;
    color: var(--web-news-title);
}

.art-share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--web-rule);
    border-radius: 0; /* 🔴 0 bo góc */
    background: none;
    font-size: 18px;
    color: var(--web-news-meta);
    cursor: pointer;
    transition: color var(--web-ease), border-color var(--web-ease);
}

    .art-share-btn:focus-visible {
        color: var(--web-primary);
        border-color: var(--web-primary);
    }

@media (hover: hover) and (pointer: fine) and (min-width: 1025px) {
    .art-share-btn:hover {
        color: var(--web-primary);
        border-color: var(--web-primary);
    }
}

.art-copy-done {
    font-size: var(--web-text-sm);
    line-height: var(--web-text-sm-lh);
    color: var(--web-accent-dark);
}

@media (max-width: 1200px) {
    .art-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .art-side {
        position: static;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
        align-items: start;
        gap: var(--web-space-8);
    }
}

@media (max-width: 768px) {
    .art-title {
        font-size: 28px;
        line-height: 36px;
    }

    .art-body h2 {
        font-size: var(--web-text-xl);
        line-height: 28px;
    }

    .art-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .art-meta-sep {
        display: none;
    }
}