/* Happy — ໜ້າອ່ານ (ຄູ່ມື info.happyerp.la · ຄູ່ມື/ນະໂຍບາຍຕົວແທນ) ໃນແບຣນ «ປ້າຍລະຫັດໄລຟ໌» — brand1 · 2/10/2026
   ໂຫຼດ **ຫຼັງ** <style> ຂອງໜ້າ ແລະ ຫຼັງ assets/brand.css (ປຸ່ມຮູບປ້າຍ · ຫົວຂໍ້ Serif ມາຈາກບ່ອນນັ້ນ) — ທັບດ້ວຍລຳດັບ
   ເນື້ອຫາ (ຄວາມກວ້າງ · ຂະໜາດ · ໄລຍະແຖວ) ບໍ່ແຕະ — ອ່ານສະບາຍມາກ່ອນ · ປ່ຽນແຕ່: ຫົວຂໍ້ · ຮາວໃຕ້ຫົວເວັບ · ປຸ່ມ · ມຸມສາກ · ເຈ້ຍສີເປັນປ້າຍ */

body, html { font-family: var(--font-body); }
header b, .brand b { font-family: var(--font-display); }          /* ຊື່ໃນຫົວເວັບ = ຕົວ sans ຄືໜ້າຫຼັກ */
header b#ttl { font-family: var(--font-head); font-weight: 900; }  /* ໜ້າ lang3: ຊື່ເອກະສານ = ຫົວຂໍ້ */
.step h2 { font-weight: 900; }

/* ຮາວ 8px ໃຕ້ຫົວເວັບ (ສິ່ງທີ່ຕິດຢູ່ໃຕ້ຫົວ ຕ້ອງຂະຫຍັບລົງ 7px) */
.top { border-bottom: 8px solid var(--rail); }
details.toc2, nav.toc { top: 61px; }
/* ໜ້າ 3 ພາສາ (ຫົວຢູ່ໃນຖັນອ່ານ): ຮາວເຕັມຈໍ ດ້ວຍ border-image outset — ບໍ່ສ້າງແຖບເລື່ອນຂວາງ */
.wrap > header:first-child, .wrap > .skip-link + header { border-bottom: 8px solid transparent; border-image: linear-gradient(var(--rail), var(--rail)) 1 / 0 0 8px 0 / 0 100vw; padding-bottom: 12px; margin-bottom: 14px; }
header b#ttl { line-height: 1.25; }

/* ປຸ່ມ (ຮູບປ້າຍຈາກ brand.css) ຂະໜາດຂອງໜ້າອ່ານ */
.top .btn, .m-cta .btn { min-height: 44px; padding: 8px 14px 8px 32px; font-size: 13.5px; }
.top .btn::before, .m-cta .btn::before { left: 13px; }
.btn-ghost { border: 0; }
.back { border-radius: 0; border: 2px solid var(--text); min-height: 44px; }

/* ປ້າຍຂໍ້ມູນເໜືອ h1 (ສະບັບ · ຈຳນວນຂັ້ນ) ແລະ ເລກພາກ = ເຈ້ຍເຫຼືອງ + ໝຶກ */
.chip, h2 .n, .toc-grid a b, .m { background: var(--paper-y); color: var(--ink); border-radius: 0; }
.toc-grid a.on b { background: var(--paper-r); color: var(--ink); }
.toc-grid a.on::before { background: var(--text); border-radius: 0; }
.step::before { border-radius: 0; background: var(--ink); color: var(--paper-y); }
:root[data-theme="dark"] .step::before { background: var(--paper-y); color: var(--ink); }
.get { background: var(--paper-b); } .post { background: var(--paper-g); }
ol.steps li::marker { color: var(--text); }

/* ມຸມສາກ */
.card, .step, .tasks a, .fam a, details, details.toc2, .toc-grid a, nav.toc a, .toc a, .tip, .warn, .note, .done, figure, .tbl, code, pre, kbd, .ui, .say, .ep,
.lang-pair, .langbar button, .up, tr, .theme-tg, .tg-wrap:has(.lang-pair) .theme-tg, .theme-tg.is-float { border-radius: 0; }
@media (min-width: 1280px) { details.toc2, .toc-grid a { border-radius: 0; } }

