/*
 * Giao diện "muonglan" - Cổng TTĐT xã Mường Lạn
 * Lớp thiết kế riêng, nạp SAU bootstrap + style.css của giao diện default.
 * Mobile-first. Mục tiêu tương phản WCAG 2.2 AA (chữ thường >= 4.5:1, thành phần giao diện >= 3:1).
 */

:root {
    --ml-primary: #8f1a1d;      /* đỏ trầm - nền đầu trang; chữ trắng 9.4:1 */
    --ml-primary-dark: #6c1114;
    --ml-accent: #f6c445;       /* vàng - chỉ dùng làm nền với chữ tối */
    --ml-accent-ink: #3a2a00;
    --ml-link: #0a4d8c;         /* 8.3:1 trên nền trắng */
    --ml-link-hover: #06305a;
    --ml-ink: #1b2430;
    --ml-muted: #4d5866;        /* 7.2:1 trên nền trắng */
    --ml-line: #d5d9df;
    --ml-bg: #f4f2ed;
    --ml-surface: #ffffff;
    --ml-soft: #fbf7ee;
    --ml-ok: #1c6b3c;
    --ml-warn-bg: #fff4d6;
    --ml-warn-ink: #5c3b00;
    --ml-err: #a3161a;
    --ml-focus: #0b57d0;
    --ml-radius: 6px;
    --ml-max: 1320px;
    --ml-font: "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif;
    --ml-heading: var(--ml-primary);
}

