/* Scope all guide styling; embedded guide follows the app's existing theme tokens. */
.xvg-public { margin:0; color:#1b3029; background:#f5f7f6; font-family:'Be Vietnam Pro','Segoe UI',sans-serif; color-scheme:light dark; }
.xvg-public-header { background:var(--xv-c1, #20564c); color:#fff; }
.xvg-public-header>div { max-width:1280px; margin:auto; display:flex; align-items:center; flex-wrap:wrap; gap:24px; padding:16px 24px; }
.xvg-public-header a { color:inherit; text-decoration:none; min-height:44px; display:inline-flex; align-items:center; }
.xvg-brand { font-size:22px; font-weight:700; }
.xvg-public-header span { font-size:14px; }
.xvg-return { margin-left:auto; font-size:14px; }
.xvg-skip { position:absolute; top:8px; left:8px; transform:translateY(-180%); background:#fff; color:var(--xv-c1, #20564c); padding:12px; z-index:100; }
.xvg-skip:focus { transform:none; }
.xvg { --xvg-bg:#f5f7f6; --xvg-paper:#fff; --xvg-text:#1b3029; --xvg-muted:#5c7068; --xvg-line:#dce5e0; --xvg-brand:var(--xv-c1, #20564c); --xvg-on-brand:#fff; --xvg-soft:#edf5f1; --xvg-soft2:#f4f8f6; --xvg-amber:#f5b301; --xvg-on-amber:#2a1d00; --xvg-new:#a94d0c; --xvg-new-bg:#fdf1e8; --xvg-upd:#1d4ed8; --xvg-upd-bg:#e8f0ff; --xvg-ok:#15803d; --xvg-p1:var(--xv-c1-soft, #e6f4ef); --xvg-p2:#cfe9df; --xvg-p3:#aedac9; --xvg-p4:#7fbfa8; --xvg-p5:#4d9a82; --xvg-p-ink:var(--xv-top-a, #112723); --xvg-p5-ink:#ffffff; font-family:'Be Vietnam Pro','Segoe UI',sans-serif; font-size:16px; line-height:1.65; color:var(--xvg-text); background:var(--xvg-bg); }
.xvg *, .xvg *::before, .xvg *::after { box-sizing:border-box; }
.xvg [hidden] { display:none!important; }
.xvg a { color:var(--xvg-brand); text-underline-offset:3px; }
.xvg button, .xvg input { font:inherit; color:inherit; }
.xvg button, .xvg summary { cursor:pointer; }
.xvg button:focus-visible, .xvg a:focus-visible, .xvg summary:focus-visible, .xvg input:focus-visible { outline:2px solid var(--xvg-brand); outline-offset:3px; }
.xvg h1, .xvg h2, .xvg h3, .xvg p { margin:0; }
.xvg h1 { font-size:30px; line-height:1.3; font-weight:700; }
.xvg h2 { font-size:20px; line-height:1.4; font-weight:600; }
.xvg h3 { font-size:18px; font-weight:600; }
.xvg small { font-size:13px; }
.xvg button { min-height:44px; }
.xvg-layout { max-width:1280px; margin:auto; display:grid; grid-template-columns:230px minmax(0,1fr); }
.xvg [aria-pressed="true"] { background:var(--xvg-soft); color:var(--xvg-brand); }
.xvg-main { min-width:0; padding:36px 40px 48px; }
.xvg-eyebrow { font-size:12px; letter-spacing:.06em; color:var(--xvg-brand); margin-bottom:12px; }
.xvg [data-xvg-heading]>p { color:var(--xvg-muted); margin-top:10px; }
.xvg-search { display:flex; gap:8px; align-items:center; background:var(--xvg-paper); border:1px solid var(--xvg-line); border-radius:8px; padding:7px 12px; margin:24px 0 12px; }
.xvg-search input { flex:1; width:100%; min-width:0; padding:9px 0; border:0; background:transparent; font-size:16px; }
.xvg-search input::placeholder { color:var(--xvg-muted); }
.xvg-search button { border:0; background:transparent; color:var(--xvg-brand); padding:4px 8px; }
.xvg-device { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-bottom:22px; font-size:13px; }
.xvg-device>span { margin-right:8px; color:var(--xvg-muted); }
.xvg-device button { border:1px solid var(--xvg-line); border-radius:6px; background:var(--xvg-paper); padding:7px 12px; font-size:14px; }
.xvg-device button[aria-pressed="true"] { border-color:var(--xvg-brand); background:var(--xvg-soft); }
.xvg summary { min-height:44px; padding:13px 0; }
.xvg-section-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-bottom:14px; }
.xvg-section-head>span { color:var(--xvg-muted); font-size:13px; }
.xvg-start-list { background:var(--xvg-paper); border:1px solid var(--xvg-line); border-radius:8px; }
.xvg-start-item { display:flex; align-items:center; gap:14px; padding:18px; text-decoration:none; border-bottom:1px solid var(--xvg-line); color:var(--xvg-text)!important; }
.xvg-start-item:last-child { border-bottom:0; }
.xvg-number { width:34px; height:34px; border-radius:6px; background:var(--xvg-soft); color:var(--xvg-brand); display:flex; align-items:center; justify-content:center; flex:none; font-size:14px; }
.xvg-start-item>span:nth-child(2), .xvg-result>span:first-child { flex:1; min-width:0; }
.xvg small { display:block; color:var(--xvg-muted); margin-top:3px; }
.xvg-topics { margin-top:32px; }
.xvg-result { display:flex; align-items:center; gap:14px; padding:17px 0; border-bottom:1px solid var(--xvg-line); text-decoration:none; color:var(--xvg-text)!important; }
.xvg-result:hover strong, .xvg-start-item:hover strong { color:var(--xvg-brand); }
.xvg-article { padding:30px 0; border-top:1px solid var(--xvg-line); scroll-margin-top:18px; }
.xvg-ready .xvg-article { border:0; padding:0; }
.xvg-back { border:0; background:transparent; color:var(--xvg-brand)!important; padding:8px 0; margin-bottom:10px; }
.xvg-crumb { font-size:13px; color:var(--xvg-muted); margin:10px 0; }
.xvg-article>h2 { font-size:28px; line-height:1.35; margin-bottom:12px; }
.xvg-lead { color:var(--xvg-muted); margin-bottom:20px!important; }
.xvg-location { padding:15px 18px; border-radius:6px; background:var(--xvg-soft); margin:18px 0; }
.xvg-location>span { display:block; font-size:12px; color:var(--xvg-muted); margin-bottom:5px; }
.xvg-steps { padding-left:24px; margin:16px 0 24px; }
.xvg-steps li { padding:4px 0 11px 6px; }
.xvg-outcome { padding:18px 0; border-top:1px solid var(--xvg-line); border-bottom:1px solid var(--xvg-line); margin-bottom:12px; }
.xvg-outcome p { color:var(--xvg-muted); margin-top:6px; }
.xvg-note p { margin:0 0 15px; color:var(--xvg-muted); }
.xvg-figure { margin:24px 0; border:1px solid var(--xvg-line); border-radius:8px; padding:16px; background:var(--xvg-paper); }
.xvg-figure>a { display:block; width:fit-content; max-width:100%; margin:auto; }
.xvg-figure img { display:block; max-width:100%; width:auto; height:auto; border:1px solid var(--xvg-line); border-radius:6px; }
.xvg-figure-phone img { max-width:min(100%,390px); }
.xvg-figure figcaption { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top:14px; font-size:14px; line-height:1.5; }
.xvg-figure figcaption>span { flex:1; min-width:180px; }
.xvg-figure figcaption>a { display:inline-flex; align-items:center; min-height:44px; }
.xvg-figure [data-xvg-photo-fallback] { padding:12px 0; color:var(--xvg-muted); }
.xvg-zoom { width:fit-content; max-width:calc(100vw - 32px); max-height:calc(100dvh - 32px); margin:auto; padding:18px; color:var(--xvg-text); background:var(--xvg-paper); border:1px solid var(--xvg-line); border-radius:8px; }
.xvg-zoom::backdrop { background:rgba(0,0,0,.65); }
.xvg-zoom-head { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:12px; }
.xvg-zoom-head h2 { font-size:17px; }
.xvg-zoom-head button { flex:none; border:1px solid var(--xvg-line); border-radius:6px; padding:8px 12px; background:var(--xvg-soft); }
.xvg-zoom-scroll { overflow:auto; max-width:calc(100vw - 70px); max-height:70vh; }
.xvg-zoom-scroll img { display:block; max-width:none; height:auto; }
.xvg-zoom>p { font-size:14px; line-height:1.5; margin-top:12px; max-width:800px; }
.xvg-button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; background:var(--xvg-brand); color:var(--xvg-on-brand)!important; padding:11px 16px; border:0; border-radius:6px; text-decoration:none; margin:12px 0; }
.xvg-related { display:flex; gap:18px; flex-wrap:wrap; margin:15px 0; }
.xvg-related a { min-height:44px; display:inline-flex; align-items:center; }
.xvg-faq { margin-top:32px; scroll-margin-top:18px; }
.xvg-faq h2 { margin-bottom:12px; }
.xvg-faq details { border-bottom:1px solid var(--xvg-line); }
.xvg-faq summary { font-weight:500; }
.xvg-faq p { color:var(--xvg-muted); margin:0 0 8px; }
.xvg-faq details>a { display:inline-block; padding:8px 0 16px; }
.xvg-support { display:flex; gap:12px; align-items:center; flex-wrap:wrap; border-top:1px solid var(--xvg-line); margin-top:32px; padding-top:24px; font-size:14px; scroll-margin-top:18px; }
.xvg-support>a { margin-left:auto; min-height:44px; display:inline-flex; align-items:center; }
.xvg-support small { flex-basis:100%; font-size:12px; }
.xvg-access { padding:15px; background:var(--xvg-soft); border-radius:6px; margin:14px 0!important; }
.xvg-empty { padding:24px 0; }
.xvg-empty>p { margin-top:8px; color:var(--xvg-muted); }
.xvg-js-only { display:none; }
.xvg-ready .xvg-js-only { display:block; }
.xvg-ready .xvg-layout { display:grid; }
.xvg:not(.xvg-ready) .xvg-layout { display:block; }
.xvg-ready .xvg-search, .xvg-ready .xvg-device { display:flex; }
.xvg-ready .xvg-platform-label { display:none; }
.xvg-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
html[data-guide-theme="dark"] .xvg, body.dark-mode .xvg { --xvg-bg:var(--xv-s5, #101b18); --xvg-paper:#182620; --xvg-text:#e4eee8; --xvg-muted:#b2c4b9; --xvg-line:var(--xv-s7, #34483d); --xvg-brand:#96d8c1; --xvg-on-brand:var(--xv-d1-on, #102c23); --xvg-soft:var(--xv-s4, #21392e); --xvg-soft2:var(--xv-s1, #14211d); --xvg-amber:#fbbf24; --xvg-on-amber:#2a1d00; --xvg-new:#fdba74; --xvg-new-bg:#2a1c10; --xvg-upd:#93c5fd; --xvg-upd-bg:#14233f; --xvg-ok:#6ee7b7; --xvg-p1:#123028; --xvg-p2:#174237; --xvg-p3:#1c5646; --xvg-p4:#237a5f; --xvg-p5:#2fa07c; --xvg-p-ink:#e6efec; --xvg-p5-ink:#ffffff; }
html[data-guide-theme="dark"] .xvg-public { background:#101b18; color:#e4eee8; }
@media(prefers-color-scheme:dark) { .xvg-public { background:#101b18; color:#e4eee8; } .xvg { --xvg-bg:#101b18; --xvg-paper:#182620; --xvg-text:#e4eee8; --xvg-muted:#b2c4b9; --xvg-line:#34483d; --xvg-brand:#96d8c1; --xvg-on-brand:#102c23; --xvg-soft:#21392e; --xvg-soft2:#14211d; --xvg-amber:#fbbf24; --xvg-on-amber:#2a1d00; --xvg-new:#fdba74; --xvg-new-bg:#2a1c10; --xvg-upd:#93c5fd; --xvg-upd-bg:#14233f; --xvg-ok:#6ee7b7; --xvg-p1:#123028; --xvg-p2:#174237; --xvg-p3:#1c5646; --xvg-p4:#237a5f; --xvg-p5:#2fa07c; --xvg-p-ink:#e6efec; --xvg-p5-ink:#ffffff; } }
.xvg.xvg-embedded { --xvg-bg:var(--bg,#f5f7f6); --xvg-paper:var(--card,#fff); --xvg-text:var(--tx,#1b3029); --xvg-muted:var(--mut,#5c7068); --xvg-line:var(--bd,#dce5e0); --xvg-brand:var(--br,#20564c); --xvg-on-brand:var(--brTx,#fff); --xvg-soft:var(--brSoft,#edf5f1); background:transparent; }
.xvg-embedded .xvg-layout { display:block; }
.xvg-embedded .xvg-main { padding:12px 0 22px; }
.xvg-embedded h1 { font-size:25px; }
.xvg-embedded .xvg-article>h2 { font-size:25px; }
@media(max-width:760px) {
    .xvg-public-header>div { gap:10px; padding:10px 18px; }
    .xvg-public-header span { display:none; }
    .xvg-layout, .xvg-ready .xvg-layout { display:block; }
    .xvg-main { padding:24px 18px 36px; }
    .xvg h1 { font-size:25px; }
    .xvg-article>h2 { font-size:25px; }
    .xvg-start-item { padding:16px 13px; gap:11px; }
    .xvg-device>span { flex-basis:100%; }
    .xvg-support>a { margin-left:0; }
}

/* ===== Trang công khai kiểu mới (.xvg-v2): hướng dẫn xếp theo nhịp công việc trên công trường ===== */
.xvg-public-header { background:var(--xv-top-a, #112723); }
.xvg-public-header>div { max-width:1240px; padding:12px 30px; gap:14px 18px; }
.xvg-brand { font-size:19px; font-weight:800; letter-spacing:-.01em; }
.xvg-hd-sub { font-size:13px; opacity:.8; padding-left:16px; border-left:1px solid rgba(255,255,255,.25); }
.xvg-hd-keys { display:none; margin-left:auto; font-size:13px; align-items:center; gap:6px; }
.xvg-public-ready .xvg-hd-keys { display:inline-flex; }
.xvg-public-ready .xvg-return { margin-left:0; }
.xvg-hd-keys kbd, .xvg-search kbd { font:600 11px 'JetBrains Mono',ui-monospace,Consolas,monospace; border:1px solid rgba(255,255,255,.35); border-radius:5px; padding:1px 7px; }
.xvg-ready .xvg-layout.xvg-v2, .xvg-layout.xvg-v2 { display:block; max-width:1240px; }
.xvg-v2 .xvg-main { padding:0 30px 44px; }
.xvg-v2 .xvg-eyebrow, .xvg-hay-lbl, .xvg-rhythm, .xvg-reviewline, .xvg-news h2 span, .xvg-news time, .xvg-phase-bar small, .xvg-tag { font-family:'JetBrains Mono',ui-monospace,Consolas,monospace; }
.xvg-v2 .xvg-eyebrow { font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--xvg-muted); margin-bottom:8px; }
.xvg-hero { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr); gap:34px; padding:34px 0 20px; align-items:start; }
.xvg-hero-main { min-width:0; }
.xvg-v2 h1 { font-size:38px; line-height:1.12; letter-spacing:-.025em; font-weight:800; text-wrap:balance; margin:8px 0; }
.xvg-v2 [data-xvg-heading]>p { font-size:15.5px; margin-top:0; max-width:56ch; }
.xvg-v2 .xvg-search { border:2px solid var(--xvg-text); border-radius:12px; padding:0 12px; min-height:52px; margin:18px 0 0; }
.xvg-v2 .xvg-search:focus-within { border-color:var(--xvg-brand); }
.xvg-v2 .xvg-search input { font-size:15.5px; padding:12px 0; }
.xvg-search kbd { color:var(--xvg-muted); border-color:var(--xvg-line); }
.xvg-search [data-xvg-clear]:not([hidden]) + kbd { display:none; }
.xvg-hay { margin-top:14px; }
.xvg-hay-lbl { display:block; font-size:11px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--xvg-muted); margin-bottom:8px; }
.xvg-chips { display:flex; flex-wrap:wrap; gap:8px; }
.xvg .xvg-chips a { border:1px solid var(--xvg-line); background:var(--xvg-paper); color:var(--xvg-text); border-radius:999px; padding:7px 14px; text-decoration:none; font-size:13.5px; font-weight:600; min-height:38px; display:inline-flex; align-items:center; }
.xvg .xvg-chips a:hover { border-color:var(--xvg-brand); background:var(--xvg-soft); }
.xvg-v2 .xvg-device { margin:14px 0 0; }
.xvg-news { border:1px solid var(--xvg-line); border-radius:14px; background:var(--xvg-soft2); padding:16px 18px; }
.xvg-news h2 { font-size:14px; font-weight:800; display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:6px; }
.xvg-news h2 span { font-size:11px; font-weight:600; color:var(--xvg-muted); text-transform:uppercase; }
.xvg .xvg-news a { display:grid; grid-template-columns:54px minmax(0,1fr); gap:10px; padding:10px 0; border-top:1px solid var(--xvg-line); text-decoration:none; color:var(--xvg-text); min-height:44px; }
.xvg .xvg-news a:first-of-type { border-top:0; }
.xvg-news time { font-size:11.5px; font-weight:700; color:var(--xvg-new); padding-top:2px; }
.xvg-news strong { font-size:13.5px; font-weight:700; display:block; line-height:1.4; }
.xvg .xvg-news a:hover strong { color:var(--xvg-brand); text-decoration:underline; }
.xvg-news small { font-size:12.5px; margin-top:1px; }
.xvg-v2 .xvg-section-head h2 { font-size:22px; font-weight:800; letter-spacing:-.015em; }
.xvg-v2 .xvg-start, .xvg-v2 .xvg-topics { margin-top:30px; }
.xvg-v2 .xvg-start-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; background:none; border:0; }
.xvg-v2 .xvg-start-item { flex-direction:column; align-items:flex-start; gap:4px; border:1px solid var(--xvg-line); border-radius:14px; background:var(--xvg-paper); padding:16px 18px 18px; }
.xvg-v2 .xvg-start-item:hover { border-color:var(--xvg-brand); box-shadow:0 12px 28px rgba(17,39,35,.12); }
.xvg-v2 .xvg-number { width:auto; height:auto; background:none; border-radius:0; font:800 34px/1 'JetBrains Mono',ui-monospace,Consolas,monospace; letter-spacing:-.04em; color:var(--xvg-brand); }
.xvg-v2 .xvg-start-item strong { font-size:16px; font-weight:800; }
.xvg-v2 .xvg-start-item>span[aria-hidden] { display:none; }
.xvg-rail { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); }
.xvg-phase { padding-right:14px; min-width:0; }
.xvg .xvg-phase-bar { margin:0 -14px 0 0; min-height:42px; display:flex; align-items:center; gap:8px; padding:4px 24px 4px 14px; color:var(--xvg-p-ink); font-size:12.5px; font-weight:800; line-height:1.2; clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%,12px 50%); }
.xvg-phase:first-child .xvg-phase-bar { clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%); }
.xvg-phase:nth-child(1) .xvg-phase-bar { background:var(--xvg-p1); }
.xvg-phase:nth-child(2) .xvg-phase-bar { background:var(--xvg-p2); }
.xvg-phase:nth-child(3) .xvg-phase-bar { background:var(--xvg-p3); }
.xvg-phase:nth-child(4) .xvg-phase-bar { background:var(--xvg-p4); }
.xvg-phase:nth-child(5) .xvg-phase-bar { background:var(--xvg-p5); color:var(--xvg-p5-ink); }
.xvg-phase-bar small { display:inline; font-size:10.5px; font-weight:700; opacity:.75; margin:0; color:inherit; }
.xvg-rhythm { margin:9px 0 4px; font-size:11px; font-weight:600; color:var(--xvg-muted); }
.xvg .xvg-lk { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; padding:9px 0; border-bottom:1px solid var(--xvg-line); color:var(--xvg-text); text-decoration:none; font-size:13.5px; font-weight:600; line-height:1.35; min-height:44px; }
.xvg .xvg-lk:hover { color:var(--xvg-brand); }
.xvg-tag { flex:none; font-size:10px; font-weight:800; letter-spacing:.04em; padding:2px 6px; border-radius:5px; text-transform:uppercase; white-space:nowrap; }
.xvg-tag-new { background:var(--xvg-new-bg); color:var(--xvg-new); }
.xvg-tag-upd { background:var(--xvg-upd-bg); color:var(--xvg-upd); }
.xvg:not(.xvg-ready) .xvg-phase-bar { cursor:default; }
/* bài chi tiết trong khung mới */
.xvg-v2 .xvg-article, .xvg-appv .xvg-article { padding-top:6px; }
.xvg-v2 .xvg-article>h2, .xvg-appv .xvg-article>h2 { font-size:32px; font-weight:800; letter-spacing:-.02em; line-height:1.15; text-wrap:balance; }
.xvg-v2 .xvg-location, .xvg-appv .xvg-location { background:var(--xvg-soft); border-radius:12px; padding:12px 16px; }
.xvg-v2 .xvg-location>span, .xvg-appv .xvg-location>span { font:700 11px 'JetBrains Mono',ui-monospace,Consolas,monospace; letter-spacing:.08em; color:var(--xvg-brand); }
.xvg-v2 .xvg-steps, .xvg-appv .xvg-steps { list-style:none; padding:0; margin:16px 0 22px; display:grid; gap:10px; counter-reset:xvgs; max-width:78ch; }
.xvg-v2 .xvg-steps li, .xvg-appv .xvg-steps li { counter-increment:xvgs; display:grid; grid-template-columns:34px minmax(0,1fr); gap:14px; align-items:start; border:1.5px solid var(--xvg-line); background:var(--xvg-paper); border-radius:14px; padding:14px 16px; }
.xvg-v2 .xvg-steps li::before, .xvg-appv .xvg-steps li::before { content:attr(data-xvg-step); width:32px; height:32px; border-radius:50%; background:var(--xvg-amber); color:var(--xvg-on-amber); font:800 14px 'JetBrains Mono',ui-monospace,Consolas,monospace; display:grid; place-items:center; }
.xvg-v2 .xvg-outcome, .xvg-appv .xvg-outcome { border:0; border-left:4px solid var(--xvg-ok); background:var(--xvg-soft); border-radius:0 12px 12px 0; padding:12px 16px; margin:22px 0 14px; max-width:78ch; }
.xvg-v2 .xvg-outcome p, .xvg-appv .xvg-outcome p { color:var(--xvg-text); }
.xvg-v2 .xvg-related a, .xvg-appv .xvg-related a { border:1px solid var(--xvg-line); border-radius:999px; padding:0 14px; text-decoration:none; font-weight:600; font-size:13.5px; background:var(--xvg-paper); }
.xvg-v2 .xvg-related, .xvg-appv .xvg-related { gap:8px; }
.xvg-reviewline { margin:22px 0 0; padding-top:14px; border-top:1px solid var(--xvg-line); font-size:12px; color:var(--xvg-muted); }
.xvg-v2 .xvg-faq h2, .xvg-v2 .xvg-support { }
.xvg-v2 .xvg-faq h2 { font-size:22px; font-weight:800; letter-spacing:-.015em; }
.xvg-v2 .xvg-faq summary { font-weight:700; }
@media (max-width:860px) { .xvg-hero { display:block; padding-top:22px; } .xvg-news { margin-top:20px; } .xvg-v2 .xvg-start-list { grid-template-columns:1fr; } }
@media (max-width:760px) {
    .xvg-hd-sub, .xvg-hd-keys { display:none!important; }
    .xvg-public-header>div { padding:10px 18px; }
    .xvg-v2 .xvg-main { padding:0 18px 36px; }
    .xvg-v2 h1 { font-size:27px; }
    .xvg-v2 .xvg-article>h2 { font-size:25px; }
    .xvg-rail { display:block; }
    .xvg-phase { padding:0; border-bottom:1px solid var(--xvg-line); }
    .xvg .xvg-phase-bar, .xvg .xvg-phase:first-child .xvg-phase-bar { clip-path:none; margin:10px 0; border-radius:9px; min-height:44px; padding:6px 14px; }
    .xvg-phase-bar[role="button"] { cursor:pointer; }
    .xvg-phase-bar[role="button"]::after { content:"▾"; margin-left:auto; font-size:11px; }
    .xvg-phase-bar[aria-expanded="true"]::after { content:"▴"; }
    .xvg-ready .xvg-phase-bar[aria-expanded="false"] + .xvg-phase-body { display:none; }
    .xvg-v2 .xvg-section-head > span { flex-basis:100%; }
}

/* ===== Đợt 2: số bước gắn trên hình, bố cục hình + bước, từng bước trên điện thoại ===== */
.xvg-shot { position:relative; width:fit-content; max-width:100%; margin:auto; }
.xvg-shot>a { display:block; }
.xvg-shot img { display:block; }
.xvg-hot { position:absolute; border:2.5px solid transparent; border-radius:8px; pointer-events:none; transition:background .15s, border-color .15s; }
.xvg-hot>i { position:absolute; top:-11px; left:-11px; width:24px; height:24px; border-radius:50%; background:var(--xvg-amber); color:var(--xvg-on-amber); font:800 12px/1 'JetBrains Mono',ui-monospace,Consolas,monospace; display:grid; place-items:center; font-style:normal; box-shadow:0 0 0 2px var(--xvg-paper),0 2px 6px rgba(0,0,0,.3); pointer-events:auto; cursor:default; opacity:.8; }
.xvg-ready .xvg-hot>i { cursor:pointer; }
.xvg-hot.is-act { border-color:var(--xvg-amber); background:color-mix(in srgb,var(--xvg-amber) 16%,transparent); }
.xvg-hot.is-act>i { transform:scale(1.15); opacity:1; }
.xvg-hot>i:focus-visible { outline:2px solid var(--xvg-brand); outline-offset:3px; }
.xvg-hotnote { display:block; margin-top:4px; }
@media (prefers-reduced-motion:no-preference) {
    .xvg-hot.is-act>i { animation:xvg-nhip 1.8s ease-in-out infinite; }
    @keyframes xvg-nhip { 50% { box-shadow:0 0 0 2px var(--xvg-paper),0 0 0 9px color-mix(in srgb,var(--xvg-amber) 35%,transparent); } }
}
.xvg-v2 .xvg-sec-side, .xvg-v2 .xvg-sec-wide, .xvg-appv .xvg-sec-side, .xvg-appv .xvg-sec-wide { display:grid; column-gap:34px; align-items:start; }
.xvg-v2 .xvg-sec-side, .xvg-appv .xvg-sec-side { grid-template-columns:minmax(0,1fr) minmax(260px,430px); grid-template-areas:"label label" "loc loc" "head fig" "steps fig" "outc outc"; grid-template-rows:auto auto auto 1fr auto; }
.xvg-v2 .xvg-sec-wide, .xvg-appv .xvg-sec-wide { grid-template-columns:minmax(0,1fr); grid-template-areas:"label" "loc" "fig" "head" "steps" "all" "outc"; }
.xvg-v2 .xvg-sec-side>.xvg-platform-label, .xvg-v2 .xvg-sec-wide>.xvg-platform-label, .xvg-appv .xvg-sec-side>.xvg-platform-label, .xvg-appv .xvg-sec-wide>.xvg-platform-label { grid-area:label; }
.xvg-v2 .xvg-sec-side>.xvg-location, .xvg-v2 .xvg-sec-wide>.xvg-location, .xvg-appv .xvg-sec-side>.xvg-location, .xvg-appv .xvg-sec-wide>.xvg-location { grid-area:loc; }
.xvg-v2 .xvg-sec-side>.xvg-stephead, .xvg-v2 .xvg-sec-wide>.xvg-stephead, .xvg-appv .xvg-sec-side>.xvg-stephead, .xvg-appv .xvg-sec-wide>.xvg-stephead { grid-area:head; }
.xvg-v2 .xvg-sec-side>.xvg-steps, .xvg-v2 .xvg-sec-wide>.xvg-steps, .xvg-appv .xvg-sec-side>.xvg-steps, .xvg-appv .xvg-sec-wide>.xvg-steps { grid-area:steps; }
.xvg-v2 .xvg-sec-side>.xvg-figure, .xvg-v2 .xvg-sec-wide>.xvg-figure, .xvg-appv .xvg-sec-side>.xvg-figure, .xvg-appv .xvg-sec-wide>.xvg-figure { grid-area:fig; margin:0; }
.xvg-v2 .xvg-sec-side>.xvg-outcome, .xvg-v2 .xvg-sec-wide>.xvg-outcome, .xvg-appv .xvg-sec-side>.xvg-outcome, .xvg-appv .xvg-sec-wide>.xvg-outcome { grid-area:outc; }
.xvg-v2 .xvg-sec-side>.xvg-figure, .xvg-appv .xvg-sec-side>.xvg-figure { position:sticky; top:14px; align-self:start; }
.xvg-v2 .xvg-sec-wide>.xvg-figure, .xvg-appv .xvg-sec-wide>.xvg-figure { margin-bottom:18px; }
.xvg-v2 .xvg-stepnav, .xvg-appv .xvg-stepnav { display:none; }
.xvg-ready .xvg-v2 .xvg-stepper .xvg-steps li, .xvg-ready .xvg-appv .xvg-stepper .xvg-steps li { cursor:pointer; }
.xvg-v2 .xvg-stepper .xvg-steps li.is-cur, .xvg-appv .xvg-stepper .xvg-steps li.is-cur { border-color:var(--xvg-brand); background:var(--xvg-soft); box-shadow:0 0 0 3px color-mix(in srgb,var(--xvg-brand) 18%,transparent); }
.xvg-v2 .xvg-fig-hot .xvg-steps li:not(.xvg-has-hot)::before, .xvg-appv .xvg-fig-hot .xvg-steps li:not(.xvg-has-hot)::before { background:transparent; color:var(--xvg-muted); box-shadow:inset 0 0 0 2px var(--xvg-line); }
.xvg-stepcount { font:700 12px 'JetBrains Mono',ui-monospace,Consolas,monospace; letter-spacing:.06em; text-transform:uppercase; color:var(--xvg-muted); text-align:center; }
.xvg-dots { display:flex; gap:6px; justify-content:center; }
.xvg-dots i { width:22px; height:6px; border-radius:3px; background:var(--xvg-line); }
.xvg-dots i.on { background:var(--xvg-brand); }
.xvg-stepbtns { display:grid; grid-template-columns:1fr 2fr; gap:10px; }
.xvg-stepbtns button { min-height:52px; border-radius:14px; font-size:16px; font-weight:800; border:1.5px solid var(--xvg-brand); background:var(--xvg-paper); color:var(--xvg-brand); }
.xvg-stepbtns [data-xvg-next] { background:var(--xvg-brand); color:var(--xvg-on-brand); }
.xvg-stepbtns button:disabled { opacity:.4; cursor:default; }
.xvg-allsteps { display:none; grid-area:all; border:0; background:transparent; color:var(--xvg-brand); text-decoration:underline; text-underline-offset:3px; font-weight:700; min-height:44px; }
@media (max-width:860px) {
    .xvg-v2 .xvg-sec-side, .xvg-appv .xvg-sec-side { grid-template-columns:minmax(0,1fr); grid-template-areas:"label" "loc" "head" "steps" "all" "fig" "outc"; }
    .xvg-v2 .xvg-sec-side>.xvg-figure, .xvg-appv .xvg-sec-side>.xvg-figure { position:static; margin-top:16px; }
}
@media (max-width:760px) {
    .xvg-stepper .xvg-allsteps { display:block; width:100%; text-align:center; }
    .xvg-v2 .xvg-sec-side.xvg-one, .xvg-v2 .xvg-sec-wide.xvg-one, .xvg-appv .xvg-sec-side.xvg-one, .xvg-appv .xvg-sec-wide.xvg-one { display:flex; flex-direction:column; align-items:stretch; gap:12px; }
    .xvg-v2 .xvg-sec-side.xvg-one>*, .xvg-v2 .xvg-sec-wide.xvg-one>*, .xvg-appv .xvg-sec-side.xvg-one>*, .xvg-appv .xvg-sec-wide.xvg-one>* { align-self:stretch; }
    .xvg-one>.xvg-platform-label { order:0; }
    .xvg-one>.xvg-location { order:1; margin:0; }
    .xvg-one>.xvg-figure { order:2; margin:0; padding:10px; position:static; }
    .xvg-one>.xvg-stephead { display:none; }
    .xvg-one>.xvg-steps { order:4; margin:0; }
    .xvg-one>.xvg-stepnav { order:5; display:grid; gap:12px; }
    .xvg-one>.xvg-allsteps { order:5; }
    .xvg-one>.xvg-outcome { order:6; margin:6px 0 0; }
    .xvg-one .xvg-steps li:not(.is-cur) { display:none; }
    .xvg-one .xvg-steps li.is-cur { border:2px solid var(--xvg-brand); background:var(--xvg-soft); padding:16px; font-size:17px; line-height:1.5; grid-template-columns:40px minmax(0,1fr); }
    .xvg-one .xvg-steps li::before { width:38px; height:38px; font-size:17px; }
    .xvg-one .xvg-shot img { max-height:46vh; width:auto; max-width:100%; }
    .xvg-one .xvg-hot>i { width:20px; height:20px; font-size:11px; top:-9px; left:-9px; }
    .xvg-one .xvg-figure figcaption>span { display:none; }
    .xvg-one .xvg-figure figcaption { justify-content:center; margin-top:8px; }
}
/* Có JavaScript: ẩn các bài ngay từ đầu để trình duyệt không tải sớm ảnh của bài chưa mở (bài đang mở có lớp xvg-open). */
.xvg-js .xvg-article:not(.xvg-open) { display:none; }
/* ===== Đợt 3: liên kết theo bước, banner Bản đồ giao diện ===== */
.xvg-steptx { display:block; min-width:0; }
.xvg-steplinks { display:flex; flex-wrap:wrap; gap:6px 8px; margin-top:8px; }
.xvg .xvg-steplinks a { display:inline-flex; align-items:center; min-height:34px; padding:0 12px; border:1px solid var(--xvg-line); border-radius:999px; background:var(--xvg-paper); color:var(--xvg-brand); font-size:13px; font-weight:700; text-decoration:none; }
.xvg .xvg-steplinks a:hover { border-color:var(--xvg-brand); background:var(--xvg-soft); }
.xvg-one .xvg-steplinks { flex-direction:column; align-items:stretch; }
.xvg .xvg-one .xvg-steplinks a { min-height:44px; font-size:14px; border-radius:12px; padding:8px 12px; line-height:1.3; justify-content:flex-start; }
.xvg-mapbanner { margin-top:26px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; align-items:center; background:var(--xvg-top,#112723); color:#ffffff; border-radius:16px; padding:20px 26px; }
.xvg-mapbanner strong { font-size:19px; font-weight:800; letter-spacing:-.01em; }
.xvg-mapbanner p { margin:4px 0 0; opacity:.85; font-size:14px; max-width:60ch; }
.xvg .xvg-mapbanner a { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 18px; border-radius:10px; background:var(--xvg-amber); color:var(--xvg-on-amber); font-weight:800; font-size:14px; text-decoration:none; }
@media (max-width:760px) { .xvg-mapbanner { grid-template-columns:1fr; padding:18px; } }
/* ===== Màn Hướng dẫn trong app (điện thoại, .xvg-app): trang chủ mới ===== */
.xvg-appv .xvg-main { padding:4px 0 24px; display:flex; flex-direction:column; gap:12px; }
.xvg-appv [data-xvg-home] { display:flex; flex-direction:column; gap:14px; }
.xvg-appv .xvg-search { margin:0; min-height:46px; padding:0 14px; border:1.5px solid var(--xvg-text); border-radius:14px; background:var(--xvg-paper); }
.xvg-appv .xvg-search:focus-within { border-color:var(--xvg-brand); }
.xvg-appv .xvg-search input { font-size:14.5px; padding:10px 0; text-align:left; }
.xvg-appv .xvg-hay-app .xvg-chips { flex-wrap:nowrap; overflow-x:auto; padding:2px 0; margin:0; scrollbar-width:none; }
.xvg-appv .xvg-hay-app .xvg-chips::-webkit-scrollbar { display:none; }
.xvg .xvg-appv .xvg-chips a { flex:none; white-space:nowrap; font-size:12.5px; }
.xvg-ctx { background:var(--xvg-soft); border:1px solid var(--xvg-line); border-radius:16px; padding:12px 14px; display:grid; gap:4px; }
.xvg-ctx-lbl { font:700 10px 'JetBrains Mono',ui-monospace,Consolas,monospace; letter-spacing:.08em; text-transform:uppercase; color:var(--xvg-brand); }
.xvg-ctx strong { font-size:15.5px; font-weight:800; line-height:1.25; }
.xvg-ctx small { color:var(--xvg-text); opacity:.8; font-size:12.5px; margin:0; }
.xvg .xvg-ctx a { justify-self:start; margin-top:6px; min-height:44px; padding:0 18px; border-radius:12px; background:var(--xvg-brand); color:var(--xvg-on-brand); font-weight:800; font-size:13.5px; text-decoration:none; display:inline-flex; align-items:center; }
.xvg-journey { background:var(--xvg-paper); border:1px solid var(--xvg-line); border-radius:16px; padding:12px 14px 4px; margin:0; }
.xvg-jhead { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.xvg-jhead h2 { font-size:16px; font-weight:800; letter-spacing:-.01em; }
.xvg-jcount { font:700 11px 'JetBrains Mono',ui-monospace,Consolas,monospace; color:var(--xvg-brand); background:var(--xvg-soft); border-radius:999px; padding:2px 10px; }
.xvg-jbar { height:6px; background:var(--xvg-line); border-radius:3px; overflow:hidden; margin:8px 0 4px; }
.xvg-jbar i { display:block; height:100%; width:0; background:var(--xvg-brand); border-radius:3px; transition:width .25s; }
.xvg-appv .xvg-start-list { display:block; background:none; border:0; border-radius:0; }
.xvg-appv .xvg-start-item { display:grid; grid-template-columns:44px minmax(0,1fr) 14px; align-items:center; gap:6px; padding:2px 0; border-bottom:1px solid var(--xvg-line); border-radius:0; background:none; }
.xvg-appv .xvg-start-item:last-child { border-bottom:0; }
.xvg .xvg-tick[aria-pressed] { background:transparent; }
.xvg-tick { width:44px; height:44px; min-height:44px; border:0; background:transparent; display:grid; place-items:center; padding:0; }
.xvg-appv .xvg-number { width:28px; height:28px; border-radius:50%; border:2px solid var(--xvg-line); background:transparent; color:var(--xvg-brand); display:grid; place-items:center; font:800 12px/1 'JetBrains Mono',ui-monospace,Consolas,monospace; flex:none; letter-spacing:0; }
.xvg-appv .xvg-start-item.da-lam .xvg-number { background:var(--xvg-brand); border-color:var(--xvg-brand); color:var(--xvg-on-brand); }
.xvg .xvg-start-link { color:var(--xvg-text); text-decoration:none; display:block; min-width:0; padding:8px 0; min-height:44px; }
.xvg-start-link strong { display:block; font-size:14.5px; font-weight:800; line-height:1.3; }
.xvg-start-link small { font-size:12px; margin-top:1px; }
.xvg-go { color:var(--xvg-muted); }
.xvg-supcard { background:var(--xvg-soft); border-radius:16px; padding:14px; display:grid; gap:10px; margin-top:6px; }
.xvg-supcard strong { display:block; font-size:14.5px; font-weight:800; }
.xvg-supcard small { display:block; color:var(--xvg-text); opacity:.8; font-size:12.5px; margin-top:2px; }
.xvg-supbtns { display:grid; grid-template-columns:2fr 1fr; gap:8px; }
.xvg-supbtn { min-height:46px; border-radius:12px; border:1.5px solid var(--xvg-brand); background:var(--xvg-paper); color:var(--xvg-brand); font-weight:800; font-size:13.5px; }
.xvg-supbtn.p { background:var(--xvg-brand); color:var(--xvg-on-brand); }
/* ===== Màn Hướng dẫn trong app: bài chi tiết (hình có số, từng bước, thanh dính ở đáy) ===== */
.xvg-appv .xvg-search[hidden] { display:none; }
.xvg-appv .xvg-article>h2 { font-size:24px; }
.xvg-appv .xvg-article { padding-top:0; }
.xvg-appv .xvg-lead { margin-bottom:14px!important; }
.xvg-meta { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:6px 0 10px; font:500 11px 'JetBrains Mono',ui-monospace,Consolas,monospace; color:var(--xvg-muted); }
.xvg-offline { background:var(--xvg-soft); border:1px solid var(--xvg-line); border-radius:12px; padding:9px 12px; font-size:12.5px; line-height:1.4; margin-bottom:8px; }
.xvg-appv .xvg-figure [data-xvg-photo-fallback]:not([hidden]) { margin:0; padding:22px 14px; text-align:center; font-size:12.5px; border:1.5px dashed var(--xvg-line); border-radius:12px; background:repeating-linear-gradient(135deg,transparent 0 12px,color-mix(in srgb,var(--xvg-line) 35%,transparent) 12px 13px); }
/* Thanh dính dùng position:fixed vì html và body của app đều đặt overflow nên position:sticky không bám được. Nằm ngay trên thanh điều hướng dưới (z-index thấp hơn hộp thoại). */
.xvg-appv .xvg-article.xvg-open { padding-bottom:calc(var(--xvg-bar,72px) + 18px); }
.xvg-appv .xvg-article .xvg-actbar { position:fixed; left:0; right:0; bottom:var(--xvg-dock,0px); z-index:8800; margin:0; padding:10px 12px; display:grid; gap:8px; background:var(--xvg-paper); border-top:1px solid var(--xvg-line); box-shadow:0 -6px 18px rgba(0,0,0,.08); }
.xvg-appv .xvg-actbar .xvg-access { margin:0!important; padding:8px 10px; border-radius:10px; font-size:12px; line-height:1.4; background:color-mix(in srgb,var(--xvg-amber) 22%,var(--xvg-paper)); color:var(--xvg-text); border-left:4px solid var(--xvg-amber); }
.xvg-actrow { display:grid; grid-template-columns:auto minmax(0,1fr); gap:8px; }
.xvg-done { min-height:46px; padding:0 14px; display:inline-flex; align-items:center; gap:6px; border:1.5px solid var(--xvg-brand); border-radius:14px; background:var(--xvg-paper); color:var(--xvg-brand); font-weight:800; font-size:13.5px; }
.xvg-done[aria-pressed="true"] { background:var(--xvg-brand); color:var(--xvg-on-brand); }
.xvg-done:disabled { opacity:.55; }
.xvg .xvg-actbar .xvg-openbtn { min-height:46px; margin:0; border-radius:14px; font-weight:800; font-size:14px; }
.xvg .xvg-actbar .xvg-openbtn.off { background:var(--xvg-line); color:var(--xvg-muted)!important; pointer-events:none; }