/* ບັດ «ຢາກ…»: ລະຫັດພາກເປັນປ້າຍ (ແທນອີໂມຈິ) — ລູກສອນ = ໄປໜ້າອື່ນ */
.tasks a i { align-self: flex-start; min-width: 26px; padding: 0 6px; margin-bottom: 4px; background: var(--paper-y); color: var(--ink); font: 900 12.5px/22px var(--font-display); text-align: center; }
.tasks a.t-first i { background: var(--ink); color: var(--paper-y); }
/* ບັດ «ຫາກໍ່ເປີດຮ້ານ» (ທາງເຂົ້າຂອງຄົນໃໝ່) = ເຈ້ຍເຫຼືອງ + ໝຶກ · ບັດອື່ນ ຂອບໝຶກຕອນຊີ້ */
.tasks a.t-first { background: var(--paper-y); border-color: var(--paper-y); color: var(--ink); }
.tasks a.t-first small { color: rgba(20, 20, 20, .78); }
.tasks a:hover, .fam a:hover { border-color: var(--text); }
.fam a { border-top-width: 6px; }
.fam a, .fam a.f-ai, .fam a.f-st, .fam a.f-care { --fc: var(--paper-r); }
.fam a.f-ai { --fc: var(--paper-b); } .fam a.f-st { --fc: var(--paper-y); } .fam a.f-care { --fc: var(--paper-g); }
.fam b i { color: var(--text); }
figure { background: var(--panel-2); }                               /* ເຄີຍເປັນ #000 (ແຖບດຳໃນໂໝດແຈ້ງ) */

/* ສິ່ງທີ່ເລືອກຢູ່ = ໝຶກ */
.langbar button.on, .lang-pair a.on { background: var(--text); border-color: var(--text); color: var(--ground-deep); }

/* ປ້າຍ ເຄັດລັບ/ລະວັງ ຕາມພາສາ (ເຄີຍເປັນລາວທຸກພາສາ — audit L3-1) */
[data-lang="en"] .tip::before { content: "Tip"; } [data-lang="en"] .warn::before { content: "Careful"; }
[data-lang="th"] .tip::before { content: "เคล็ดลับ"; } [data-lang="th"] .warn::before { content: "ระวัง"; }

/* ວົງໂຟກັສ: ໝຶກ ມຸມສາກ */
:focus-visible { outline: 3px solid var(--text); outline-offset: 2px; border-radius: 0; }

/* ໂທລະສັບ: ສາລະບານທີ່ເປີດຢູ່ ຕ້ອງເລື່ອນໄດ້ຮອດທ້າຍ (GD-1) · ປຸ່ມກັບຂຶ້ນ ຢູ່ເໜືອແຖບລຸ່ມ (GD-2) */
@media (max-width: 1279px) { details.toc2[open] { max-height: calc(100vh - 150px); overflow-y: auto; overscroll-behavior: contain; } }
@media (max-width: 720px) { details.toc2, nav.toc { top: 59px; } }
@media (max-width: 640px) {
  body:has(.m-cta) .top .btn-live { display: none; }   /* ແຖບລຸ່ມມີປຸ່ມນີ້ແລ້ວ — ຫົວເວັບ EN ເຄີຍລົ້ນຈໍ 46px */
  .top .btn { padding: 8px 10px 8px 28px; } .top .btn::before { left: 11px; }
  .up { bottom: calc(84px + env(safe-area-inset-bottom)); }
  .m-cta .btn { padding: 12px 12px 12px 30px; }
}
/* API: ຕາຕະລາງບໍ່ມີ <thead> ⇒ ແຖວຫົວ (th) ເປັນບັດເປົ່າໃນມືຖື (API-1) */
@media (max-width: 720px) { table tr:has(> th):not(:has(> td)) { display: none; } }
@media print { .top, .m-cta, .up, details.toc2, nav.toc, .langbar, .lang-pair { display: none !important; }
  .step::before, .tasks a i, .chip, h2 .n, .m { print-color-adjust: exact; -webkit-print-color-adjust: exact; } }   /* ບຣາວເຊີຖິ້ມພື້ນຕອນພິມ ⇒ ເລກເຫຼືອງເທິງຂາວ 1.39:1 */