/* ------------------------------------------------------------ nền tảng */
html { font-size: 100%; scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--ml-bg);
    color: var(--ml-ink);
    font-family: var(--ml-font);
    font-size: 1.0625rem;
    line-height: 1.6;
    -webkit-text-size-adjust: 100%;
}
a, a:link, a:visited { color: var(--ml-link); text-decoration: underline; text-underline-offset: 2px; }
a:hover, a:active { color: var(--ml-link-hover); }
h1, h2, h3, h4 { color: var(--ml-ink); line-height: 1.3; font-weight: 700; }
img { max-width: 100%; height: auto; }
:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
    outline: 3px solid var(--ml-focus) !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 5px #fff !important;
}
.ml-wrap { width: 100%; max-width: var(--ml-max); margin: 0 auto; padding: 0 16px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.ml-skip { position: absolute; left: 8px; top: -60px; z-index: 1000; background: #fff; color: var(--ml-link) !important; padding: 10px 16px; border: 2px solid var(--ml-focus); border-radius: var(--ml-radius); font-weight: 700; }
.ml-skip:focus { top: 8px; }
.ml-noscript { background: var(--ml-warn-bg); color: var(--ml-warn-ink); padding: 8px 16px; text-align: center; }

/* ------------------------------------------------------------ nút */
.ml-btn, a.ml-btn {
    display: inline-flex; align-items: center; gap: 8px; justify-content: center;
    min-height: 44px; padding: 9px 18px; border-radius: var(--ml-radius);
    border: 2px solid transparent; font-weight: 700; font-size: 1rem; line-height: 1.2;
    text-decoration: none; cursor: pointer; transition: background-color .15s, color .15s;
}
.ml-btn--primary, a.ml-btn--primary { background: var(--ml-primary); color: #fff; border-color: var(--ml-primary); }
.ml-btn--primary:hover, a.ml-btn--primary:hover { background: var(--ml-primary-dark); color: #fff; }
.ml-btn--accent { background: var(--ml-accent); color: var(--ml-accent-ink); border-color: #b98900; }
.ml-btn--accent:hover { background: #ffd666; color: var(--ml-accent-ink); }
.ml-btn--ghost, a.ml-btn--ghost { background: #fff; color: var(--ml-link); border-color: var(--ml-link); }
.ml-btn--ghost:hover, a.ml-btn--ghost:hover { background: #e9f1fa; color: var(--ml-link-hover); }
.ml-btn--lg { min-height: 50px; padding: 12px 26px; font-size: 1.0625rem; }

/* ------------------------------------------------------------ đầu trang */
.ml-emergency { background: #7a0d10; color: #fff; padding: 10px 0; font-size: 1rem; border-bottom: 4px solid var(--ml-accent); }
.ml-emergency a { color: #fff !important; font-weight: 700; margin-left: 8px; }
.ml-header { background: var(--ml-surface); border-bottom: 1px solid var(--ml-line); }
.ml-topbar { background: #2a2f37; color: #fff; font-size: .875rem; }
.ml-topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 36px; flex-wrap: wrap; }
.ml-topbar__tools { list-style: none; margin: 0; padding: 0; display: flex; gap: 12px; }
.ml-lite-toggle { background: transparent; color: #fff; border: 1px solid #9aa3ad; border-radius: 4px; padding: 4px 10px; font-size: .875rem; min-height: 30px; cursor: pointer; }
.ml-lite-toggle[aria-pressed="true"] { background: var(--ml-accent); color: var(--ml-accent-ink); border-color: var(--ml-accent); }
.ml-lite-toggle[aria-pressed="true"]::after { content: ": đang bật"; }

.ml-brand { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 14px; padding-bottom: 14px; flex-wrap: wrap; }
.ml-brand__link, a.ml-brand__link { display: flex; align-items: center; gap: 14px; text-decoration: none; color: var(--ml-ink); min-width: 0; }
.ml-brand__logo { width: 64px; height: 64px; object-fit: contain; flex: none; }
.ml-brand__ph { flex: none; width: 56px; height: 56px; border: 2px dashed #9aa3ad; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--ml-muted); font-weight: 700; font-size: 1rem; background: #f6f7f9; }

/* Chữ lồng "ML": viền vàng xoay, vệt sáng quét, quầng sáng nhịp thở, tia lấp lánh.
   Mọi nhịp sáng đều chậm hơn 3 lần/giây; tắt hẳn ở chế độ tải nhẹ và khi máy đặt "giảm chuyển động". */
.ml-mono { --mx: 50%; --my: 35%; position: relative; flex: none; display: block; width: 54px; height: 54px; margin: 4px 6px 4px 4px; border-radius: 15px; isolation: isolate; transition: transform .35s cubic-bezier(.2, .9, .3, 1.5); }
.ml-mono::after { content: ""; position: absolute; top: -7px; right: -7px; bottom: -7px; left: -7px; z-index: -1; border-radius: 22px; background: radial-gradient(closest-side, rgba(246, 196, 69, .95), rgba(246, 196, 69, .35) 62%, rgba(246, 196, 69, 0)); filter: blur(5px); opacity: .5; animation: ml-mono-glow 2.6s ease-in-out infinite; }
.ml-mono__ring { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: block; padding: 3px; border-radius: inherit; overflow: hidden; box-shadow: 0 2px 6px rgba(60, 10, 12, .4); }
.ml-mono__ring::before { content: ""; position: absolute; left: -50%; top: -50%; width: 200%; height: 200%; background: conic-gradient(#f6c445, #fff8dc 12%, #f6c445 24%, #a61f24 38%, #f6c445 52%, #ffffff 66%, #f6c445 78%, #8f1a1d 90%, #f6c445); animation: ml-mono-spin 5s linear infinite; }
.ml-mono__face { position: relative; display: block; width: 100%; height: 100%; border-radius: 12px; overflow: hidden; background: linear-gradient(160deg, #c62b32 0%, #8f1a1d 55%, #5a0c0f 100%); }
.ml-mono__svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; animation: ml-mono-ltr 2.6s ease-in-out infinite; }
.ml-mono__spot { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(circle at var(--mx) var(--my), rgba(255, 240, 190, .85), rgba(255, 226, 138, .25) 38%, rgba(255, 226, 138, 0) 62%); mix-blend-mode: screen; opacity: 0; transition: opacity .25s; }
.ml-mono__shine { position: absolute; top: -20%; bottom: -20%; left: 0; width: 46%; background: linear-gradient(100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .8) 50%, rgba(255, 255, 255, 0)); transform: translateX(-170%) skewX(-18deg); animation: ml-mono-shine 3.2s ease-in-out infinite; }
.ml-mono__spark { position: absolute; width: 13px; height: 13px; background: radial-gradient(circle, #fff 0, #fff 28%, #ffe28a 60%, #f6c445); clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%); transform: scale(0); pointer-events: none; animation: ml-mono-twinkle 2.4s ease-in-out infinite; }
.ml-mono__spark--1 { top: -8px; right: -8px; }
.ml-mono__spark--2 { bottom: -6px; left: -8px; width: 10px; height: 10px; animation-delay: .8s; }
.ml-mono__spark--3 { top: 6px; left: -10px; width: 8px; height: 8px; animation-delay: 1.5s; }
.ml-mono__spark--4 { bottom: -9px; right: 4px; width: 11px; height: 11px; animation-delay: 1.15s; }
.ml-mono__ripple { position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: inherit; border: 2px solid #f6c445; opacity: 0; pointer-events: none; }

/* Rê chuột / trỏ vào / đưa tiêu điểm bàn phím tới: phóng nhẹ, mọi hiệu ứng nhanh và sáng hơn, đốm sáng bám theo con trỏ */
.ml-brand__link:hover .ml-mono, .ml-brand__link:focus-visible .ml-mono { transform: scale(1.12) rotate(-4deg); }
.ml-brand__link:hover .ml-mono::after, .ml-brand__link:focus-visible .ml-mono::after { animation-duration: 1.1s; top: -11px; right: -11px; bottom: -11px; left: -11px; border-radius: 26px; }
.ml-brand__link:hover .ml-mono__ring::before, .ml-brand__link:focus-visible .ml-mono__ring::before { animation-duration: 1.3s; }
.ml-brand__link:hover .ml-mono__shine, .ml-brand__link:focus-visible .ml-mono__shine { animation-duration: 1.15s; }
.ml-brand__link:hover .ml-mono__svg, .ml-brand__link:focus-visible .ml-mono__svg { animation-duration: 1.1s; }
.ml-brand__link:hover .ml-mono__spark, .ml-brand__link:focus-visible .ml-mono__spark { animation-duration: 1s; width: 16px; height: 16px; }
.ml-brand__link:hover .ml-mono__spot { opacity: 1; }
.ml-brand__link:hover .ml-brand__name { text-shadow: 0 0 14px rgba(246, 196, 69, .55); }
/* Bấm chuột: nhún xuống rồi bung vòng sáng và chớp nhẹ */
.ml-brand__link:active .ml-mono { transform: scale(.92) rotate(2deg); transition-duration: .08s; }
.ml-mono.is-burst .ml-mono__ripple { animation: ml-mono-ripple .7s ease-out; }
.ml-mono.is-burst .ml-mono__face { animation: ml-mono-flash .6s ease-out; }
.ml-mono.is-burst .ml-mono__spark { animation: ml-mono-burst .7s ease-out; }

@keyframes ml-mono-glow { 0%, 100% { opacity: .3; transform: scale(.94); } 50% { opacity: .95; transform: scale(1.08); } }
@keyframes ml-mono-spin { to { transform: rotate(360deg); } }
@keyframes ml-mono-shine { 0% { transform: translateX(-170%) skewX(-18deg); } 55%, 100% { transform: translateX(340%) skewX(-18deg); } }
@keyframes ml-mono-ltr { 0%, 100% { filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .4)); } 50% { filter: drop-shadow(0 0 5px rgba(255, 226, 138, .95)) drop-shadow(0 0 1px #fff); } }
@keyframes ml-mono-twinkle { 0%, 100% { transform: scale(0) rotate(0deg); opacity: 0; } 45% { transform: scale(1) rotate(40deg); opacity: 1; } 60% { transform: scale(.75) rotate(60deg); opacity: .9; } }
@keyframes ml-mono-ripple { 0% { opacity: .95; transform: scale(1); border-width: 3px; } 100% { opacity: 0; transform: scale(2.1); border-width: 1px; } }
@keyframes ml-mono-flash { 0% { filter: brightness(1.9) saturate(1.2); } 100% { filter: none; } }
@keyframes ml-mono-burst { 0% { transform: scale(.4) rotate(0deg); opacity: 1; } 60% { transform: scale(1.7) rotate(90deg); opacity: 1; } 100% { transform: scale(0) rotate(140deg); opacity: 0; } }
.ml-brand__text { display: flex; flex-direction: column; min-width: 0; }
.ml-brand__parent { font-size: .875rem; letter-spacing: .04em; text-transform: uppercase; color: var(--ml-muted); }
.ml-brand__name { margin: 0; font-size: 1.25rem; line-height: 1.25; font-weight: 800; color: var(--ml-primary); text-transform: uppercase; }

.ml-search { position: relative; }
.ml-search--header { display: flex; gap: 6px; flex: 1 1 280px; max-width: 420px; }
.ml-search__input { flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 8px 12px; border: 2px solid #6b7480; border-radius: var(--ml-radius); font-size: 1rem; color: var(--ml-ink); background: #fff; }
.ml-suggest { position: absolute; left: 0; right: 0; top: 100%; z-index: 50; background: #fff; border: 1px solid var(--ml-line); border-radius: 0 0 var(--ml-radius) var(--ml-radius); box-shadow: 0 8px 20px rgba(0, 0, 0, .15); text-align: left; }
.ml-suggest ul { list-style: none; margin: 0; padding: 4px 0; }
.ml-suggest a { display: block; padding: 9px 14px; text-decoration: none; color: var(--ml-ink); }
.ml-suggest a:hover, .ml-suggest a:focus { background: #eef3f9; }
.ml-suggest small { display: block; color: var(--ml-muted); }

/* menu */
.ml-nav { background: var(--ml-primary); }
/* CSS gốc của giao diện default đặt html, body { height: 100% }: khi đó body chỉ cao bằng một màn hình và phần tử
   position: sticky bị kéo đi sau khi cuộn quá chiều cao ấy. Cho body cao theo nội dung để thanh menu ghim suốt trang. */
html, body { height: auto; min-height: 100%; }
.ml-nav--sticky { position: sticky; top: 0; z-index: 900; transition: box-shadow .2s; }
.ml-nav--sticky.is-stuck { box-shadow: 0 4px 14px rgba(0, 0, 0, .35); }
.ml-nav--sticky.is-stuck .ml-menu.is-open, .ml-nav--sticky.is-stuck #ml-menu-list.is-open { max-height: calc(100vh - 60px); overflow-y: auto; }
.ml-nav__sentinel { height: 0; }
html:has(.ml-nav--sticky) { scroll-padding-top: 120px; }
.ml-menu__toggle { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 48px; background: transparent; border: 0; color: #fff; font-weight: 700; font-size: 1rem; cursor: pointer; padding: 0; }
.ml-menu { list-style: none; margin: 0; padding: 0 0 8px; display: none; }
.ml-menu.is-open { display: block; }
.ml-menu li { position: relative; }
.ml-menu > li { border-top: 1px solid rgba(255, 255, 255, .25); display: flex; flex-wrap: wrap; align-items: stretch; }
.ml-menu > li > a { flex: 1 1 auto; display: flex; align-items: center; gap: 6px; min-height: 48px; padding: 8px 4px; color: #fff; text-decoration: none; font-weight: 600; }
.ml-menu > li:hover, .ml-menu > li:focus-within, .ml-menu > li.active, .ml-menu > li.current { background: var(--ml-primary-dark); }
.ml-menu > li.active > a, .ml-menu > li.current > a { color: #ffe9a8; }
.ml-menu__more { flex: none; width: 48px; min-height: 48px; background: transparent; border: 0; border-left: 1px solid rgba(255, 255, 255, .25); color: #fff; cursor: pointer; font-size: 1.125rem; }
.ml-menu__sub { list-style: none; margin: 0; padding: 4px 0 8px 16px; display: none; flex: 1 0 100%; background: var(--ml-primary-dark); }
.ml-menu li.is-open > .ml-menu__sub { display: block; }
.ml-menu__sub a { display: block; padding: 10px 8px; color: #fff; text-decoration: none; min-height: 44px; }
.ml-menu__sub a:hover { background: rgba(255, 255, 255, .14); }

.ml-demo-ribbon { background: var(--ml-warn-bg); color: var(--ml-warn-ink); border-bottom: 1px solid #e5c56b; padding: 8px 0; font-size: .9375rem; }
.ml-demo-ribbon a { color: var(--ml-warn-ink); font-weight: 700; }
.ml-breadcrumb { background: #ebe8e1; font-size: .9375rem; }
.ml-breadcrumb ol { list-style: none; margin: 0; padding: 8px 0; display: flex; flex-wrap: wrap; gap: 4px 0; }
.ml-breadcrumb li + li::before { content: "›"; padding: 0 8px; color: var(--ml-muted); }
.ml-breadcrumb li:last-child a { color: var(--ml-ink); text-decoration: none; }

/* ------------------------------------------------------------ vùng nội dung */
.ml-main { padding: 20px 0 36px; outline: 0; }
.ml-content { background: var(--ml-surface); border: 1px solid var(--ml-line); border-radius: var(--ml-radius); padding: 18px 16px; }
.ml-content--home { background: transparent; border: 0; padding: 0; }
.ml-layout { display: grid; gap: 20px; }
.ml-layout__side > * + * { margin-top: 16px; }
.ml-page h1, .ml-content > h1 { font-size: 1.625rem; margin: 0 0 14px; padding-bottom: 10px; border-bottom: 3px solid var(--ml-primary); }
.ml-page h2 { font-size: 1.25rem; margin: 24px 0 10px; }
.ml-page h3 { font-size: 1.0625rem; margin: 18px 0 8px; }
.ml-lede { font-size: 1.0625rem; color: var(--ml-ink); max-width: 75ch; }
.ml-meta { color: var(--ml-muted); font-size: .9375rem; }
.ml-meta > span + span::before { content: "·"; padding: 0 8px; }
.ml-empty { color: var(--ml-muted); background: #f6f7f9; border: 1px dashed #b9c0c9; border-radius: var(--ml-radius); padding: 12px 14px; }
.ml-pending { color: var(--ml-warn-ink); background: var(--ml-warn-bg); padding: 1px 6px; border-radius: 4px; font-style: italic; }
.ml-break { word-break: break-all; }
.ml-back { margin-top: 24px; }
.ml-actions, .ml-form__actions, .ml-filter__actions, .ml-card__actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0; }

.ml-badge { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: .8125rem; font-weight: 700; background: #e7ecf2; color: #22303f; border: 1px solid #b7c2cf; vertical-align: middle; }
.ml-badge--demo { background: var(--ml-accent); color: var(--ml-accent-ink); border-color: #b98900; letter-spacing: .04em; }
.ml-badge--open { background: #dff3e6; color: #124a29; border-color: #7fbf97; }
.ml-badge--closed, .ml-badge--muted { background: #eceef1; color: #3c4653; border-color: #aab2bd; }
.ml-badge--soon { background: #e3eefb; color: #0b3a6e; border-color: #8fb4de; }

.ml-callout { background: #eef4fb; border-left: 5px solid var(--ml-link); padding: 12px 16px; border-radius: 0 var(--ml-radius) var(--ml-radius) 0; margin: 14px 0; }
.ml-callout h2 { margin-top: 0; font-size: 1.125rem; }
.ml-callout--warn { background: var(--ml-warn-bg); border-left-color: #b98900; color: var(--ml-warn-ink); }
.ml-demo-note, .ml-demo-banner { background: var(--ml-warn-bg); color: var(--ml-warn-ink); border: 1px solid #e5c56b; border-left: 6px solid #b98900; padding: 10px 14px; border-radius: var(--ml-radius); margin: 14px 0; }
.ml-demo-banner a, .ml-demo-note a { color: var(--ml-warn-ink); font-weight: 700; }
.ml-success { background: #e6f4ea; border: 1px solid #8cc7a0; border-left: 6px solid var(--ml-ok); padding: 12px 16px; border-radius: var(--ml-radius); margin: 14px 0; }
.ml-code { font-family: Consolas, "Courier New", monospace; font-size: 1.75rem; font-weight: 700; letter-spacing: .06em; background: #fff; border: 2px dashed var(--ml-ok); display: inline-block; padding: 6px 16px; border-radius: var(--ml-radius); margin: 4px 0 10px; user-select: all; }
.ml-errors { background: #fdecec; border: 1px solid #e3a1a3; border-left: 6px solid var(--ml-err); padding: 12px 16px; border-radius: var(--ml-radius); margin: 14px 0; }
.ml-errors h2, .ml-errors h3 { margin: 0 0 6px; font-size: 1.0625rem; color: var(--ml-err); }
.ml-errors a { color: var(--ml-err); font-weight: 600; }
.ml-field-error { display: block; color: var(--ml-err); font-weight: 600; margin-top: 4px; }
.ml-field-error::before { content: "⚠ "; }

.ml-source { margin: 22px 0 6px; padding: 12px 16px; background: #f6f7f9; border: 1px solid var(--ml-line); border-radius: var(--ml-radius); font-size: .9375rem; }
.ml-source__title, .ml-page .ml-source__title { font-size: 1rem; margin: 0 0 6px; }
.ml-source ul { margin: 0; padding-left: 18px; }
.ml-source__k { font-weight: 600; }
.ml-source a { word-break: break-word; }

/* danh sách */
.ml-sechead { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; border-bottom: 3px solid var(--ml-primary); margin-bottom: 12px; padding-bottom: 6px; }
.ml-sechead h2 { margin: 0; font-size: 1.25rem; text-transform: uppercase; letter-spacing: .02em; color: var(--ml-primary); }
.ml-sechead--sm h2 { font-size: 1.0625rem; }
.ml-more { font-size: .9375rem; white-space: nowrap; }
.ml-list, .ml-doclist { list-style: none; margin: 0; padding: 0; }
.ml-list li, .ml-doclist li { padding: 10px 0; border-bottom: 1px solid #e6e8ec; }
.ml-list li:last-child, .ml-doclist li:last-child { border-bottom: 0; }
.ml-list a, .ml-doclist a { font-weight: 600; text-decoration: none; }
.ml-list a:hover, .ml-doclist a:hover { color: var(--ml-link-hover); }
.ml-list .ml-meta, .ml-doclist .ml-meta { display: block; margin-top: 2px; font-weight: 400; }
.ml-list--compact li { padding: 8px 0; }
.ml-doclist--full li { padding: 14px 0; }
.ml-doclist__title, .ml-page .ml-doclist__title { font-size: 1.0625rem; margin: 0 0 4px; }
.ml-doclist--full p { margin: 4px 0; }
.ml-result-count { margin: 14px 0 4px; }
.ml-inline-dl { display: grid; grid-template-columns: max-content 1fr; gap: 2px 12px; margin: 6px 0 0; font-size: .9375rem; }
.ml-inline-dl dt { font-weight: 600; color: var(--ml-muted); }
.ml-inline-dl dd { margin: 0; }

/* bảng */
.ml-table { background: #fff; }
.ml-table th { background: #f1ede4; color: var(--ml-ink); }
.ml-table--meta th { width: 34%; font-weight: 600; }
.ml-table > tbody > tr > td, .ml-table > tbody > tr > th, .ml-table > thead > tr > th { padding: 9px 12px; border-color: var(--ml-line); }

/* bộ lọc + biểu mẫu */
.ml-filter { background: var(--ml-soft); border: 1px solid #e3dcc8; border-radius: var(--ml-radius); padding: 14px; margin: 12px 0; }
.ml-filter__row { display: grid; gap: 12px; }
.ml-filter label, .ml-field label, .ml-form legend { font-weight: 600; margin-bottom: 4px; display: block; color: var(--ml-ink); }
.ml-filter .form-control, .ml-form .form-control { min-height: 44px; font-size: 1rem; border: 2px solid #6b7480; border-radius: var(--ml-radius); color: var(--ml-ink); box-shadow: none; height: auto; }
.ml-form textarea.form-control { min-height: 140px; }
.ml-form fieldset { border: 1px solid var(--ml-line); border-radius: var(--ml-radius); padding: 14px 16px 6px; margin: 0 0 16px; }
.ml-form legend { width: auto; border: 0; padding: 0 8px; font-size: 1.0625rem; margin: 0; }
.ml-field { margin-bottom: 14px; }
.ml-field-row { display: grid; gap: 0 16px; }
.ml-hint, .ml-form__note { color: var(--ml-muted); font-size: .9375rem; margin: 4px 0 10px; }
.ml-req { color: var(--ml-err); font-weight: 700; }
.ml-check { display: flex; gap: 10px; align-items: flex-start; margin: 10px 0; }
.ml-check input[type="checkbox"] { width: 22px; height: 22px; margin: 3px 0 0; flex: none; }
.ml-check label { font-weight: 400; margin: 0; }
.ml-hp { position: absolute !important; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.ml-captcha__row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.ml-captcha .form-control { max-width: 200px; }
.ml-captcha img { border: 1px solid var(--ml-line); border-radius: 4px; background: #fff; }
[aria-invalid="true"] { border-color: var(--ml-err) !important; background: #fff7f7; }
.ml-form--inline { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.ml-form--inline .ml-field { flex: 1 1 260px; margin: 0; }

/* chi tiết */
.ml-richtext { overflow-wrap: anywhere; }
.ml-richtext table { max-width: 100%; }
.ml-files { list-style: none; padding: 0; margin: 0; }

/* Tệp đính kèm dạng thẻ: biểu tượng theo loại tệp + nút «Xem trực tuyến» / «Tải về» */
.ml-attach { list-style: none; padding: 0; margin: 0 0 16px; display: grid; gap: 10px; }
.ml-attach__item { --ft: #5b6672; --ft-soft: #f1f3f5; position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; padding: 12px 14px; border: 1px solid var(--ml-line); border-left: 5px solid var(--ft); border-radius: 10px; background: linear-gradient(90deg, var(--ft-soft), #fff 46%); transition: box-shadow .2s, transform .2s, border-color .2s; }
.ml-attach__item:hover, .ml-attach__item:focus-within { box-shadow: 0 6px 18px rgba(27, 36, 48, .14); transform: translateY(-2px); border-color: var(--ft); }
.ml-ft--pdf { --ft: #c62828; --ft-soft: #fdecea; }
.ml-ft--word { --ft: #1f5fb4; --ft-soft: #e8f0fb; }
.ml-ft--excel { --ft: #1c7a45; --ft-soft: #e6f4ec; }
.ml-ft--ppt { --ft: #c2410c; --ft-soft: #fdeee4; }
.ml-ft--image { --ft: #7b3fa0; --ft-soft: #f3eaf8; }
.ml-ft--zip { --ft: #8a6100; --ft-soft: #fbf3dc; }
.ml-ft--media { --ft: #0f6e7a; --ft-soft: #e3f3f5; }
/* Biểu tượng trang giấy gập góc, nhãn loại tệp lấy từ data-ext */
.ml-fileicon { position: relative; flex: none; width: 42px; height: 52px; border-radius: 5px 14px 5px 5px; background: linear-gradient(160deg, #fff 55%, var(--ft-soft)); border: 2px solid var(--ft); box-shadow: 0 2px 4px rgba(27, 36, 48, .15); transition: transform .25s cubic-bezier(.2, .9, .3, 1.5); }
.ml-fileicon::before { content: ""; position: absolute; top: -2px; right: -2px; width: 14px; height: 14px; background: linear-gradient(225deg, #fff 48%, var(--ft) 50%); border-radius: 0 12px 0 4px; }
.ml-fileicon::after { content: attr(data-ext); position: absolute; left: -6px; bottom: 7px; min-width: 38px; padding: 2px 5px; border-radius: 4px; background: var(--ft); color: #fff; font-size: .6875rem; font-weight: 800; line-height: 1.35; letter-spacing: .03em; text-align: center; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); }
.ml-attach__item:hover .ml-fileicon { transform: rotate(-6deg) scale(1.08); }
.ml-attach__body { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; gap: 2px; margin-left: 4px; }
.ml-attach__title { font-weight: 700; color: var(--ml-ink); overflow-wrap: anywhere; }
.ml-attach__meta { font-size: .875rem; color: var(--ml-muted); }
.ml-attach__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.ml-attach__btn, a.ml-attach__btn { position: relative; overflow: hidden; display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 8px 16px; border-radius: 999px; border: 2px solid transparent; font-weight: 700; text-decoration: none; white-space: nowrap; cursor: pointer; transition: transform .15s, box-shadow .2s, filter .2s; }
.ml-attach__btn::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 40%; background: linear-gradient(100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .55), rgba(255, 255, 255, 0)); transform: translateX(-140%) skewX(-18deg); }
.ml-attach__btn:hover::after, .ml-attach__btn:focus-visible::after { transform: translateX(360%) skewX(-18deg); transition: transform .6s ease; }
.ml-attach__btn:hover, .ml-attach__btn:focus-visible { transform: translateY(-1px); box-shadow: 0 5px 14px rgba(27, 36, 48, .25); }
.ml-attach__btn:active { transform: translateY(1px) scale(.97); }
.ml-attach__btn--view, a.ml-attach__btn--view { background: linear-gradient(135deg, var(--ml-primary), var(--ml-primary-dark)); color: #fff; }
.ml-attach__btn--view:hover, a.ml-attach__btn--view:hover { color: #fff; filter: brightness(1.12); }
.ml-attach__btn--view[aria-expanded="true"] { background: linear-gradient(135deg, #4d5866, #1b2430); }
.ml-attach__btn--down, a.ml-attach__btn--down { background: linear-gradient(135deg, #ffd666, #f0b323); color: var(--ml-accent-ink); border-color: #b98900; }
.ml-attach__btn--down:hover, a.ml-attach__btn--down:hover { color: var(--ml-accent-ink); filter: brightness(1.05); }
.ml-attach__viewer { flex: 1 0 100%; border: 1px solid var(--ml-line); border-radius: 8px; overflow: hidden; background: #2b2f36; }
.ml-attach__viewer iframe { display: block; width: 100%; height: min(78vh, 820px); border: 0; background: #fff; }
.ml-attach__viewer img { display: block; max-width: 100%; height: auto; margin: 0 auto; }
/* Tệp đính kèm của module tin tức (khung gốc của NukeViet) sau khi được giao diện dựng lại thành thẻ */
.news-download-file.ml-attach { padding: 12px; }
.news-download-file.ml-attach .ml-attach__item .collapse, .news-download-file.ml-attach .ml-attach__item .collapsing { flex: 1 0 100%; }
.news-download-file.ml-attach .well { margin: 0; padding: 0; border: 1px solid var(--ml-line); border-radius: 8px; overflow: hidden; }
@media (max-width: 599px) {
    .ml-attach__actions { flex: 1 0 100%; }
    .ml-attach__btn { flex: 1 1 0; justify-content: center; }
}
.ml-files li { padding: 10px 12px; border: 1px solid var(--ml-line); border-radius: var(--ml-radius); margin-bottom: 8px; background: #fafbfc; }
.ml-toc { background: #f6f7f9; border: 1px solid var(--ml-line); border-radius: var(--ml-radius); padding: 10px 14px; margin: 14px 0; }
.ml-toc ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.ml-quote { border-left: 4px solid #aab2bd; background: #f6f7f9; padding: 10px 14px; border-radius: 0 var(--ml-radius) var(--ml-radius) 0; }
.ml-answer { border-left: 4px solid var(--ml-ok); background: #eef7f1; padding: 10px 14px; border-radius: 0 var(--ml-radius) var(--ml-radius) 0; margin-top: 8px; }
.ml-comments { list-style: none; padding: 0; margin: 0; }
.ml-comments > li { padding: 12px 0; border-bottom: 1px solid #e6e8ec; }
.ml-timeline { margin: 0; padding-left: 20px; }
.ml-timeline li { padding: 4px 0; }
.ml-timeline__time { color: var(--ml-muted); margin-right: 8px; font-variant-numeric: tabular-nums; }
.ml-lookup { border: 1px solid var(--ml-line); border-radius: var(--ml-radius); padding: 4px 16px 14px; margin-top: 18px; background: #fff; }
.ml-linkcards { list-style: none; padding: 0; margin: 16px 0; display: grid; gap: 14px; }
.ml-linkcard { border: 1px solid var(--ml-line); border-radius: var(--ml-radius); padding: 14px 16px; background: #fff; }
.ml-linkcard h2 { margin: 0 0 6px; font-size: 1.125rem; }
.ml-sitemap { display: grid; gap: 8px 28px; }
.ml-sitemap__group h2 { font-size: 1.125rem; margin: 14px 0 6px; color: var(--ml-primary); }
.ml-sitemap ul { margin: 0; padding-left: 20px; }
.ml-sitemap li { padding: 3px 0; }
.ml-tabs ul { list-style: none; margin: 0 0 14px; padding: 0; display: flex; gap: 8px; flex-wrap: wrap; }
.ml-tabs a { display: inline-flex; align-items: center; min-height: 44px; padding: 6px 16px; border: 2px solid var(--ml-link); border-radius: 999px; text-decoration: none; font-weight: 600; }
.ml-tabs a.is-current { background: var(--ml-link); color: #fff; }

/* thư viện */
.ml-albums { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.ml-album, a.ml-album { display: flex; flex-direction: column; gap: 4px; text-decoration: none; color: var(--ml-ink); background: #fff; border: 1px solid var(--ml-line); border-radius: var(--ml-radius); overflow: hidden; padding-bottom: 10px; }
.ml-album img, .ml-album__ph { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: #e9e5dc; display: flex; align-items: center; justify-content: center; color: #8a8f97; font-size: 2rem; }
.ml-album__title { font-weight: 700; padding: 6px 12px 0; color: var(--ml-link); }
.ml-album .ml-meta { padding: 0 12px; }
.ml-gallery { list-style: none; margin: 16px 0; padding: 0; display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.ml-gallery figure { margin: 0; background: #fff; border: 1px solid var(--ml-line); border-radius: var(--ml-radius); overflow: hidden; }
.ml-gallery img, .ml-gallery video { display: block; width: 100%; height: auto; background: #111; }
.ml-gallery figcaption { padding: 10px 12px; }
.ml-gallery__cap { display: block; font-weight: 600; }
.ml-gallery__link { padding: 16px 12px 0; }
.ml-transcript { margin-top: 6px; }
.ml-transcript summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; color: var(--ml-link); font-weight: 600; }

/* khối bên phải */
.ml-box { background: #fff; border: 1px solid var(--ml-line); border-radius: var(--ml-radius); padding: 14px 16px; }
.ml-block__title { margin: 0 0 10px; padding-bottom: 6px; font-size: 1.0625rem; text-transform: uppercase; color: var(--ml-primary); border-bottom: 3px solid var(--ml-primary); }
.ml-block__body ul { padding-left: 18px; margin: 0; }
.ml-block__body li { padding: 4px 0; }

/* ------------------------------------------------------------ trang chủ */
.ml-home > * + * { margin-top: 22px; }
.ml-hero { background: linear-gradient(135deg, var(--ml-primary) 0%, var(--ml-primary-dark) 100%); color: #fff; border-radius: var(--ml-radius); padding: 26px 18px 22px; }
.ml-hero__parent { margin: 0; text-transform: uppercase; letter-spacing: .08em; font-size: .9375rem; color: #ffe9b0; }
.ml-hero__title { margin: 4px 0 6px; color: #fff; font-size: 1.625rem; text-transform: uppercase; }
.ml-hero__desc { margin: 0 0 16px; color: #fff; max-width: 70ch; }
.ml-search--hero { max-width: 760px; }
.ml-search__label { display: block; font-weight: 700; margin-bottom: 6px; color: #fff; }
.ml-search__row { display: flex; gap: 8px; }
.ml-search--hero .ml-search__input { min-height: 52px; font-size: 1.0625rem; border-color: #fff; }
.ml-search--hero .ml-btn { min-height: 52px; white-space: nowrap; }
.ml-search__hint { margin: 6px 0 0; font-size: .9375rem; color: #ffe9b0; }
.ml-hero__kw { margin: 12px 0 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: .9375rem; }
.ml-hero__kw a { color: #fff; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .55); border-radius: 999px; padding: 4px 12px; text-decoration: none; min-height: 32px; display: inline-flex; align-items: center; }
.ml-hero__kw a:hover { background: #fff; color: var(--ml-primary); }
.ml-hero__kw--page { color: var(--ml-ink); }
.ml-hero__kw--page a { color: var(--ml-link); background: #eef3f9; border-color: #a9c1dc; }

.ml-quick__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ml-quick__item, a.ml-quick__item { display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 14px; background: #fff; border: 1px solid var(--ml-line); border-top: 4px solid var(--ml-primary); border-radius: var(--ml-radius); text-decoration: none; color: var(--ml-ink); }
.ml-quick__item .fa { font-size: 1.5rem; color: var(--ml-primary); }
.ml-quick__title { font-weight: 700; color: var(--ml-link); }
.ml-quick__desc { font-size: .9375rem; color: var(--ml-muted); }
.ml-quick__item:hover { border-color: var(--ml-primary); box-shadow: 0 4px 12px rgba(0, 0, 0, .08); }
.ml-quick__item:hover .ml-quick__title { color: var(--ml-link-hover); }

.ml-cols { display: grid; gap: 20px; }
.ml-cols__main, .ml-band { background: #fff; border: 1px solid var(--ml-line); border-radius: var(--ml-radius); padding: 16px; }
.ml-cols__side { display: grid; gap: 20px; align-content: start; }
.ml-band--soft { background: var(--ml-soft); border-color: #e3dcc8; }
.ml-lead { padding-bottom: 12px; border-bottom: 1px solid #e6e8ec; }
.ml-lead__title { margin: 0 0 4px; font-size: 1.3125rem; }
.ml-lead__title a { text-decoration: none; }
.ml-lead__title a:hover { color: var(--ml-link-hover); }
.ml-lead__sum { margin: 6px 0 0; }
.ml-services { display: grid; gap: 18px; }
.ml-fields { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.ml-fields a { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 52px; padding: 8px 14px; border: 1px solid var(--ml-line); border-left: 4px solid var(--ml-link); border-radius: var(--ml-radius); text-decoration: none; font-weight: 600; background: #fff; }
.ml-fields a:hover { background: #eef3f9; }
.ml-count { font-weight: 400; color: var(--ml-muted); font-size: .875rem; white-space: nowrap; }
.ml-dvc { background: #eef4fb; border: 1px solid #b9d0ea; border-radius: var(--ml-radius); padding: 14px 16px; }
.ml-dvc h3 { margin: 0 0 6px; font-size: 1.0625rem; }
.ml-cards { display: grid; gap: 16px; }
.ml-card { background: #fff; border: 1px solid var(--ml-line); border-radius: var(--ml-radius); padding: 14px 16px; display: flex; flex-direction: column; }
.ml-card h3 { margin: 0 0 6px; font-size: 1.125rem; color: var(--ml-primary); }
.ml-card__actions { margin-top: auto; padding-top: 10px; }
.ml-contact { display: grid; gap: 18px; }
.ml-contact__org { display: grid; grid-template-columns: max-content 1fr; gap: 6px 14px; margin: 0; }
.ml-contact__org dt { font-weight: 600; color: var(--ml-muted); }
.ml-contact__org dd { margin: 0; }
.ml-contact__hot h3 { margin: 0 0 8px; font-size: 1.0625rem; }
.ml-hotlines { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.ml-hotlines a { display: flex; flex-direction: column; padding: 8px 12px; min-height: 60px; border: 2px solid var(--ml-err); border-radius: var(--ml-radius); text-decoration: none; color: var(--ml-ink); background: #fff; }
.ml-hotlines strong { font-size: 1.375rem; color: var(--ml-err); line-height: 1.1; }

/* ảnh minh họa tham chiếu từ trang nguồn */
.ml-lead__fig { margin: 0 0 12px; }
.ml-lead__fig img { display: block; width: 100%; max-height: 380px; object-fit: cover; border-radius: var(--ml-radius); background: #e9e5dc; }
.ml-lead__fig figcaption { margin-top: 4px; font-size: .8125rem; }
.ml-list__media { display: flex; gap: 12px; align-items: flex-start; }
.ml-list__media > span { flex: 1 1 auto; min-width: 0; }
.ml-thumb { flex: none; width: 96px; height: 64px; object-fit: cover; border-radius: 4px; background: #e9e5dc; }
.ml-srcimg.is-broken, .is-broken > img, img.is-broken { display: none !important; }
.ml-gallery a.ml-srcimg { display: block; }

/* Thư viện: ảnh phóng to được, video có nút phát nổi, thẻ nhấc lên khi rê chuột */
.ml-gallery figure { transition: box-shadow .2s, transform .2s; }
.ml-gallery li:hover figure, .ml-gallery li:focus-within figure { box-shadow: 0 8px 22px rgba(27, 36, 48, .18); transform: translateY(-3px); }
.ml-gallery .ml-media { position: relative; display: block; overflow: hidden; background: #111; aspect-ratio: 16 / 10; }
.ml-gallery .ml-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.ml-gallery li:hover .ml-media img { transform: scale(1.05); }
.ml-media__play { position: absolute; left: 50%; top: 50%; width: 68px; height: 68px; margin: -34px 0 0 -34px; border-radius: 50%; background: rgba(143, 26, 29, .92); border: 3px solid #fff; box-shadow: 0 4px 16px rgba(0, 0, 0, .45); transition: transform .2s, background .2s; }
.ml-media__play::before { content: ""; position: absolute; left: 26px; top: 18px; border-style: solid; border-width: 13px 0 13px 21px; border-color: transparent transparent transparent #fff; }
.ml-media:hover .ml-media__play, .ml-media:focus-visible .ml-media__play { transform: scale(1.12); background: #c62b32; }
.ml-media__zoom { position: absolute; right: 10px; bottom: 10px; width: 38px; height: 38px; border-radius: 50%; background: rgba(27, 36, 48, .75); color: #fff; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .2s; }
.ml-media:hover .ml-media__zoom, .ml-media:focus-visible .ml-media__zoom { opacity: 1; }
.ml-media__badge { position: absolute; left: 10px; top: 10px; padding: 2px 9px; border-radius: 999px; background: rgba(27, 36, 48, .8); color: #fff; font-size: .8125rem; font-weight: 700; }
.ml-yt iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; background: #000; }
.ml-gallery--video { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.ml-album { transition: box-shadow .2s, transform .2s; }
/* Khối thư viện: ảnh bìa có nhãn loại và số mục; số cột tối đa do quản trị chọn */
.ml-album__media { position: relative; display: block; overflow: hidden; }
.ml-album__kind { position: absolute; left: 8px; bottom: 8px; padding: 2px 9px; border-radius: 999px; background: rgba(27, 36, 48, .82); color: #fff; font-size: .8125rem; font-weight: 700; }
.ml-galblock .ml-albums { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.ml-galblock .ml-albums > li { min-width: 0; }
/* Các thẻ album cao bằng nhau: ảnh bìa cùng tỷ lệ 16:10 (cắt vừa khung), tên tối đa 2 dòng, ngày nằm sát đáy thẻ */
.ml-albums > li { display: flex; flex-direction: column; }
.ml-albums > li > .ml-album { flex: 1 1 auto; }
.ml-album__media { aspect-ratio: 16 / 10; background: #e9e5dc; }
.ml-album__media > img, .ml-album__media > .ml-album__ph { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; }
.ml-album__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; line-height: 1.4; min-height: calc(2.8em + 6px); }
.ml-album .ml-meta { margin-top: auto; }
.ml-album__demo { position: absolute; top: 8px; right: 8px; }
.ml-album__demo .ml-badge { box-shadow: 0 1px 4px rgba(0, 0, 0, .35); }
.ml-album:hover, .ml-album:focus-visible { box-shadow: 0 8px 22px rgba(27, 36, 48, .18); transform: translateY(-3px); }
.ml-album img { transition: transform .45s ease; }
.ml-album:hover img { transform: scale(1.04); }
/* Khung xem ảnh lớn */
.ml-lightbox { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2000; background: rgba(12, 14, 18, .93); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 56px 12px 16px; }
.ml-lightbox[hidden] { display: none; }
.ml-lightbox__img { max-width: 100%; max-height: calc(100vh - 170px); object-fit: contain; border-radius: 4px; box-shadow: 0 10px 40px rgba(0, 0, 0, .6); }
.ml-lightbox__cap { color: #fff; text-align: center; max-width: 900px; padding: 12px 8px 0; }
.ml-lightbox__cap small { display: block; color: #c9ced6; }
.ml-lightbox__btn { position: absolute; width: 48px; height: 48px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .7); background: rgba(27, 36, 48, .7); color: #fff; font-size: 1.25rem; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.ml-lightbox__btn:hover { background: var(--ml-primary); }
.ml-lightbox__close { top: 10px; right: 12px; }
.ml-lightbox__prev { left: 12px; top: 50%; margin-top: -24px; }
.ml-lightbox__next { right: 12px; top: 50%; margin-top: -24px; }
.ml-lightbox__count { position: absolute; top: 20px; left: 16px; color: #c9ced6; }
/* ảnh/chú thích trong trang tin của module news */
.ml-content figure.article { margin: 0 0 14px; }
.ml-content figure.article img, .ml-content .news_column img, .ml-content .bodytext img { max-width: 100%; height: auto; border-radius: var(--ml-radius); }
.ml-content figure figcaption, .ml-content .imghome figcaption { font-size: .875rem; color: var(--ml-muted); margin-top: 4px; }
.ml-content .news_column .imghome img, .ml-content img.imghome, .ml-content .img-thumbnail { object-fit: cover; }

/* ------------------------------------------------------------ chân trang */
.ml-footer { background: linear-gradient(180deg, #262c34, #1d2229); color: #e9ecef; margin-top: 10px; border-top: 4px solid var(--ml-accent); }
.ml-footer a, .ml-footer a:link, .ml-footer a:visited { color: #fff; text-decoration: none; }
.ml-footer h2 { position: relative; color: #fff; font-size: 1.0625rem; margin: 0 0 14px; padding-bottom: 10px; text-transform: uppercase; letter-spacing: .03em; }
.ml-footer h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 46px; height: 3px; border-radius: 2px; background: var(--ml-accent); }
.ml-footer__grid { display: grid; gap: 26px; padding-top: 30px; padding-bottom: 26px; }
.ml-footer__col { min-width: 0; }
.ml-footer__brand, a.ml-footer__brand { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; color: #fff; }
.ml-footer__brand .ml-brand__logo { width: 60px; height: 60px; background: #fff; border-radius: 12px; padding: 4px; }
.ml-footer__brandtext { display: flex; flex-direction: column; min-width: 0; }
.ml-footer__parent { color: #cfd5dc; font-size: .875rem; letter-spacing: .04em; text-transform: uppercase; }
.ml-footer__name { color: #fff; font-size: 1.125rem; font-weight: 800; line-height: 1.3; text-transform: uppercase; }
.ml-footer__brand:hover .ml-footer__name { color: #ffe08a; text-shadow: 0 0 14px rgba(246, 196, 69, .45); }
.ml-footer dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 14px; margin: 0; }
.ml-footer dt { color: #cfd5dc; font-weight: 600; white-space: nowrap; }
.ml-footer dt .fa { color: var(--ml-accent); margin-right: 2px; }
.ml-footer dd { margin: 0; }
.ml-footer .ml-pending { background: #4a3a10; color: #ffe9b0; }
.ml-footer__links ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.ml-footer__links a { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 6px 10px; margin-left: -10px; border-radius: 8px; color: #eef1f4; transition: background .2s, color .2s, transform .2s; }
.ml-footer__links a .fa { flex: none; width: 30px; height: 30px; line-height: 30px; text-align: center; border-radius: 50%; background: rgba(255, 255, 255, .08); color: var(--ml-accent); transition: background .2s, color .2s; }
.ml-footer__links a:hover, .ml-footer__links a:focus-visible { background: rgba(255, 255, 255, .08); color: #ffe08a; transform: translateX(4px); }
.ml-footer__links a:hover .fa, .ml-footer__links a:focus-visible .fa { background: var(--ml-accent); color: var(--ml-accent-ink); }
/* Khối chân trang bị đặt nhầm ở vị trí ngoài chân trang (TOP/BOTTOM/RIGHT...): vẫn đọc được, có khung riêng */
:where(:not(.ml-footer__grid)) > .ml-footer__col { display: block; margin: 14px 0; padding: 16px 18px; border-radius: 10px; background: var(--ml-surface, #fff); border: 1px solid var(--ml-line, #e3e6ea); color: var(--ml-ink, #1d2229); }
:where(:not(.ml-footer__grid)) > .ml-footer__col a.ml-footer__brand { color: inherit; }
:where(:not(.ml-footer__grid)) > .ml-footer__col .ml-footer__parent { color: #5d6670; }
:where(:not(.ml-footer__grid)) > .ml-footer__col .ml-footer__name { color: var(--ml-primary, #8b1a1a); }
:where(:not(.ml-footer__grid)) > .ml-footer__col dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 14px; margin: 0; }
:where(:not(.ml-footer__grid)) > .ml-footer__col dt { color: #5d6670; font-weight: 600; white-space: nowrap; }
:where(:not(.ml-footer__grid)) > .ml-footer__col dt .fa { color: var(--ml-primary, #8b1a1a); margin-right: 2px; }
:where(:not(.ml-footer__grid)) > .ml-footer__col dd { margin: 0; }
:where(:not(.ml-footer__grid)) > .ml-footer__col h2 { color: var(--ml-primary, #8b1a1a); font-size: 1.0625rem; margin: 0 0 12px; text-transform: uppercase; }
:where(:not(.ml-footer__grid)) > .ml-footer__links ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
:where(:not(.ml-footer__grid)) > .ml-footer__links a { display: flex; align-items: center; gap: 10px; min-height: 36px; text-decoration: none; }
.ml-footer__bottom { background: #14181d; font-size: .9375rem; color: #cfd5dc; }
.ml-footer__credit { padding: 12px 0; }
.ml-footer__bottom p { margin: 2px 0; }
.ml-footer__bottom a, .ml-footer__bottom a:link, .ml-footer__bottom a:visited { color: #ffe08a; font-weight: 700; }
.ml-footer__bottom a:hover { color: #fff; }
.ml-totop { position: fixed; right: 14px; bottom: 14px; width: 46px; height: 46px; border-radius: 50%; border: 2px solid #fff; background: var(--ml-primary); color: #fff; cursor: pointer; box-shadow: 0 2px 8px rgba(0, 0, 0, .3); z-index: 40; }

/* ------------------------------------------------------------ trang lỗi */
.ml-errorpage { display: flex; min-height: 100vh; align-items: center; justify-content: center; padding: 20px; }
.ml-errorpage__box { background: #fff; border: 1px solid var(--ml-line); border-top: 6px solid var(--ml-primary); border-radius: var(--ml-radius); padding: 24px 22px; max-width: 640px; width: 100%; }
.ml-errorpage__site { text-transform: uppercase; font-weight: 700; color: var(--ml-primary); margin: 0 0 6px; }
.ml-errorpage__box h1 { font-size: 1.5rem; margin: 0 0 10px; }
.ml-errorpage__actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }

/* ------------------------------------------------------------ module lõi của NukeViet (news, page, contact...) */
.ml-content .panel { border-color: var(--ml-line); box-shadow: none; }
.ml-content .panel-default > .panel-heading { background: #f1ede4; color: var(--ml-ink); font-weight: 700; }
.ml-content .news_column h1, .ml-content .news_column .title, .ml-content h1.title { font-size: 1.625rem; line-height: 1.3; }
.ml-content .bodytext { font-size: 1.0625rem; line-height: 1.7; overflow-wrap: anywhere; }
.ml-content .btn { min-height: 40px; }
.ml-content .form-control { font-size: 1rem; min-height: 42px; }
.ml-content .pagination > li > a, .ml-content .pagination > li > span { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; color: var(--ml-link); }
.ml-content .pagination > .active > a, .ml-content .pagination > .active > span { background: var(--ml-primary); border-color: var(--ml-primary); color: #fff; }
.pagination > li > a { color: var(--ml-link); }
.text-muted { color: var(--ml-muted) !important; }

/* ------------------------------------------------------------ lịch công tác */
.ml-ev--meeting { --ev: #1f5fb4; --ev-soft: #e8f0fb; }
.ml-ev--reception { --ev: #1c7a45; --ev-soft: #e6f4ec; }
.ml-ev--field { --ev: #8a6100; --ev-soft: #fbf3dc; }
.ml-ev--event { --ev: #a61f24; --ev-soft: #fdecea; }
.ml-ev--deadline { --ev: #7b3fa0; --ev-soft: #f3eaf8; }
.ml-ev--other, .ml-ev--all { --ev: #4d5866; --ev-soft: #eef0f3; }
.ml-sched__kinds ul { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ml-sched__kind, a.ml-sched__kind { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 5px 14px; border-radius: 999px; border: 2px solid var(--ev); background: var(--ev-soft); color: var(--ml-ink); font-weight: 600; text-decoration: none; }
.ml-sched__kind .fa { color: var(--ev); }
.ml-sched__kind.is-current, .ml-sched__kind:hover { background: var(--ev); color: #fff; }
.ml-sched__kind.is-current .fa, .ml-sched__kind:hover .fa { color: #fff; }
.ml-sched__layout { display: grid; gap: 20px; }
.ml-sched__bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--ml-primary); color: #fff; border-radius: 8px 8px 0 0; padding: 6px 8px; }
.ml-sched__bar h2 { margin: 0; color: #fff; font-size: 1.0625rem; text-align: center; }
.ml-sched__bar small { color: #ffe08a; font-weight: 400; }
.ml-sched__nav, a.ml-sched__nav { flex: none; width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; text-decoration: none; }
.ml-sched__nav:hover { background: rgba(255, 255, 255, .2); color: #fff; }
.ml-cal { width: 100%; border-collapse: collapse; table-layout: fixed; background: #fff; border: 1px solid var(--ml-line); }
.ml-cal th { padding: 8px 0; text-align: center; font-size: .875rem; color: var(--ml-muted); background: #f6f4ef; border-bottom: 1px solid var(--ml-line); }
.ml-cal th abbr { text-decoration: none; border: 0; cursor: default; }
.ml-cal td { padding: 2px; text-align: center; border: 1px solid #eef0f3; }
.ml-cal td a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 46px; border-radius: 8px; color: var(--ml-ink); text-decoration: none; font-weight: 600; }
.ml-cal td a:hover { background: #fbf3dc; }
.ml-cal td.is-out a { color: #9aa3ad; font-weight: 400; }
.ml-cal td.is-week { background: #fdf6f6; }
.ml-cal td.is-today a { box-shadow: inset 0 0 0 2px var(--ml-primary); }
.ml-cal td.is-sel a { background: var(--ml-primary); color: #fff; }
.ml-cal__dots { display: flex; gap: 3px; height: 7px; }
.ml-cal__dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--ev); }
.ml-cal td.is-sel .ml-cal__dots i { box-shadow: 0 0 0 1px #fff; }
.ml-sched__today { margin: 12px 0 0; text-align: center; }
.ml-sched__day { border: 1px solid var(--ml-line); border-top: 0; background: #fff; padding: 10px 14px 12px; }
.ml-sched__day:last-child { border-radius: 0 0 8px 8px; }
.ml-sched__day h3 { margin: 0 0 8px; font-size: 1rem; display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.ml-sched__dow { color: var(--ml-primary); font-weight: 800; text-transform: uppercase; }
.ml-sched__date { color: var(--ml-muted); font-weight: 600; }
.ml-sched__day.is-today { background: #fffaf0; box-shadow: inset 4px 0 0 var(--ml-accent); }
.ml-sched__day.is-empty { padding-bottom: 8px; }
.ml-badge--today { background: var(--ml-primary); color: #fff; border-color: var(--ml-primary); }
.ml-sched__none { margin: 0; color: var(--ml-muted); font-style: italic; }
.ml-sched__item { display: grid; grid-template-columns: 1fr; gap: 4px 14px; padding: 10px 12px; margin-bottom: 8px; border-radius: 8px; border-left: 5px solid var(--ev); background: linear-gradient(90deg, var(--ev-soft), #fff 60%); }
.ml-sched__item:last-child { margin-bottom: 0; }
.ml-sched__time { margin: 0; font-weight: 800; color: var(--ev); }
.ml-sched__item h4 { margin: 0 0 2px; font-size: 1.0625rem; line-height: 1.35; }
.ml-sched__kindtag { margin: 0 0 6px; font-size: .875rem; color: var(--ev); font-weight: 600; }
.ml-sched__item dl { display: grid; grid-template-columns: max-content 1fr; gap: 2px 12px; margin: 0; }
.ml-sched__item dt { color: var(--ml-muted); font-weight: 600; }
.ml-sched__item dd { margin: 0; }
/* Hộp lịch sắp tới ở trang chủ */
.ml-agenda { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ml-agenda li { display: flex; gap: 12px; align-items: flex-start; }
.ml-agenda__date { flex: none; width: 54px; border-radius: 8px; overflow: hidden; text-align: center; border: 1px solid var(--ml-line); background: #fff; line-height: 1.2; }
.ml-agenda__date b { display: block; background: var(--ml-primary); color: #fff; font-size: .75rem; padding: 2px 0; font-weight: 600; }
.ml-agenda__date span { display: block; font-size: 1.25rem; font-weight: 800; color: var(--ml-ink); padding: 3px 0; }
.ml-agenda__body { min-width: 0; }
.ml-agenda__body a { font-weight: 600; text-decoration: none; }
.ml-agenda__body a:hover, .ml-agenda__body a:focus-visible { color: var(--sec, var(--ml-link-hover)); }

/* ------------------------------------------------------------ hộp tin chạy (Thông báo, Chỉ đạo điều hành) */
.ml-ticker { position: relative; }
.ml-ticker.is-running { overflow: hidden; }
.ml-ticker.is-running > ul { will-change: transform; }
.ml-ticker.is-static { overflow-y: auto; }
/* Màn hình rộng: cột hộp tin cao đúng bằng khung «Tin mới» bên cạnh; các hộp chia đều chiều cao, phần tin vượt quá được cuộn/chạy */
@media (min-width: 992px) {
    .ml-cols__side--fill { display: flex; flex-direction: column; gap: 20px; min-height: 0; }
    .ml-cols__side--fill > .ml-box { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
    .ml-cols__side--fill > .ml-box > .ml-sechead { flex: none; }
    .ml-cols__side--fill > .ml-box > .ml-ticker { flex: 1 1 auto; min-height: 0; overflow: hidden; }
    .ml-cols__side--fill > .ml-box > .ml-ticker:not(.is-running) { overflow-y: auto; scrollbar-width: thin; }
}
.ml-ticker__toggle { flex: none; width: 34px; height: 34px; margin-left: auto; border-radius: 50%; border: 1px solid var(--ml-line); background: #fff; color: var(--ml-primary); cursor: pointer; }
.ml-ticker__toggle:hover { background: var(--ml-primary); color: #fff; }
.ml-sechead .ml-ticker__toggle + .ml-more { margin-left: 4px; }
.ml-list__sum { display: block; color: var(--ml-muted); font-size: .9375rem; margin-top: 2px; }
.ml-new { display: inline-block; margin-right: 6px; padding: 0 7px; border-radius: 999px; background: #c62828; color: #fff; font-size: .75rem; font-weight: 800; line-height: 1.6; vertical-align: 2px; text-transform: uppercase; animation: ml-new-pulse 1.6s ease-in-out infinite; }
.ml-box--hl { position: relative; border-color: #e5c56b; box-shadow: 0 4px 16px rgba(143, 26, 29, .12); animation: ml-box-in .7s ease-out both; }
.ml-box--hl::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; border-radius: var(--ml-radius) var(--ml-radius) 0 0; background: linear-gradient(90deg, var(--ml-primary), var(--ml-accent), var(--ml-primary)); background-size: 200% 100%; animation: ml-box-bar 3.5s linear infinite; }
.ml-box--hl .ml-sechead h2::before { content: "\f0a1"; font-family: FontAwesome; font-weight: 400; margin-right: 8px; color: #c62828; display: inline-block; transform-origin: 50% 0; animation: ml-bell 2.8s ease-in-out infinite; }
.ml-box--hl .ml-list li { border-radius: 6px; transition: background .2s; }
.ml-box--hl .ml-list li:hover { background: #fff7e0; }
@keyframes ml-new-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(198, 40, 40, .55); } 60% { box-shadow: 0 0 0 7px rgba(198, 40, 40, 0); } }
@keyframes ml-box-in { 0% { opacity: 0; transform: translateY(14px); box-shadow: 0 0 0 4px rgba(246, 196, 69, .9); } 60% { opacity: 1; transform: none; box-shadow: 0 0 0 4px rgba(246, 196, 69, .9); } 100% { box-shadow: 0 4px 16px rgba(143, 26, 29, .12); } }
@keyframes ml-box-bar { to { background-position: -200% 0; } }
@keyframes ml-bell { 0%, 70%, 100% { transform: rotate(0); } 75% { transform: rotate(-16deg); } 82% { transform: rotate(14deg); } 89% { transform: rotate(-9deg); } 95% { transform: rotate(5deg); } }
.ml-lite .ml-new, .ml-lite .ml-box--hl, .ml-lite .ml-box--hl::before, .ml-lite .ml-box--hl .ml-sechead h2::before { animation: none !important; }
@media (min-width: 992px) {
    .ml-sched__layout { grid-template-columns: 340px 1fr; align-items: start; }
    .ml-sched__month { position: sticky; top: 12px; }
    .ml-sched__item { grid-template-columns: 150px 1fr; }
}

/* ------------------------------------------------------------ tùy chỉnh hiển thị của người xem (lưu bằng cookie chức năng ml_ui) */
.ml-ui { position: relative; }
.ml-ui__open { background: transparent; color: #fff; border: 1px solid #9aa3ad; border-radius: 4px; padding: 4px 12px; font-size: .875rem; min-height: 30px; cursor: pointer; }
.ml-ui__open:hover, .ml-ui__open[aria-expanded="true"] { background: var(--ml-accent); color: var(--ml-accent-ink); border-color: var(--ml-accent); }
.ml-ui__panel { position: absolute; right: 0; top: calc(100% + 8px); z-index: 1000; width: min(92vw, 380px); padding: 14px 16px 16px; border-radius: 10px; background: var(--ml-surface); color: var(--ml-ink); border: 1px solid var(--ml-line); box-shadow: 0 14px 40px rgba(0, 0, 0, .35); font-size: .9375rem; }
.ml-ui__panel[hidden] { display: none; }
.ml-ui__panel fieldset { border: 0; margin: 0 0 12px; padding: 0; min-width: 0; }
.ml-ui__panel legend { float: none; width: auto; margin: 0 0 6px; padding: 0; border: 0; font-size: .875rem; font-weight: 700; color: var(--ml-muted); text-transform: uppercase; letter-spacing: .03em; }
.ml-ui__opts { display: flex; flex-wrap: wrap; gap: 6px; }
.ml-ui__opts button { min-height: 38px; padding: 5px 12px; border-radius: 8px; border: 2px solid var(--ml-line); background: var(--ml-surface); color: var(--ml-ink); font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.ml-ui__opts button:hover { border-color: var(--ml-link); }
.ml-ui__opts button[aria-pressed="true"] { border-color: var(--ml-primary); background: var(--ml-primary); color: #fff; }
.ml-ui__sw { width: 16px; height: 16px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, .35); }
.ml-ui__reset { background: none; border: 0; padding: 4px 0; color: var(--ml-link); text-decoration: underline; cursor: pointer; }
.ml-ui__panel .ml-lite-toggle { border: 2px solid var(--ml-line); color: var(--ml-ink); min-height: 38px; border-radius: 8px; font-size: .9375rem; font-weight: 600; }
.ml-ui__panel .ml-lite-toggle[aria-pressed="true"] { background: var(--ml-primary); color: #fff; border-color: var(--ml-primary); }
/* Cỡ chữ, phông chữ, bề ngang */
html.ml-fs-1 { font-size: 90%; }
html.ml-fs-3 { font-size: 112.5%; }
html.ml-fs-4 { font-size: 125%; }
html.ml-font-serif { --ml-font: Georgia, "Times New Roman", "Noto Serif", serif; }
html.ml-font-read { --ml-font: Verdana, Tahoma, "DejaVu Sans", sans-serif; }
html.ml-font-read body { letter-spacing: .01em; word-spacing: .04em; }
html.ml-wide { --ml-max: 1720px; }
/* Màu chủ đạo (độ tương phản chữ trắng trên nền chủ đạo đều trên 7:1) */
html.ml-c-blue { --ml-primary: #0d4a8a; --ml-primary-dark: #08325e; }
html.ml-c-green { --ml-primary: #14633a; --ml-primary-dark: #0c4427; }
html.ml-c-brown { --ml-primary: #7a4a12; --ml-primary-dark: #563209; }
html.ml-c-teal { --ml-primary: #0d5c5f; --ml-primary-dark: #084144; }   /* xanh ngọc: chữ trắng 7.7:1 */
html.ml-c-indigo { --ml-primary: #3b3a86; --ml-primary-dark: #292861; } /* chàm: chữ trắng 9.8:1 */
html.ml-c-teal:not(.ml-dark) { --ml-bg: #eef4f3; --ml-soft: #f1f8f7; --ml-line: #cfdcda; }
html.ml-c-indigo:not(.ml-dark) { --ml-bg: #f2f2f8; --ml-soft: #f4f4fb; --ml-line: #d6d7e4; }
/* Chế độ tối */
html.ml-dark { color-scheme: dark; --ml-bg: #12161b; --ml-surface: #1c2229; --ml-ink: #e8ebef; --ml-muted: #b4bdc8; --ml-line: #38424d; --ml-link: #8cc4ff; --ml-link-hover: #c6e2ff; --ml-soft: #232a32; --ml-warn-bg: #3b3011; --ml-warn-ink: #ffe6a3; --ml-focus: #9cc7ff; --ml-ok: #7fd6a2; --ml-err: #ff9a9a; --ml-heading: #ffb0a8; }
html.ml-dark.ml-c-blue { --ml-heading: #9ccaff; }
html.ml-dark.ml-c-green { --ml-heading: #8fdcae; }
html.ml-dark.ml-c-brown { --ml-heading: #f0c58a; }
html.ml-dark.ml-c-teal { --ml-heading: #86d9d6; }
html.ml-dark.ml-c-indigo { --ml-heading: #bcbbff; }
html.ml-dark :is(.ml-content, .ml-box, .ml-card, .ml-album, .ml-gallery figure, .ml-table, .ml-lookup, .ml-linkcard, .ml-quick__item, .ml-cols__main, .ml-band, .ml-fields a, .ml-hotlines a, .ml-errorpage__box, .ml-cal, .ml-sched__day, .ml-agenda__date, .ml-ticker__toggle, .ml-search__input, .ml-suggest, .ml-code, .ml-btn--ghost, .ml-files li, .ml-source, .ml-filter, .ml-form, .ml-meta-table, .ml-doc table) { background: var(--ml-surface); color: var(--ml-ink); border-color: var(--ml-line); }
html.ml-dark :is(.panel, .panel-body, .panel-footer, .well, .list-group-item, .modal-content, .dropdown-menu, .breadcrumb, .thumbnail, .img-thumbnail, .form-control, .input-group-addon, .pagination > li > a, .pagination > li > span, .table, .nav-tabs > li.active > a, .news_column, .panel-default > .panel-heading, .btn-default, select, textarea, input[type="text"], input[type="search"], input[type="email"], input[type="tel"], input[type="number"]) { background-color: var(--ml-surface); color: var(--ml-ink); border-color: var(--ml-line); }
html.ml-dark :is(.table > tbody > tr > td, .table > tbody > tr > th, .table > thead > tr > th, .ml-table th, .ml-table td, .ml-cal th, .ml-cal td) { background-color: transparent; color: var(--ml-ink); border-color: var(--ml-line); }
html.ml-dark :is(.table-striped > tbody > tr:nth-of-type(odd), .ml-table tr:nth-child(even), .ml-cal th) { background-color: #232a32; }
html.ml-dark :is(h1, h2, h3, h4, h5, .ml-attach__title, .ml-agenda__date span, .ml-album__title, .ml-suggest a, .ml-cal td a, .ml-sched__kind) { color: var(--ml-ink); }
html.ml-dark :is(.ml-sechead h2, .ml-brand__name, .ml-sched__dow, .ml-page > h1, .ml-content > h1) { color: var(--ml-heading); }
html.ml-dark .ml-sechead, html.ml-dark .ml-page h1, html.ml-dark .ml-content > h1 { border-bottom-color: var(--ml-heading); }
html.ml-dark .ml-breadcrumb { background: #181d23; }
html.ml-dark .ml-header { background: var(--ml-surface); }
html.ml-dark .ml-attach__item, html.ml-dark .ml-sched__item, html.ml-dark .ml-sched__kind { --ft-soft: #252d36; --ev-soft: #252d36; }
html.ml-dark .ml-sched__day.is-today { background: #2a2618; }
html.ml-dark .ml-cal td.is-week { background: #242026; }
html.ml-dark .ml-cal td a:hover, html.ml-dark .ml-box--hl .ml-list li:hover { background: #2c3440; }
html.ml-dark .ml-fileicon { background: linear-gradient(160deg, #f4f6f8 55%, #cfd5dc); }
html.ml-dark .ml-pending { background: #4a3a10; color: #ffe9b0; }
html.ml-dark .ml-demo-ribbon, html.ml-dark .ml-note { background: var(--ml-warn-bg); color: var(--ml-warn-ink); border-color: #6b5a22; }
html.ml-dark .ml-demo-ribbon a { color: var(--ml-warn-ink); }
html.ml-dark .text-muted, html.ml-dark .ml-meta { color: var(--ml-muted) !important; }
html.ml-dark img:not(.ml-brand__logo) { filter: brightness(.92); }
html.ml-dark .ml-footer { border-top-color: var(--ml-accent); }

/* ------------------------------------------------------------ chế độ tải nhẹ + giảm chuyển động */
.ml-lite .ml-album img, .ml-lite .ml-gallery img, .ml-lite .ml-content img:not(.captchaImg), .ml-lite .ml-home img, .ml-lite .ml-lead__fig, .ml-lite video { display: none !important; }
.ml-lite .ml-hero { background: var(--ml-primary); }
.ml-lite * { transition: none !important; box-shadow: none; }
.ml-lite .ml-mono, .ml-lite .ml-mono *, .ml-lite .ml-mono::after, .ml-lite .ml-mono__ring::before { animation: none !important; transform: none !important; }
.ml-lite .ml-mono::after, .ml-lite .ml-mono__shine, .ml-lite .ml-mono__spark, .ml-lite .ml-mono__spot { display: none; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition: none !important; animation: none !important; }
    .ml-mono__shine, .ml-attach__btn::after { display: none; }
    /* Máy đặt "giảm chuyển động": chữ lồng ML vẫn lấp lánh bằng thay đổi độ sáng, không xoay - không trượt - không phóng */
    html:not(.ml-lite) .ml-mono::after { animation: ml-mono-fade-glow 2.6s ease-in-out infinite !important; }
    html:not(.ml-lite) .ml-mono__svg { animation: ml-mono-ltr 2.6s ease-in-out infinite !important; }
    html:not(.ml-lite) .ml-mono__spark { transform: rotate(20deg); opacity: 0; animation: ml-mono-fade 2.4s ease-in-out infinite !important; }
    html:not(.ml-lite) .ml-brand__link:hover .ml-mono::after { animation-duration: 1.1s !important; }
    html:not(.ml-lite) .ml-brand__link:hover .ml-mono__spark { animation-duration: 1s !important; }
}
@keyframes ml-mono-fade-glow { 0%, 100% { opacity: .3; } 50% { opacity: .95; } }
@keyframes ml-mono-fade { 0%, 100% { opacity: 0; } 50% { opacity: 1; } }

/* ------------------------------------------------------------ điểm ngắt */
@media (min-width: 600px) {
    .ml-filter__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ml-filter__field--wide { grid-column: 1 / -1; }
    .ml-field-row { grid-template-columns: 1fr 1fr; }
    .ml-quick__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ml-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ml-sitemap { grid-template-columns: 1fr 1fr; }
    .ml-linkcards { grid-template-columns: 1fr 1fr; }
    .ml-contact { grid-template-columns: 1fr 1fr; }
    .ml-footer__grid { grid-template-columns: 1.3fr 1fr; }
    .ml-footer__links ul { grid-template-columns: 1fr; }
    .ml-hero { padding: 34px 28px 28px; }
    .ml-hero__title { font-size: 2rem; }
    .ml-brand__name { font-size: 1.5rem; }
    .ml-content { padding: 22px 24px; }
}
@media (min-width: 992px) {
    .ml-menu__toggle { display: none; }
    .ml-menu { display: flex !important; flex-wrap: wrap; padding: 0; }
    .ml-menu > li { border-top: 0; flex-wrap: nowrap; }
    .ml-menu > li > a { padding: 8px 11px; min-height: 50px; }
    .ml-nav--sticky.is-stuck .ml-menu > li > a, .ml-nav--sticky.is-stuck .ml-menu__more { min-height: 42px; padding-top: 4px; padding-bottom: 4px; }
    .ml-menu__more { width: 30px; min-height: 50px; border-left: 0; margin-left: -10px; }
    .ml-menu__sub { position: absolute; left: 0; top: 100%; min-width: 270px; z-index: 60; padding: 6px 0; box-shadow: 0 8px 20px rgba(0, 0, 0, .25); border-radius: 0 0 var(--ml-radius) var(--ml-radius); }
    .ml-menu__sub a { padding: 10px 16px; }
    .ml-menu > li:hover > .ml-menu__sub, .ml-menu > li:focus-within > .ml-menu__sub { display: block; }
    .ml-menu__sub .ml-menu__sub { position: static; box-shadow: none; padding-left: 16px; display: block; }
    .ml-layout { grid-template-columns: minmax(0, 1fr) 320px; }
    .ml-cols { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
    .ml-cols--even { grid-template-columns: 1fr 1fr; }
    .ml-quick__list { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .ml-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ml-services { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
    .ml-filter__row { grid-template-columns: 2fr 1fr 1fr 1fr; }
    .ml-filter__field--wide { grid-column: auto; }
    .ml-filter__field--narrow { max-width: 180px; }
    .ml-footer__grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
    .ml-footer__links:last-child ul, .ml-footer__links:nth-child(2):last-child ul { grid-template-columns: 1fr 1fr; column-gap: 18px; }
    .ml-sitemap { grid-template-columns: repeat(3, 1fr); }
}

@media print {
    .ml-topbar, .ml-nav, .ml-search, .ml-footer__links, .ml-totop, .ml-demo-ribbon, .ml-filter, .ml-breadcrumb { display: none !important; }
    body { background: #fff; }
    .ml-content { border: 0; padding: 0; }
    a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .85em; }
}

@media (min-width: 992px) {
    .ml-galblock .ml-albums--c2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ml-galblock .ml-albums--c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ml-galblock .ml-albums--c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .ml-galblock .ml-albums--c5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .ml-galblock .ml-albums--c6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

/* ------------------------------------------------------------ trang chủ: họa tiết trang trí ở nửa phải khối mở đầu (màn hình rộng) */
@media (min-width: 992px) {
    .ml-hero { position: relative; overflow: hidden; }
    .ml-hero > * { position: relative; z-index: 1; }
    .ml-hero::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 48%; pointer-events: none; background-image: repeating-linear-gradient(45deg, rgba(246, 196, 69, .2) 0, rgba(246, 196, 69, .2) 2px, transparent 2px, transparent 26px), repeating-linear-gradient(-45deg, rgba(246, 196, 69, .2) 0, rgba(246, 196, 69, .2) 2px, transparent 2px, transparent 26px), radial-gradient(circle at 78% 50%, rgba(246, 196, 69, .22), transparent 55%); -webkit-mask-image: linear-gradient(90deg, transparent, #000 55%); mask-image: linear-gradient(90deg, transparent, #000 55%); }
}
@media print {
    .ml-ui, .ml-hero::after { display: none !important; }
}

/* ------------------------------------------------------------ nhịp khoảng cách giữa các khối: gọn, đều, liền mạch */
.ml-main { padding: 14px 0 22px; }
.ml-content.ml-content--home { padding: 0; }   /* trang chủ: nội dung thẳng mép với đầu trang và menu */
.ml-home > * + * { margin-top: 14px; }
.ml-cols, .ml-cols__side { gap: 14px; }
.ml-quick__list { gap: 10px; }
.ml-footer { margin-top: 0; }
@media (min-width: 992px) {
    .ml-cols__side--fill { gap: 14px; }
}

/* ------------------------------------------------------------ trang con: cùng nhịp khoảng cách 14px với trang chủ */
.ml-breadcrumb ol { padding: 6px 0; }
.ml-layout { gap: 14px; }
.ml-layout__side > * + * { margin-top: 14px; }
.ml-content > .ml-box + .ml-box, .ml-content > * + .ml-box, .ml-content > .ml-box + * { margin-top: 14px; }
.ml-page h1, .ml-content > h1 { margin-bottom: 12px; padding-bottom: 8px; }
.ml-page h2 { margin: 18px 0 8px; }
.ml-page > h2:first-child, .ml-page > section:first-child > h2 { margin-top: 0; }
.ml-filter { margin: 10px 0 12px; }
.ml-result-count { margin: 10px 0 4px; }
.ml-source { margin: 16px 0 6px; }
.ml-back { margin-top: 16px; margin-bottom: 0; }
.ml-attach { margin-bottom: 12px; }
.ml-albums { gap: 14px; }
.ml-gallery { margin: 14px 0; gap: 14px; }
.ml-sched__kinds ul { margin-bottom: 12px; }
.ml-sched__layout { gap: 14px; }
.ml-content .panel, .ml-layout__side .panel { margin-bottom: 14px; }
.ml-content .panel:last-child, .ml-content > :last-child, .ml-page > :last-child { margin-bottom: 0; }
.ml-content .page-header { margin: 0 0 12px; padding-bottom: 8px; }
.ml-content .news_column { margin-bottom: 14px; }
.ml-demo-note, .ml-demo-banner { margin-top: 14px; margin-bottom: 14px; }
@media (min-width: 600px) {
    .ml-content { padding: 18px 20px; }
    .ml-content.ml-content--home { padding: 0; }
}
@media (min-width: 992px) {
    .ml-layout { grid-template-columns: minmax(0, 1fr) 320px; align-items: start; }
}
@media print {
    .ml-content { padding: 0; }
}

/* ------------------------------------------------------------ khung tiêu đề khối theo nhóm nội dung
   Mỗi khối có một màu nhận diện (--sec) hài hòa với đỏ - vàng chủ đạo: dải tiêu đề nền nhạt chạy hết bề ngang thẻ,
   nhãn tiêu đề là "thẻ tab" màu đặc có biểu tượng, nút «Xem tất cả» dạng viên nằm bên phải.
   Chữ trắng trên mọi màu --sec đều đạt tương phản từ 5:1 trở lên. */
.ml-sec { --sec: var(--ml-primary); --sec-soft: #fbeeee; --ico: "\f0c9"; --pad-y: 16px; --pad-x: 16px; box-shadow: 0 1px 3px rgba(27, 36, 48, .08); }
.ml-box.ml-sec { --pad-y: 14px; }
.ml-sec > .ml-sechead { align-items: center; margin: calc(-1 * var(--pad-y)) calc(-1 * var(--pad-x)) 12px; padding: 0 12px 0 0; background: var(--sec-soft); border-bottom: 2px solid var(--sec); border-radius: 5px 5px 0 0; min-height: 42px; }
.ml-sec > .ml-sechead h2 { display: inline-flex; align-items: center; gap: 8px; align-self: stretch; margin: 0; padding: 0 26px 0 14px; background: var(--sec); color: #fff; font-size: 1.0625rem; letter-spacing: .03em; border-radius: 5px 0 0 0; clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 100%, 0 100%); }
.ml-sec > .ml-sechead h2::before { content: var(--ico); font-family: FontAwesome; font-weight: 400; font-size: 1rem; color: #ffe08a; margin: 0; display: inline-block; }
.ml-sec > .ml-sechead .ml-more, .ml-sec > .ml-sechead a.ml-more { display: inline-flex; align-items: center; gap: 4px; padding: 3px 12px; border: 1px solid var(--sec); border-radius: 999px; background: #fff; color: var(--sec); font-size: .875rem; font-weight: 600; text-decoration: none; transition: background .2s, color .2s; }
.ml-sec > .ml-sechead .ml-more::after { content: "\203A"; font-size: 1.1em; line-height: 1; }
.ml-sec > .ml-sechead .ml-more:hover, .ml-sec > .ml-sechead .ml-more:focus-visible { background: var(--sec); color: #fff; }
.ml-sec > .ml-sechead .ml-ticker__toggle { width: 30px; height: 30px; border-color: var(--sec); color: var(--sec); }
.ml-sec > .ml-sechead .ml-ticker__toggle:hover { background: var(--sec); color: #fff; }
.ml-sec .ml-list a:hover, .ml-sec .ml-doclist a:hover { color: var(--sec); }
/* Bảng màu theo nhóm nội dung */
.ml-sec--news { --ico: "\f1ea"; }
.ml-sec--notices { --sec: #b45309; --sec-soft: #fff4e0; --ico: "\f0a1"; }
.ml-sec--direction { --sec: #1d4f91; --sec-soft: #e9f1fb; --ico: "\f0e3"; }
.ml-sec--services { --sec: #0f6b5c; --sec-soft: #e6f4f1; --ico: "\f0f6"; }
.ml-sec--docs { --sec: #3f4a8a; --sec-soft: #eceefa; --ico: "\f115"; }
.ml-sec--schedule { --sec: #6a3d9a; --sec-soft: #f2ebf9; --ico: "\f073"; }
.ml-sec--interaction { --sec: #a4470c; --sec-soft: #fdf0e3; --ico: "\f0e6"; }
.ml-sec--economy { --sec: #2e7031; --sec-soft: #e9f4ea; --ico: "\f201"; }
.ml-sec--culture { --sec: #a02c62; --sec-soft: #fbeaf2; --ico: "\f277"; }
.ml-sec--gallery { --sec: #37506b; --sec-soft: #e9eef4; --ico: "\f030"; }
.ml-sec--contact { --sec: #a61f24; --sec-soft: #fdecea; --ico: "\f095"; }
/* Điểm nhấn màu bên trong khối */
.ml-sec--services .ml-fields a { border-left-color: var(--sec); }
.ml-sec--schedule .ml-agenda__date b { background: var(--sec); }
.ml-sec--interaction .ml-card h3 { color: var(--sec); }
.ml-sec--interaction.ml-band--soft { background: #fff; border-color: var(--ml-line); }
.ml-sec--interaction .ml-card { background: var(--sec-soft); border-color: #f0d9bf; }
/* Hộp tin nổi bật: giữ nhãn «Mới» và biểu tượng rung, bỏ dải màu chạy vì đã có dải tiêu đề */
.ml-sec.ml-box--hl::before { display: none; }
.ml-sec.ml-box--hl { border-color: var(--ml-line); }
.ml-sec.ml-box--hl > .ml-sechead h2::before { content: var(--ico); color: #ffe08a; margin: 0; }
/* Khối ở cột bên của trang con: cùng ngôn ngữ thiết kế, màu chủ đạo */
.ml-block { box-shadow: 0 1px 3px rgba(27, 36, 48, .08); overflow: hidden; }
.ml-block > .ml-block__title { margin: -14px -16px 12px; padding: 10px 14px 9px; background: #fbeeee; border-bottom: 2px solid var(--ml-primary); border-left: 6px solid var(--ml-primary); color: var(--ml-primary); font-size: 1rem; letter-spacing: .03em; }
/* Chế độ tối */
html.ml-dark .ml-sec { --sec-soft: #232a32; box-shadow: none; }
html.ml-dark .ml-sec > .ml-sechead h2 { color: #fff; }
html.ml-dark .ml-sec > .ml-sechead { border-bottom-color: var(--sec); }
html.ml-dark .ml-sec > .ml-sechead .ml-more { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); }
html.ml-dark .ml-sec > .ml-sechead .ml-ticker__toggle { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); }
html.ml-dark .ml-sec--interaction .ml-card { background: #232a32; border-color: var(--ml-line); }
html.ml-dark .ml-sec--interaction.ml-band--soft { background: var(--ml-surface); }
html.ml-dark .ml-block > .ml-block__title { background: #232a32; color: var(--ml-heading); border-color: var(--ml-heading); }
@media print {
    .ml-sec > .ml-sechead h2 { background: none; color: #000; clip-path: none; padding-left: 0; }
    .ml-sec > .ml-sechead .ml-more { display: none; }
}

/* ------------------------------------------------------------ trang con: khung tiêu đề cùng ngôn ngữ với trang chủ
   Mỗi module có một màu nhận diện (--mod-sec) trùng với màu khối tương ứng ở trang chủ; tiêu đề trang là dải nền nhạt
   có vạch màu bên trái và biểu tượng; tiêu đề mục trong trang có vạch màu; khối cột bên dùng thẻ tab như trang chủ. */
body { --mod-sec: var(--ml-primary); --mod-soft: #fbeeee; --mod-ico: "\f15c"; }
body.ml-mod-news { --mod-ico: "\f1ea"; }
body.ml-mod-about, body.ml-mod-siteterms, body.ml-mod-page { --mod-ico: "\f05a"; }
body.ml-mod-van-ban { --mod-sec: #3f4a8a; --mod-soft: #eceefa; --mod-ico: "\f115"; }
body.ml-mod-thu-tuc { --mod-sec: #0f6b5c; --mod-soft: #e6f4f1; --mod-ico: "\f0f6"; }
body.ml-mod-gop-y, body.ml-mod-hoi-dap, body.ml-mod-phan-anh { --mod-sec: #a4470c; --mod-soft: #fdf0e3; --mod-ico: "\f0e6"; }
body.ml-mod-thu-vien { --mod-sec: #37506b; --mod-soft: #e9eef4; --mod-ico: "\f030"; }
body.ml-mod-to-chuc { --mod-sec: #1d4f91; --mod-soft: #e9f1fb; --mod-ico: "\f0e8"; }
body.ml-mod-tim-kiem { --mod-sec: #37506b; --mod-soft: #e9eef4; --mod-ico: "\f002"; }
body.ml-mod-contact { --mod-sec: #a61f24; --mod-soft: #fdecea; --mod-ico: "\f095"; }
body.ml-mod-users, body.ml-mod-two-step-verification { --mod-ico: "\f007"; }
.ml-sched { --mod-sec: #6a3d9a; --mod-soft: #f2ebf9; --mod-ico: "\f073"; }
.ml-content { --cpx: 16px; --cpy: 18px; }
@media (min-width: 600px) {
    .ml-content { --cpx: 20px; }
}

/* Tiêu đề trang (h1) */
.ml-page > h1, .ml-content > h1, .ml-content h1.title { position: relative; margin: 0 0 14px; padding: 11px 14px 10px 14px; background: var(--mod-soft); border: 0; border-left: 6px solid var(--mod-sec); border-bottom: 2px solid var(--mod-sec); border-radius: 4px 4px 0 0; color: var(--mod-sec); font-size: 1.5rem; line-height: 1.35; }
.ml-page > h1::before, .ml-content > h1::before, .ml-content h1.title::before { content: var(--mod-ico); font-family: FontAwesome; font-weight: 400; font-size: .85em; margin-right: 10px; opacity: .9; }
/* Tiêu đề nằm ngay đầu thẻ nội dung: dải chạy hết bề ngang thẻ */
.ml-content > .ml-page:first-child > h1:first-child, .ml-content > h1:first-child { margin: calc(-1 * var(--cpy)) calc(-1 * var(--cpx)) 14px; padding-left: calc(var(--cpx) - 6px); padding-right: var(--cpx); border-radius: 5px 5px 0 0; }
/* Tiêu đề mục trong trang (h2) */
.ml-page > h2, .ml-page > section > h2, .ml-page > div > h2 { padding: 3px 0 3px 10px; border-left: 4px solid var(--mod-sec); color: var(--ml-ink); line-height: 1.35; }
.ml-source__title { border-left: 0 !important; padding-left: 0 !important; }
/* Khối cột bên: thẻ tab như trang chủ, theo màu của module đang xem */
.ml-sec--side { --sec: var(--mod-sec); --sec-soft: var(--mod-soft); --ico: "\f03a"; }
.ml-sec > .ml-sechead h2.ml-block__title { border-bottom: 0; padding-bottom: 0; font-size: 1rem; }
.ml-block.ml-sec > .ml-block__body { min-width: 0; }
/* Liên kết, nút chính trong trang theo màu module */
.ml-page .ml-tabs a.is-current { background: var(--mod-sec); border-color: var(--mod-sec); }
.ml-page .ml-tabs a { border-color: var(--mod-sec); color: var(--mod-sec); }
.ml-page .ml-tabs a.is-current, .ml-page .ml-tabs a[aria-current] { color: #fff; }
/* Chế độ tối */
html.ml-dark body { --mod-soft: #232a32; }
html.ml-dark .ml-sched { --mod-soft: #232a32; }
html.ml-dark .ml-page > h1, html.ml-dark .ml-content > h1, html.ml-dark .ml-content h1.title { color: var(--ml-ink); border-bottom-color: var(--mod-sec); }
html.ml-dark .ml-page .ml-tabs a:not(.is-current) { color: var(--ml-link); border-color: var(--ml-line); }
@media print {
    .ml-page > h1, .ml-content > h1, .ml-content h1.title, .ml-content > .ml-page:first-child > h1:first-child { margin: 0 0 12px; padding: 0 0 6px; background: none; border-left: 0; color: #000; }
    .ml-page > h1::before, .ml-content h1.title::before { display: none; }
}

/* ------------------------------------------------------------ banner (khối global.ml_banner) */
.ml-brand__banner { flex: 1 1 320px; min-width: 0; max-width: 660px; margin-left: auto; display: none; }
.ml-brand__banner:empty { display: none !important; }
.ml-bn, a.ml-bn { position: relative; display: block; overflow: hidden; border-radius: 10px; text-decoration: none; color: inherit; isolation: isolate; }
.ml-bn__scene { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; }
.ml-bn__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ml-bn__line { display: block; }
.ml-bn__brocade { position: absolute; left: 0; right: 0; bottom: 0; height: 7px; background-image: repeating-linear-gradient(45deg, #8f1a1d 0, #8f1a1d 3px, transparent 3px, transparent 7px), repeating-linear-gradient(-45deg, #8f1a1d 0, #8f1a1d 3px, #f6c445 3px, #f6c445 7px); background-size: 14px 14px; opacity: .9; }
/* Dải ngang ở đầu trang */
.ml-bn--head { height: 78px; border: 1px solid #ecd9a4; box-shadow: 0 1px 4px rgba(120, 90, 20, .15); background: #fff8e6; }
.ml-bn--head .ml-bn__text { position: absolute; top: 0; right: 0; bottom: 7px; left: 42%; display: flex; flex-direction: column; justify-content: center; align-items: flex-end; padding: 0 16px 0 8px; text-align: right; background: linear-gradient(90deg, rgba(255, 250, 240, 0), rgba(255, 250, 240, .92) 22%); }
.ml-bn--head .ml-bn__line--1 { font-weight: 800; font-size: 1.0625rem; line-height: 1.25; color: #8f1a1d; letter-spacing: .01em; }
.ml-bn--head .ml-bn__line--2 { font-weight: 600; font-size: .875rem; color: #6b4e0f; letter-spacing: .06em; text-transform: uppercase; margin-top: 2px; }
.ml-bn--head.ml-bn--image { border: 0; background: none; box-shadow: none; }
.ml-bn--head.ml-bn--image .ml-bn__img { object-fit: contain; object-position: right center; }
/* Khung lớn trong khối mở đầu trang chủ */
.ml-hero__side { display: none; }
.ml-hero__side:empty { display: none !important; }
.ml-bn--hero { height: 100%; min-height: 250px; border-radius: 12px; border: 1px solid rgba(246, 196, 69, .45); background: radial-gradient(circle at 75% 30%, rgba(246, 196, 69, .22), rgba(90, 12, 15, .15) 60%), rgba(60, 8, 10, .28); box-shadow: inset 0 0 30px rgba(0, 0, 0, .25); }
.ml-bn--hero .ml-bn__text { position: absolute; left: 0; right: 0; bottom: 9px; padding: 22px 18px 10px; text-align: left; background: linear-gradient(180deg, rgba(46, 5, 7, 0), rgba(46, 5, 7, .78)); }
.ml-bn--hero .ml-bn__line--1 { font-weight: 800; font-size: 1.375rem; line-height: 1.2; color: #ffe08a; text-shadow: 0 1px 3px rgba(0, 0, 0, .6); }
.ml-bn--hero .ml-bn__line--2 { font-weight: 600; font-size: .9375rem; color: #fff; letter-spacing: .08em; text-transform: uppercase; margin-top: 2px; text-shadow: 0 1px 3px rgba(0, 0, 0, .6); }
.ml-bn--hero .ml-bn__brocade { height: 9px; background-image: repeating-linear-gradient(45deg, #f6c445 0, #f6c445 3px, transparent 3px, transparent 7px), repeating-linear-gradient(-45deg, #f6c445 0, #f6c445 3px, #6c1114 3px, #6c1114 7px); }
.ml-bn--hero.ml-bn--image { background: none; border-color: rgba(255, 255, 255, .35); }
/* Chuyển động (chỉ khi khối bật hiệu ứng) */
.ml-bn .bn-sun, .ml-bn .bn-glow, .ml-bn .bn-rays, .ml-bn .bn-petal, .ml-bn .bn-bird, .ml-bn .bn-drift { transform-box: fill-box; transform-origin: center; }
.ml-bn .bn-rays { transform-box: view-box; transform-origin: 390px 110px; }
.ml-bn .bn-petal, .ml-bn .bn-bird { opacity: 0; }
.ml-bn--anim .bn-sun { animation: bn-sun 5s ease-in-out infinite; }
.ml-bn--anim .bn-glow { animation: bn-glow 5s ease-in-out infinite; }
.ml-bn--anim .bn-rays { animation: bn-rays 70s linear infinite; }
.ml-bn--anim .bn-drift--far { animation: bn-drift 16s ease-in-out infinite alternate; }
.ml-bn--anim .bn-drift--mid { animation: bn-drift 11s ease-in-out infinite alternate-reverse; }
.ml-bn--anim .bn-terrace { animation: bn-dash 5s linear infinite; }
.ml-bn--anim .bn-terrace--2 { animation-duration: 7s; animation-direction: reverse; }
.ml-bn--anim .bn-bird { animation: bn-fly 19s linear infinite; }
.ml-bn--anim .bn-bird--2 { animation-duration: 25s; animation-delay: -8s; }
.ml-bn--anim .bn-bird--3 { animation-duration: 31s; animation-delay: -17s; }
.ml-bn--anim .bn-petal { animation: bn-fall 10s linear infinite; }
.ml-bn--anim .bn-petal--1 { animation-duration: 9.5s; }
.ml-bn--anim .bn-petal--2 { animation-duration: 11s; animation-delay: -2.2s; }
.ml-bn--anim .bn-petal--3 { animation-duration: 8.5s; animation-delay: -4.1s; }
.ml-bn--anim .bn-petal--4 { animation-duration: 12s; animation-delay: -1.1s; }
.ml-bn--anim .bn-petal--5 { animation-duration: 10s; animation-delay: -5.6s; }
.ml-bn--anim .bn-petal--6 { animation-duration: 9s; animation-delay: -3.3s; }
.ml-bn--anim .bn-window { animation: bn-window 4s ease-in-out infinite; }
.ml-bn--anim .ml-bn__brocade { animation: bn-brocade 6s linear infinite; }
.ml-bn--anim.ml-bn--head .ml-bn__line--1 { animation: bn-text 7s ease-in-out infinite; }
.ml-bn--anim.ml-bn--head .ml-bn__line--2 { animation: bn-text 7s ease-in-out infinite -3.5s; }
@keyframes bn-sun { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.07); } }
@keyframes bn-glow { 0%, 100% { opacity: .14; transform: scale(.94); } 50% { opacity: .34; transform: scale(1.1); } }
@keyframes bn-rays { to { transform: rotate(360deg); } }
@keyframes bn-drift { from { transform: translateX(-8px); } to { transform: translateX(10px); } }
@keyframes bn-dash { to { stroke-dashoffset: -36; } }
@keyframes bn-fly { 0% { transform: translate(-40px, 6px); opacity: 0; } 8% { opacity: 1; } 50% { transform: translate(300px, -8px); } 92% { opacity: 1; } 100% { transform: translate(680px, 4px); opacity: 0; } }
@keyframes bn-fall { 0% { transform: translate(0, -10px) rotate(0deg); opacity: 0; } 10% { opacity: .95; } 55% { transform: translate(26px, 190px) rotate(160deg); } 90% { opacity: .9; } 100% { transform: translate(-10px, 370px) rotate(320deg); opacity: 0; } }
@keyframes bn-window { 0%, 100% { opacity: .65; } 50% { opacity: 1; } }
@keyframes bn-brocade { to { background-position: 28px 0, 28px 0; } }
@keyframes bn-text { 0%, 100% { opacity: 1; } 45% { opacity: 1; } 55% { opacity: .55; } 70% { opacity: 1; } }
/* Chế độ tải nhẹ: banner đứng yên */
.ml-lite .ml-bn *, .ml-lite .ml-bn { animation: none !important; }
.ml-lite .ml-bn .bn-petal, .ml-lite .ml-bn .bn-bird { opacity: 0; }
.ml-lite .ml-bn__img { display: block !important; }
@media (min-width: 992px) {
    .ml-brand__banner { display: block; }
    .ml-hero:has(.ml-hero__side:not(:empty)) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 34%); gap: 22px; align-items: stretch; }
    .ml-hero:has(.ml-hero__side:not(:empty))::after { display: none; }
    .ml-hero__side { display: block; min-width: 0; }
}
@media print {
    .ml-brand__banner, .ml-hero__side { display: none !important; }
}
/* Thiết bị đặt "giảm chuyển động": banner vẫn chuyển động khi quản trị bật hiệu ứng cho khối (tắt bằng cấu hình khối hoặc chế độ tải nhẹ) */
@media (prefers-reduced-motion: reduce) {
    html:not(.ml-lite) .ml-bn--anim .bn-sun { animation: bn-sun 5s ease-in-out infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-glow { animation: bn-glow 5s ease-in-out infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-rays { animation: bn-rays 70s linear infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-drift--far { animation: bn-drift 16s ease-in-out infinite alternate !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-drift--mid { animation: bn-drift 11s ease-in-out infinite alternate-reverse !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-terrace { animation: bn-dash 5s linear infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-terrace--2 { animation: bn-dash 7s linear infinite reverse !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-bird--1 { animation: bn-fly 19s linear infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-bird--2 { animation: bn-fly 25s linear -8s infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-bird--3 { animation: bn-fly 31s linear -17s infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-petal--1 { animation: bn-fall 9.5s linear infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-petal--2 { animation: bn-fall 11s linear -2.2s infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-petal--3 { animation: bn-fall 8.5s linear -4.1s infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-petal--4 { animation: bn-fall 12s linear -1.1s infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-petal--5 { animation: bn-fall 10s linear -5.6s infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-petal--6 { animation: bn-fall 9s linear -3.3s infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .bn-window { animation: bn-window 4s ease-in-out infinite !important; }
    html:not(.ml-lite) .ml-bn--anim .ml-bn__brocade { animation: bn-brocade 6s linear infinite !important; }
}

/* Banner dùng ảnh: hiện trọn ảnh hoặc lấp đầy; hiệu ứng lung linh (bồng bềnh, vệt sáng, tia lấp lánh, viền tỏa sáng) */
.ml-bn__frame { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.ml-bn--fit-contain .ml-bn__img { width: auto; height: 100%; max-width: 100%; object-fit: contain; }
.ml-bn--fit-cover .ml-bn__img { width: 100%; height: 100%; object-fit: cover; }
.ml-bn--hero.ml-bn--image.ml-bn--fit-contain { background: radial-gradient(ellipse at 50% 45%, rgba(246, 196, 69, .28), rgba(60, 8, 10, .1) 62%), linear-gradient(180deg, #7a1518, #4d0a0d); }
.ml-bn--head.ml-bn--image.ml-bn--fit-contain .ml-bn__img { object-position: right center; }
.ml-bn--head.ml-bn--image .ml-bn__frame { justify-content: flex-end; }
.ml-bn--fx .ml-bn__img { filter: drop-shadow(0 10px 22px rgba(0, 0, 0, .45)); transform-origin: 50% 60%; }
.ml-bn--fx.ml-bn--hero { box-shadow: 0 0 0 1px rgba(246, 196, 69, .55), 0 0 26px rgba(246, 196, 69, .35), inset 0 0 30px rgba(0, 0, 0, .25); }
.ml-bn__sheen { position: absolute; top: -20%; bottom: -20%; left: 0; width: 34%; background: linear-gradient(105deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .55) 50%, rgba(255, 255, 255, 0)); transform: translateX(-180%) skewX(-16deg); pointer-events: none; mix-blend-mode: screen; }
.ml-bn__spark { position: absolute; width: 14px; height: 14px; background: radial-gradient(circle, #fff 0, #fff 28%, #ffe9a6 60%, #f6c445); clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%); opacity: 0; transform: scale(.2); pointer-events: none; filter: drop-shadow(0 0 3px #ffe9a6); }
.ml-bn__spark--1 { top: 9%; left: 12%; }
.ml-bn__spark--2 { top: 18%; right: 10%; width: 10px; height: 10px; }
.ml-bn__spark--3 { bottom: 14%; left: 20%; width: 11px; height: 11px; }
.ml-bn__spark--4 { bottom: 24%; right: 16%; width: 16px; height: 16px; }
.ml-bn__spark--5 { top: 48%; left: 6%; width: 9px; height: 9px; }
.ml-bn--anim.ml-bn--fx .ml-bn__img { animation: bn-float 6s ease-in-out infinite; }
.ml-bn--anim.ml-bn--fx .ml-bn__sheen { animation: bn-sheen 5.5s ease-in-out infinite; }
.ml-bn--anim.ml-bn--fx.ml-bn--hero { animation: bn-halo 4s ease-in-out infinite; }
.ml-bn--anim.ml-bn--fx .ml-bn__spark { animation: bn-twinkle 3s ease-in-out infinite; }
.ml-bn--anim.ml-bn--fx .ml-bn__spark--2 { animation-delay: -.7s; }
.ml-bn--anim.ml-bn--fx .ml-bn__spark--3 { animation-delay: -1.4s; }
.ml-bn--anim.ml-bn--fx .ml-bn__spark--4 { animation-delay: -2.1s; }
.ml-bn--anim.ml-bn--fx .ml-bn__spark--5 { animation-delay: -2.6s; }
@keyframes bn-float { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-7px) scale(1.015); } }
@keyframes bn-sheen { 0% { transform: translateX(-180%) skewX(-16deg); } 45%, 100% { transform: translateX(420%) skewX(-16deg); } }
@keyframes bn-halo { 0%, 100% { box-shadow: 0 0 0 1px rgba(246, 196, 69, .5), 0 0 18px rgba(246, 196, 69, .25), inset 0 0 30px rgba(0, 0, 0, .25); } 50% { box-shadow: 0 0 0 1px #f6c445, 0 0 34px rgba(246, 196, 69, .6), inset 0 0 30px rgba(0, 0, 0, .25); } }
@keyframes bn-twinkle { 0%, 100% { opacity: 0; transform: scale(.2) rotate(0deg); } 50% { opacity: 1; transform: scale(1) rotate(40deg); } }
@media (prefers-reduced-motion: reduce) {
    html:not(.ml-lite) .ml-bn--anim.ml-bn--fx .ml-bn__img { animation: bn-float 6s ease-in-out infinite !important; }
    html:not(.ml-lite) .ml-bn--anim.ml-bn--fx .ml-bn__sheen { animation: bn-sheen 5.5s ease-in-out infinite !important; }
    html:not(.ml-lite) .ml-bn--anim.ml-bn--fx.ml-bn--hero { animation: bn-halo 4s ease-in-out infinite !important; }
    html:not(.ml-lite) .ml-bn--anim.ml-bn--fx .ml-bn__spark { animation: bn-twinkle 3s ease-in-out infinite !important; }
    html:not(.ml-lite) .ml-bn--anim.ml-bn--fx .ml-bn__spark--2 { animation-delay: -.7s !important; }
    html:not(.ml-lite) .ml-bn--anim.ml-bn--fx .ml-bn__spark--3 { animation-delay: -1.4s !important; }
    html:not(.ml-lite) .ml-bn--anim.ml-bn--fx .ml-bn__spark--4 { animation-delay: -2.1s !important; }
    html:not(.ml-lite) .ml-bn--anim.ml-bn--fx .ml-bn__spark--5 { animation-delay: -2.6s !important; }
}
.ml-lite .ml-bn__sheen, .ml-lite .ml-bn__spark { display: none; }

/* Fanpage chính thức */
.ml-topbar__fb, a.ml-topbar__fb { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 3px 10px; border-radius: 4px; color: #fff; text-decoration: none; background: #1877f2; font-size: .875rem; font-weight: 600; }
.ml-topbar__fb:hover { background: #0f5fd0; color: #fff; }
.ml-fblink, a.ml-fblink { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.ml-fblink .fa { color: #1877f2; font-size: 1.2em; }

/* Liên kết: không gạch chân khi trỏ chuột/bấm trên toàn cổng (đổi màu, đổi nền thay cho gạch chân).
   Người dùng bàn phím vẫn có viền tiêu điểm :focus-visible. */
a:hover, a:active, a:focus:not(:focus-visible), .btn-link:hover, .btn-link:focus:not(:focus-visible) { text-decoration: none !important; }
.ml-meta a { text-decoration: none; font-weight: 600; }
.ml-ui__reset:hover { text-decoration: none; color: var(--ml-link-hover); }

/* Công cụ quản trị ngoài site (chỉ quản trị viên thấy): thanh theo ngữ cảnh ở đầu nội dung, nút "+ Thêm" ở tiêu đề mục */
.ml-qadmin { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 0 0 14px; padding: 8px 12px; border: 1px dashed #c9a227; border-radius: 10px; background: #fff8e1; font-size: .9375rem; }
.ml-qadmin__label { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: #6b4e00; white-space: nowrap; }
.ml-qadmin__list { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ml-qadmin__btn, a.ml-qadmin__btn { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 4px 12px; border: 1px solid #d9c27a; border-radius: 999px; background: #fff; color: #4a3a00; text-decoration: none; font-weight: 600; line-height: 1.3; }
.ml-qadmin__btn.is-primary, a.ml-qadmin__btn.is-primary { background: var(--ml-primary); border-color: var(--ml-primary); color: #fff; }
.ml-qadmin__btn:hover, .ml-qadmin__btn:focus-visible { background: #fdecb2; color: #3a2a00; text-decoration: none; }
.ml-qadmin__btn.is-primary:hover, .ml-qadmin__btn.is-primary:focus-visible { background: var(--ml-primary-dark); color: #fff; }
.ml-sechead .ml-qadd, a.ml-qadd { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; padding: 2px 10px; border: 1px dashed #c9a227; border-radius: 999px; background: #fff8e1; color: #6b4e00; font-size: .875rem; font-weight: 700; white-space: nowrap; text-decoration: none; }
.ml-sechead .ml-qadd + .ml-more, .ml-sechead .ml-qadd + .ml-ticker__toggle { margin-left: 0; }
a.ml-qadd:hover, a.ml-qadd:focus-visible { background: #fdecb2; color: #3a2a00; text-decoration: none; }
html.ml-dark .ml-qadmin, html.ml-dark a.ml-qadd { background: #2e2710; border-color: #8a7330; color: #ffe08a; }
html.ml-dark .ml-qadmin__label { color: #ffe08a; }
html.ml-dark a.ml-qadmin__btn:not(.is-primary) { background: transparent; border-color: #8a7330; color: #ffe08a; }
/* Hộp hẹp ở trang chủ: nút thêm chỉ còn biểu tượng + (chữ vẫn có cho trình đọc màn hình) */
.ml-sechead--sm .ml-qadd { padding: 2px 8px; }
.ml-sechead--sm .ml-qadd__t { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }
@media print { .ml-qadmin, .ml-qadd { display: none !important; } }