@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/bvp-latin-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/bvp-latin-ext-400.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/bvp-vietnamese-400.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/bvp-latin-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/bvp-latin-ext-500.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/bvp-vietnamese-500.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/bvp-latin-600.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/bvp-latin-ext-600.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/bvp-vietnamese-600.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/bvp-latin-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/bvp-latin-ext-700.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/bvp-vietnamese-700.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/bvp-latin-800.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/bvp-latin-ext-800.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/bvp-vietnamese-800.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
.i-tongquan{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%227%22%20height%3D%229%22%20rx%3D%221.5%22/%3E%3Crect%20x%3D%2214%22%20y%3D%223%22%20width%3D%227%22%20height%3D%225%22%20rx%3D%221.5%22/%3E%3Crect%20x%3D%2214%22%20y%3D%2212%22%20width%3D%227%22%20height%3D%229%22%20rx%3D%221.5%22/%3E%3Crect%20x%3D%223%22%20y%3D%2216%22%20width%3D%227%22%20height%3D%225%22%20rx%3D%221.5%22/%3E%3C/svg%3E")}
.i-danhmuc{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%224%22%20y%3D%223%22%20width%3D%2216%22%20height%3D%2218%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M8%208h8M8%2012h8M8%2016h5%22/%3E%3C/svg%3E")}
.i-nangluc{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%224%22/%3E%3Cpath%20d%3D%22M5%2021v-1a7%207%200%200%201%2014%200v1%22/%3E%3Cpath%20d%3D%22M16.5%203.5l1%202%202%20.3-1.5%201.4.4%202-1.9-1-1.9%201%22/%3E%3C/svg%3E")}
.i-nhiemvu{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%205H7a2%202%200%200%200-2%202v12a2%202%200%200%200%202%202h10a2%202%200%200%200%202-2V7a2%202%200%200%200-2-2h-2%22/%3E%3Crect%20x%3D%229%22%20y%3D%223%22%20width%3D%226%22%20height%3D%224%22%20rx%3D%221%22/%3E%3Cpath%20d%3D%22m9%2014%202%202%204-4%22/%3E%3C/svg%3E")}
.i-congviec{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%227%22%20width%3D%2218%22%20height%3D%2213%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M8%207V5a2%202%200%200%201%202-2h4a2%202%200%200%201%202%202v2M3%2013h18%22/%3E%3C/svg%3E")}
.i-dongho{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2213%22%20r%3D%228%22/%3E%3Cpath%20d%3D%22M12%209v4l2.5%202.5M10%202h4M12%202v3%22/%3E%3C/svg%3E")}
.i-khoiluong{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%203v18h18%22/%3E%3Crect%20x%3D%227%22%20y%3D%2212%22%20width%3D%223%22%20height%3D%226%22/%3E%3Crect%20x%3D%2212%22%20y%3D%228%22%20width%3D%223%22%20height%3D%2210%22/%3E%3Crect%20x%3D%2217%22%20y%3D%225%22%20width%3D%223%22%20height%3D%2213%22/%3E%3C/svg%3E")}
.i-tacdong{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M13%202%204%2014h7l-1%208%209-12h-7z%22/%3E%3C/svg%3E")}
.i-nhanluc{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223.5%22/%3E%3Cpath%20d%3D%22M2.5%2020a6.5%206.5%200%200%201%2013%200%22/%3E%3Ccircle%20cx%3D%2217%22%20cy%3D%229%22%20r%3D%222.5%22/%3E%3Cpath%20d%3D%22M16%2014.2a5%205%200%200%201%205.5%205.3%22/%3E%3C/svg%3E")}
.i-nhucau{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203v18M3%2012h18%22/%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22/%3E%3C/svg%3E")}
.i-phuongan{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2217%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M3%209h18M8%202v4M16%202v4M7%2013h3M7%2017h3M14%2013h3%22/%3E%3C/svg%3E")}
.i-xuat{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203v12M7%2010l5%205%205-5%22/%3E%3Cpath%20d%3D%22M5%2021h14%22/%3E%3C/svg%3E")}
.i-nhap{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2015V3M7%208l5-5%205%205%22/%3E%3Cpath%20d%3D%22M5%2021h14%22/%3E%3C/svg%3E")}
.i-huongdan{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%204.5A2.5%202.5%200%200%201%206.5%202H20v18H6.5A2.5%202.5%200%200%200%204%2022.5z%22/%3E%3Cpath%20d%3D%22M4%204.5v18M9%207h7M9%2011h5%22/%3E%3C/svg%3E")}
.i-quantri{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%223%22/%3E%3Cpath%20d%3D%22M19.4%2015a1.7%201.7%200%200%200%20.3%201.8l.1.1a2%202%200%201%201-2.8%202.8l-.1-.1a1.7%201.7%200%200%200-1.8-.3%201.7%201.7%200%200%200-1%201.5V21a2%202%200%201%201-4%200v-.1A1.7%201.7%200%200%200%209%2019.4a1.7%201.7%200%200%200-1.8.3l-.1.1a2%202%200%201%201-2.8-2.8l.1-.1a1.7%201.7%200%200%200%20.3-1.8%201.7%201.7%200%200%200-1.5-1H3a2%202%200%201%201%200-4h.1A1.7%201.7%200%200%200%204.6%209a1.7%201.7%200%200%200-.3-1.8l-.1-.1a2%202%200%201%201%202.8-2.8l.1.1a1.7%201.7%200%200%200%201.8.3H9a1.7%201.7%200%200%200%201-1.5V3a2%202%200%201%201%204%200v.1a1.7%201.7%200%200%200%201%201.5%201.7%201.7%200%200%200%201.8-.3l.1-.1a2%202%200%201%201%202.8%202.8l-.1.1a1.7%201.7%200%200%200-.3%201.8V9a1.7%201.7%200%200%200%201.5%201H21a2%202%200%201%201%200%204h-.1a1.7%201.7%200%200%200-1.5%201z%22/%3E%3C/svg%3E")}
.i-nhatky{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%208v4l3%203%22/%3E%3Cpath%20d%3D%22M3.05%2011a9%209%200%201%201%20.5%204M3%204v7h7%22/%3E%3C/svg%3E")}
.i-hoso{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%207a2%202%200%200%201%202-2h4l2%202h8a2%202%200%200%201%202%202v9a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2z%22/%3E%3Cpath%20d%3D%22M8%2013h8M8%2016h5%22/%3E%3C/svg%3E")}
.i-menu{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%206h16M4%2012h16M4%2018h16%22/%3E%3C/svg%3E")}
.i-home{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m3%2011%209-8%209%208%22/%3E%3Cpath%20d%3D%22M5%2010v10h14V10%22/%3E%3C/svg%3E")}
.i-search{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%227%22/%3E%3Cpath%20d%3D%22m20%2020-4-4%22/%3E%3C/svg%3E")}
.i-plus{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%205v14M5%2012h14%22/%3E%3C/svg%3E")}
.i-check{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m5%2012%205%205%209-10%22/%3E%3C/svg%3E")}
.i-reload{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%2012a9%209%200%201%201-2.6-6.4L21%208%22/%3E%3Cpath%20d%3D%22M21%203v5h-5%22/%3E%3C/svg%3E")}
.i-edit{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2020h9%22/%3E%3Cpath%20d%3D%22M16.5%203.5a2.1%202.1%200%200%201%203%203L7%2019l-4%201%201-4z%22/%3E%3C/svg%3E")}
.i-trash{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%206h18M8%206V4h8v2M19%206l-1%2014H6L5%206%22/%3E%3C/svg%3E")}
.i-print{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%209V2h12v7%22/%3E%3Crect%20x%3D%223%22%20y%3D%229%22%20width%3D%2218%22%20height%3D%228%22%20rx%3D%222%22/%3E%3Crect%20x%3D%226%22%20y%3D%2214%22%20width%3D%2212%22%20height%3D%228%22/%3E%3C/svg%3E")}
.i-logout{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%2021H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h4M16%2017l5-5-5-5M21%2012H9%22/%3E%3C/svg%3E")}
.i-key{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%227.5%22%20cy%3D%2215.5%22%20r%3D%224.5%22/%3E%3Cpath%20d%3D%22m10.7%2012.3%209.8-9.8M17%206l3%203M14.5%208.5l2%202%22/%3E%3C/svg%3E")}
.i-cols{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M9%204v16M15%204v16%22/%3E%3C/svg%3E")}
.i-close{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%206l12%2012M18%206%206%2018%22/%3E%3C/svg%3E")}
.i-db{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cellipse%20cx%3D%2212%22%20cy%3D%225%22%20rx%3D%228%22%20ry%3D%223%22/%3E%3Cpath%20d%3D%22M4%205v14c0%201.7%203.6%203%208%203s8-1.3%208-3V5M4%2012c0%201.7%203.6%203%208%203s8-1.3%208-3%22/%3E%3C/svg%3E")}
/* =====================================================================
   VTVL Thanh Miếu – giao diện theo hệ thiết kế "Ngũ hành tương sinh" của qldt.thanhmieu.vn
   ===================================================================== */
:root{
  --kim-1:#B4C1D1;--kim-2:#5E6E84;--kim:#7D8BA0;
  --thuy-1:#3B8BE0;--thuy-2:#0E3A6B;--thuy:#1D5FAF;
  --moc-1:#4CC07A;--moc-2:#17703C;--moc:#23864D;
  --hoa-1:#FF8A5E;--hoa-2:#C2321A;--hoa:#E2553A;
  --tho-1:#F5C462;--tho-2:#A8660F;--tho:#E0A33B;
  --paper:#EEF2F7;--surface:#FFFFFF;--surface-2:#F5F8FC;
  --ink:#13233A;--ink-soft:#44566E;--ink-faint:#74839A;
  --line:#DCE3EC;--line-strong:#C3CEDB;
  --brand:#1D5FAF;--brand-deep:#0E3A6B;--brand-tint:#E4EEFB;
  --success:#1F7A45;--success-bg:#E1F4E8;--warning:#9A5F0B;--warning-bg:#FDF0D8;--danger:#C23A20;--danger-bg:#FDE7E1;
  --sh-1:inset 0 1px 0 rgba(255,255,255,.9),0 1px 2px rgba(14,35,65,.07),0 8px 20px -10px rgba(14,35,65,.24);
  --sh-2:inset 0 1px 0 rgba(255,255,255,.9),0 4px 10px rgba(14,35,65,.08),0 22px 40px -16px rgba(14,35,65,.36);
  --r:14px;--hdr:64px;--sb:252px;--sb-rail:78px;
  --vien-ngu-hanh:linear-gradient(90deg,var(--kim-1),var(--thuy-1) 25%,var(--moc-1) 50%,var(--hoa-1) 75%,var(--tho-1));
  --font:'Be Vietnam Pro','Segoe UI',Roboto,Arial,sans-serif;
  --mono:'IBM Plex Mono',Consolas,'Courier New',monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:14px;line-height:1.5;color:var(--ink);background:var(--paper);min-height:100vh}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(900px 520px at 100% -10%,rgba(59,139,224,.16),transparent 60%),
             radial-gradient(760px 520px at -10% 110%,rgba(76,192,122,.13),transparent 60%),
             radial-gradient(520px 360px at 60% 105%,rgba(245,196,98,.12),transparent 60%),
             linear-gradient(180deg,#F4F7FB,#EAF0F6)}
a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.01em;color:var(--brand-deep)}
.mono{font-family:var(--mono);font-size:12.5px}
.muted{color:var(--ink-faint)}.soft{color:var(--ink-soft)}
.ic{display:inline-block;width:18px;height:18px;flex:none;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.hidden{display:none!important}

/* ---------- Thanh trên ---------- */
.topbar{position:sticky;top:0;z-index:50;height:var(--hdr);display:flex;align-items:center;gap:14px;padding:0 18px 0 12px;color:#fff;
  background:linear-gradient(100deg,var(--thuy-2) 0%,var(--thuy) 52%,#1B7480 82%,var(--moc) 112%);box-shadow:0 6px 18px -8px rgba(9,30,60,.55)}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--vien-ngu-hanh)}
.btn-menu{width:42px;height:42px;border-radius:12px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.12);color:#fff;display:grid;place-items:center;cursor:pointer}
.btn-menu:hover{background:rgba(255,255,255,.22)}
.brand{display:flex;align-items:center;gap:12px;min-width:0;cursor:pointer}
.brand-glyph{position:relative;width:44px;height:44px;border-radius:13px;display:grid;place-items:center;font-weight:800;font-size:15px;color:var(--thuy-2);letter-spacing:-.03em;
  background:linear-gradient(160deg,#fff,#E6EEF8);box-shadow:inset 0 1px 0 #fff,0 4px 10px rgba(0,0,0,.25)}
.brand-glyph::before{content:"";position:absolute;inset:-3px;border-radius:16px;z-index:-1;
  background:conic-gradient(from 200deg,var(--kim-1),var(--thuy-1),var(--moc-1),var(--hoa-1),var(--tho-1),var(--kim-1))}
.brand-text{min-width:0}
.brand-text b{display:block;font-size:16px;font-weight:800;letter-spacing:.02em;white-space:nowrap}
.brand-text span{display:block;font-size:12px;opacity:.86;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.top-nav{display:flex;align-items:center;gap:6px;margin-right:4px}
.top-btn{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 13px;border-radius:10px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.12);color:#fff;font:inherit;font-weight:600;font-size:13px;cursor:pointer;white-space:nowrap}
.top-btn:hover{background:rgba(255,255,255,.22)}
.top-btn.active{background:#fff;color:var(--thuy-2);border-color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.18)}
@media (max-width:1180px){.top-btn span{display:none}.top-btn{padding:0 9px}}
@media (max-width:1100px){.pill-ky{display:none}}
.pill-ky{white-space:nowrap}
.pill-ky{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;font-weight:700;font-size:12.5px;color:#4A2E02;
  background:linear-gradient(180deg,#FFE19A,var(--tho-1));box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 2px 0 var(--tho-2)}
.avatar{display:flex;align-items:center;gap:10px;padding:4px 6px 4px 4px;border-radius:999px;cursor:pointer;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);color:#fff}
.avatar:hover{background:rgba(255,255,255,.2)}
.avatar i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:800;color:var(--thuy-2);background:linear-gradient(160deg,#fff,#DCE8F6)}
.avatar span{font-size:12.5px;line-height:1.2;max-width:180px}
.avatar span small{display:block;opacity:.8;font-size:11px}
.menu-pop{position:absolute;right:16px;top:calc(var(--hdr) - 2px);min-width:230px;background:#fff;color:var(--ink);border-radius:14px;box-shadow:var(--sh-2);border:1px solid var(--line);padding:6px;z-index:60}
.menu-pop button{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;padding:10px 12px;border-radius:10px;font:inherit;color:inherit;cursor:pointer;text-align:left}
.menu-pop button:hover{background:var(--brand-tint)}

/* ---------- Thanh bên ---------- */
.thanh-ben{position:fixed;top:var(--hdr);bottom:0;left:0;width:var(--sb);z-index:40;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#FFFFFF,#F7FAFD);border-right:1px solid var(--line);box-shadow:4px 0 16px -12px rgba(14,35,65,.3);transition:width .2s}
.thanh-ben nav{flex:1;overflow-y:auto;padding:12px 10px 16px}
.thanh-ben::after{content:"";height:4px;background:var(--vien-ngu-hanh);flex:none}
.nav-grp{margin:14px 10px 6px;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap;overflow:hidden}
.nav-btn{position:relative;display:flex;align-items:center;width:100%;min-height:50px;padding:6px 10px 6px 60px;margin:2px 0;border:0;border-radius:14px;background:none;font:inherit;font-weight:600;color:var(--ink-soft);cursor:pointer;text-align:left;line-height:1.25}
.nav-btn::before{content:"";position:absolute;left:8px;top:50%;width:38px;height:38px;margin-top:-19px;border-radius:12px;
  background:linear-gradient(155deg,var(--c1),var(--c2));box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 0 rgba(0,0,0,.12),0 3px 8px -3px var(--c2)}
.nav-btn::after{content:"";position:absolute;left:17px;top:50%;width:20px;height:20px;margin-top:-10px;background:#fff;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.nav-btn small{display:block;font-size:11px;font-weight:500;color:var(--ink-faint)}
.nav-btn:hover{background:var(--surface-2);color:var(--ink)}
.nav-btn.active{background:linear-gradient(90deg,var(--brand-tint),#fff);color:var(--brand-deep);font-weight:800;box-shadow:inset 3px 0 0 var(--brand)}
.nav-btn .nav-badge{margin-left:auto;font-size:11px;font-weight:800;min-width:24px;height:20px;padding:0 6px;border-radius:999px;display:grid;place-items:center;color:#fff;background:var(--hoa)}
.nav-btn .nav-badge.ok{background:var(--moc)}
.t-kim{--c1:var(--kim-1);--c2:var(--kim-2)}.t-thuy{--c1:var(--thuy-1);--c2:var(--thuy-2)}.t-moc{--c1:var(--moc-1);--c2:var(--moc-2)}
.t-hoa{--c1:var(--hoa-1);--c2:var(--hoa-2)}.t-tho{--c1:var(--tho-1);--c2:var(--tho-2)}
body.rail .thanh-ben{width:var(--sb-rail)}
body.rail .thanh-ben .nav-grp{visibility:hidden;height:6px;margin:6px 0}
body.rail .thanh-ben .nav-btn{padding-left:0;color:transparent;font-size:0}
body.rail .thanh-ben .nav-btn small,body.rail .nav-badge{display:none}
body.rail .main{margin-left:var(--sb-rail)}

/* ---------- Nội dung ---------- */
.main{margin-left:var(--sb);padding:20px 24px 0;min-height:calc(100vh - var(--hdr));display:flex;flex-direction:column;transition:margin .2s}
.main>.view{flex:1}
.footer{margin:28px -24px 0;padding:16px 24px;border-top:1px solid var(--line);background:rgba(255,255,255,.6);font-size:12px;color:var(--ink-faint);display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:space-between}
.footer b{color:var(--ink-soft)}

.view-head{position:relative;display:flex;align-items:center;gap:16px;padding:18px 20px 18px 24px;margin-bottom:16px;border-radius:18px;
  background:linear-gradient(180deg,#FFF,#FBFCFE);box-shadow:var(--sh-1);border:1px solid var(--line);overflow:hidden}
.view-head::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,var(--c1),var(--c2))}
.view-head .vh-ic{width:58px;height:58px;border-radius:16px;flex:none;display:grid;place-items:center;
  background:linear-gradient(155deg,var(--c1),var(--c2));box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -3px 0 rgba(0,0,0,.12),0 8px 18px -8px var(--c2)}
.view-head .vh-ic .ic{width:28px;height:28px;background:#fff}
.view-head h1{font-size:clamp(18px,1.6vw,24px)}
.view-head p{margin:4px 0 0;color:var(--ink-soft);font-size:13px;max-width:880px}
.view-head .vh-stats{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.vh-deco{position:absolute;right:-30px;bottom:-40px;width:180px;height:180px;border-radius:50%;opacity:.08;background:conic-gradient(var(--kim),var(--thuy),var(--moc),var(--hoa),var(--tho),var(--kim));pointer-events:none}

.card{position:relative;background:linear-gradient(180deg,#FFF,#FBFCFE);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-1);padding:16px 18px;overflow:hidden}
.card.strip::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--vien-ngu-hanh)}
.card h2{font-size:15.5px;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.card h2 .ic{color:var(--brand)}
.grid{display:grid;gap:16px}
.g-4{grid-template-columns:repeat(4,minmax(0,1fr))}.g-3{grid-template-columns:repeat(3,minmax(0,1fr))}.g-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-21{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
@media (max-width:1180px){.g-4{grid-template-columns:repeat(2,minmax(0,1fr))}.g-3,.g-21{grid-template-columns:1fr}}
@media (max-width:640px){.g-4,.g-2{grid-template-columns:1fr}}

.stat{position:relative;padding:16px 16px 16px 76px;min-height:88px;border-radius:var(--r);border:1px solid var(--line);background:linear-gradient(180deg,#FFF,#FBFCFE);box-shadow:var(--sh-1)}
.stat::before{content:"";position:absolute;left:16px;top:18px;width:48px;height:48px;border-radius:14px;background:linear-gradient(155deg,var(--c1),var(--c2));box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -3px 0 rgba(0,0,0,.12),0 6px 14px -6px var(--c2)}
.stat::after{content:"";position:absolute;left:28px;top:30px;width:24px;height:24px;background:#fff;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.stat b{display:block;font-size:26px;font-weight:800;line-height:1.1;color:var(--c2);font-variant-numeric:tabular-nums}
.stat span{display:block;font-size:12.5px;color:var(--ink-soft);font-weight:600}
.stat small{display:block;font-size:11.5px;color:var(--ink-faint)}

/* ---------- Nút, ô nhập ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 16px;border-radius:11px;border:1px solid transparent;font:inherit;font-weight:700;font-size:13.5px;cursor:pointer;white-space:nowrap;transition:transform .05s,box-shadow .05s,filter .15s;text-decoration:none!important}
.btn:active{transform:translateY(2px)}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn-primary{color:#fff;background:linear-gradient(180deg,var(--thuy-1),var(--thuy) 55%,#174F93);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 3px 0 var(--thuy-2)}
.btn-primary:active{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 1px 0 var(--thuy-2)}
.btn-primary:hover{filter:brightness(1.06)}
.btn-success{color:#fff;background:linear-gradient(180deg,var(--moc-1),var(--moc) 55%,#1C7342);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 3px 0 var(--moc-2)}
.btn-success:active{box-shadow:0 1px 0 var(--moc-2)}
.btn-danger{color:#fff;background:linear-gradient(180deg,var(--hoa-1),var(--hoa) 55%,#C8432A);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 3px 0 var(--hoa-2)}
.btn-secondary{color:var(--ink);background:linear-gradient(180deg,#FFF,#F1F5FA);border-color:var(--line-strong);box-shadow:inset 0 1px 0 #fff,0 2px 0 var(--line-strong)}
.btn-secondary:hover{background:linear-gradient(180deg,#FFF,#E9F0F8)}
.btn-secondary:active{box-shadow:0 0 0 var(--line-strong)}
.btn-sm{min-height:32px;padding:0 11px;font-size:12.5px;border-radius:9px}
.btn-icon{width:34px;min-height:34px;padding:0}
.btn-ghost{background:none;border-color:transparent;color:var(--ink-soft)}.btn-ghost:hover{background:var(--brand-tint);color:var(--brand-deep)}
.input,select.input,textarea.input{width:100%;min-height:42px;padding:9px 12px;border:1px solid var(--line-strong);border-radius:10px;background:#F8FAFD;color:var(--ink);font:inherit;
  box-shadow:inset 0 1px 2px rgba(14,35,65,.06);transition:border-color .15s,box-shadow .15s,background .15s}
textarea.input{min-height:84px;resize:vertical;line-height:1.45}
.input:focus{outline:0;border-color:var(--brand);background:#fff;box-shadow:0 0 0 4px rgba(29,95,175,.16)}
.input.sm{min-height:36px;padding:6px 10px;font-size:13px}
label.fl{display:block;font-size:12.5px;font-weight:700;color:var(--ink-soft);margin:0 0 6px}
label.fl em{font-style:normal;color:var(--danger)}
.field{margin-bottom:14px}
.field .hint{font-size:11.5px;color:var(--ink-faint);margin-top:4px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.form-grid .full{grid-column:1/-1}
@media (max-width:720px){.form-grid{grid-template-columns:1fr}}
.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px}
.toolbar .search{position:relative;flex:1 1 240px;max-width:360px}
.toolbar .search .ic{position:absolute;left:11px;top:50%;margin-top:-9px;color:var(--ink-faint)}
.toolbar .search .input{padding-left:36px}
.toolbar select.input{width:auto;min-width:130px;max-width:250px}
.toolbar .sp{flex:1}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--ink-soft);cursor:pointer;user-select:none}
.chk input{width:16px;height:16px;accent-color:var(--brand)}

/* ---------- Chip trạng thái ---------- */
.chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:700;line-height:1.35;white-space:normal;border:1px solid transparent}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.chip.ok{color:var(--success);background:linear-gradient(180deg,#EFFAF3,var(--success-bg));border-color:#BFE6CD}
.chip.warn{color:var(--warning);background:linear-gradient(180deg,#FFF8EA,var(--warning-bg));border-color:#F1D49A}
.chip.err{color:var(--danger);background:linear-gradient(180deg,#FFF3EF,var(--danger-bg));border-color:#F5C2B5}
.chip.info{color:var(--brand-deep);background:linear-gradient(180deg,#F1F6FD,var(--brand-tint));border-color:#C7DAF3}
.chip.mute{color:var(--ink-soft);background:#F1F4F8;border-color:var(--line)}
.chip.big{font-size:12.5px;padding:5px 12px}

/* ---------- Bảng dữ liệu ---------- */
.tbl-wrap{position:relative;overflow:auto;max-height:calc(100vh - var(--hdr) - 250px);min-height:260px;border:1px solid var(--line);border-radius:var(--r);background:#fff;box-shadow:var(--sh-1)}
.tbl-wrap.auto{max-height:none;min-height:0}
table.tbl{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:13px}
table.tbl th{position:sticky;top:0;z-index:2;background:linear-gradient(180deg,#F5F8FC,#EAF0F7);color:var(--ink-soft);font-size:11.5px;font-weight:800;text-align:left;
  padding:9px 10px;border-bottom:1px solid var(--line-strong);border-right:1px solid var(--line);vertical-align:bottom;line-height:1.3}
table.tbl th.calc{background:linear-gradient(180deg,#EEF1F5,#E2E7EE);color:var(--kim-2)}
table.tbl th.calc::after{content:" ƒ";color:var(--kim);font-weight:600}
table.tbl th.ext{box-shadow:inset 0 -3px 0 var(--tho-1)}
table.tbl td{padding:7px 10px;border-bottom:1px solid #EDF1F6;border-right:1px solid #F1F4F8;vertical-align:top;background:#fff}
table.tbl tbody tr:nth-child(even) td{background:#FAFCFE}
table.tbl tbody tr:hover td{background:linear-gradient(90deg,var(--brand-tint),#F7FAFE)}
table.tbl tbody tr:hover td:first-child{box-shadow:inset 4px 0 0 var(--brand)}
table.tbl .sticky{position:sticky;left:0;z-index:1}
table.tbl th.sticky{z-index:3}
table.tbl td.num,table.tbl th.num{text-align:right;font-variant-numeric:tabular-nums}
table.tbl td.calc{color:var(--kim-2);background-image:linear-gradient(0deg,rgba(125,139,160,.05),rgba(125,139,160,.05))}
table.tbl td.ed{cursor:text}
table.tbl td.ed:hover{outline:2px solid #BCD4F2;outline-offset:-2px}
table.tbl td.ed.empty::after{content:"＋";color:#C0CAD8}
table.tbl td.editing{padding:2px;outline:2px solid var(--brand);outline-offset:-2px}
table.tbl td.editing .input{min-height:34px;border-radius:7px;padding:5px 8px;font-size:13px}
table.tbl td.editing textarea.input{min-height:90px}
table.tbl td .cl{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
table.tbl tr.row-xn td:first-child{box-shadow:inset 4px 0 0 var(--moc-1)}
table.tbl tr.row-lb td{color:var(--ink-faint);text-decoration:line-through}
table.tbl tr.saved td{animation:flash 1.2s}
@keyframes flash{0%{background:#DDF5E6}100%{}}
table.tbl td.act{white-space:nowrap}
table.tbl td.sel,table.tbl th.sel{width:34px;text-align:center}
.tbl-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px;font-size:12.5px;color:var(--ink-soft)}
.tbl-foot .sp{flex:1}
table.simple{width:100%;border-collapse:collapse;font-size:13px}
table.simple th{text-align:left;font-size:11.5px;font-weight:800;color:var(--ink-soft);padding:8px 10px;background:linear-gradient(180deg,#F5F8FC,#EAF0F7);border-bottom:1px solid var(--line-strong)}
table.simple td{padding:8px 10px;border-bottom:1px solid #EDF1F6;vertical-align:top}
table.simple tr:hover td{background:#F6F9FD}
table.simple td.num,table.simple th.num{text-align:right;font-variant-numeric:tabular-nums}
table.simple tfoot td{font-weight:800;background:#F5F8FC}

.bar{height:10px;border-radius:999px;background:#E8EDF3;overflow:hidden;box-shadow:inset 0 1px 2px rgba(14,35,65,.1);min-width:80px}
.bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--moc-1),var(--moc))}
.bar.low i{background:linear-gradient(90deg,var(--hoa-1),var(--hoa))}.bar.mid i{background:linear-gradient(90deg,var(--tho-1),var(--tho))}

/* ---------- Hộp thoại ---------- */
.overlay{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px 16px;background:rgba(9,24,46,.55);backdrop-filter:blur(3px);overflow-y:auto}
.modal{position:relative;width:min(760px,100%);background:#fff;border-radius:20px;box-shadow:0 30px 70px -20px rgba(0,0,0,.55);overflow:hidden;animation:pop .16s ease-out}
.modal.wide{width:min(1000px,100%)}.modal.narrow{width:min(460px,100%)}
@keyframes pop{from{transform:translateY(10px) scale(.98);opacity:0}}
.modal::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--vien-ngu-hanh)}
.modal-h{display:flex;align-items:center;gap:12px;padding:20px 22px 12px}
.modal-h h3{font-size:17px}
.modal-h .x{margin-left:auto}
.modal-b{padding:6px 22px 8px;max-height:68vh;overflow-y:auto}
.modal-f{display:flex;gap:10px;justify-content:flex-end;padding:14px 22px 18px;border-top:1px solid var(--line);background:var(--surface-2)}

/* ---------- Hộp lưu ý, bước ---------- */
.notice{padding:12px 14px;border-radius:12px;border:1px solid #F1D49A;background:linear-gradient(180deg,#FFF7E6,#FCEBC8);color:#6B4307;font-size:13px}
.notice.info{border-color:#C7DAF3;background:linear-gradient(180deg,#F3F8FE,#E4EEFB);color:var(--brand-deep)}
.notice.ok{border-color:#BFE6CD;background:linear-gradient(180deg,#F1FBF4,#E1F4E8);color:#14552F}
.notice.err{border-color:#F5C2B5;background:linear-gradient(180deg,#FFF5F2,#FDE7E1);color:#8A2614}
.notice b{color:inherit}
.steps{list-style:none;margin:0;padding:0;counter-reset:st}
.steps li{position:relative;padding:4px 0 14px 52px;counter-increment:st;min-height:44px}
.steps li::before{content:counter(st);position:absolute;left:0;top:0;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-weight:800;color:#fff;
  background:linear-gradient(155deg,var(--c1),var(--c2));box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 0 rgba(0,0,0,.12)}
.steps li:nth-child(5n+1){--c1:var(--kim-1);--c2:var(--kim-2)}.steps li:nth-child(5n+2){--c1:var(--thuy-1);--c2:var(--thuy-2)}
.steps li:nth-child(5n+3){--c1:var(--moc-1);--c2:var(--moc-2)}.steps li:nth-child(5n+4){--c1:var(--hoa-1);--c2:var(--hoa-2)}.steps li:nth-child(5n+5){--c1:var(--tho-1);--c2:var(--tho-2)}
.steps li b{display:block;color:var(--brand-deep)}
.steps li span{color:var(--ink-soft);font-size:13px}
.kv{display:grid;grid-template-columns:200px 1fr;gap:6px 14px;font-size:13px}
.kv dt{color:var(--ink-faint);font-weight:600}.kv dd{margin:0}

/* ---------- Thông báo nổi ---------- */
#toasts{position:fixed;right:18px;bottom:18px;z-index:200;display:flex;flex-direction:column;gap:8px;max-width:min(420px,calc(100vw - 36px))}
.toast{padding:12px 16px;border-radius:12px;background:#fff;box-shadow:var(--sh-2);border-left:5px solid var(--moc);font-size:13px;white-space:pre-line;animation:pop .18s}
.toast.err{border-left-color:var(--hoa)}.toast.warn{border-left-color:var(--tho)}

/* ---------- Đăng nhập ---------- */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.login{position:relative;width:min(440px,100%);padding:34px 32px 26px;border-radius:22px;background:linear-gradient(180deg,#fff,#FAFCFE);box-shadow:var(--sh-2);border:1px solid var(--line);overflow:hidden}
.login::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--vien-ngu-hanh)}
.login .brand-glyph{width:60px;height:60px;font-size:20px;border-radius:17px;margin:0 auto 14px}
.login .brand-glyph::before{border-radius:20px}
.login h1{text-align:center;font-size:21px}
.login p.sub{text-align:center;margin:4px 0 22px;color:var(--ink-soft);font-size:13px}
.login .btn{width:100%;min-height:46px;font-size:15px;margin-top:6px}
.login .foot{margin-top:18px;text-align:center;font-size:11.5px;color:var(--ink-faint)}
.login-hero{position:fixed;inset:0 auto auto 0;height:220px;width:100%;z-index:-1;background:linear-gradient(100deg,var(--thuy-2) 0%,var(--thuy) 52%,#1B7480 82%,var(--moc) 112%)}
.login-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--vien-ngu-hanh)}

/* ---------- Hồ sơ in ---------- */
.doc{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-1);padding:36px 44px;font-family:'Times New Roman',Times,serif;font-size:15px;color:#000;line-height:1.45}
.doc h2{font-family:inherit;color:#000;font-size:16px;margin:18px 0 8px;font-weight:700}
.doc .qh{display:grid;grid-template-columns:1fr 1.3fr;text-align:center;font-size:14px;margin-bottom:18px}
.doc .qh b{display:block}
.doc .qh u{display:inline-block;width:120px;border-top:1px solid #000;margin-top:2px}
.doc .title{text-align:center;font-weight:700;font-size:16.5px;margin:12px 0 2px}
.doc .subt{text-align:center;font-style:italic;margin-bottom:16px}
.doc table{width:100%;border-collapse:collapse;font-size:13.5px;margin:6px 0 10px}
.doc th,.doc td{border:1px solid #000;padding:4px 6px;vertical-align:top}
.doc th{font-weight:700;text-align:center;background:#F2F2F2}
.doc td.num{text-align:right}
.doc .sign{display:grid;grid-template-columns:1fr 1fr;text-align:center;margin-top:24px}
.doc .sign b{display:block}
.doc .sign i{display:block;font-size:13px}

/* ---------- Đáp ứng ---------- */
@media (max-width:1279px){body:not(.sb-open) .thanh-ben{width:var(--sb-rail)}
  body:not(.sb-open) .thanh-ben .nav-grp{visibility:hidden;height:6px;margin:6px 0}
  body:not(.sb-open) .thanh-ben .nav-btn{padding-left:0;color:transparent;font-size:0}
  body:not(.sb-open) .thanh-ben .nav-btn small,body:not(.sb-open) .nav-badge{display:none}
  .main{margin-left:var(--sb-rail)}}
@media (max-width:760px){.thanh-ben{transform:translateX(-100%);width:var(--sb)!important;transition:transform .2s}
  body.sb-open .thanh-ben{transform:none}.main{margin-left:0!important;padding:14px 12px 0}
  .brand-text span,.pill-ky,.avatar span{display:none}.view-head{flex-wrap:wrap}.view-head .vh-stats{margin-left:0}.footer{margin:24px -12px 0}
  .kv{grid-template-columns:1fr}}

/* ---------- In ---------- */
@media print{
  @page{size:A4;margin:15mm 15mm 15mm 25mm}
  body{background:#fff}body::before{display:none}
  .topbar,.thanh-ben,.footer,.no-print,#toasts,.view-head{display:none!important}
  .main{margin:0!important;padding:0!important}
  .doc{border:0;box-shadow:none;padding:0}
  .card{box-shadow:none;border:0;padding:0}
}

.menu-pop .mp-h{padding:8px 12px 4px;margin:0}
.card h2 .sp{flex:1}
.nav-btn>span{display:block;min-width:0;flex:1}
.nav-btn .nav-badge{flex:none;margin-left:8px}
table.simple .chip{white-space:nowrap}
table.simple td.mono,table.tbl td .mono{white-space:nowrap}
.mt{margin-top:16px}
.hq{display:inline-grid;place-items:center;width:17px;height:17px;margin-left:5px;border-radius:50%;border:0;padding:0;vertical-align:1px;font:800 10.5px/1 var(--font);color:#fff;
  background:linear-gradient(155deg,var(--thuy-1),var(--thuy));cursor:pointer;box-shadow:0 1px 0 var(--thuy-2)}
.hq:hover{filter:brightness(1.12)}
.hq-demo{cursor:default}
.fh{margin-top:6px;padding:7px 10px;border-left:3px solid var(--thuy-1);border-radius:0 8px 8px 0;background:linear-gradient(90deg,#F1F6FD,#FAFCFE);font-size:12px;line-height:1.5;color:var(--ink-soft)}
.fh b{color:var(--brand-deep);font-weight:700}
.fh-vd{font-style:italic;color:var(--ink)}
.help-pop{position:fixed;z-index:150;background:#fff;border:1px solid var(--line-strong);border-radius:12px;box-shadow:var(--sh-2);padding:10px 12px 10px;font-size:12.5px;animation:pop .12s}
.help-pop::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;border-radius:12px 12px 0 0;background:var(--vien-ngu-hanh)}
.help-pop .hp-t{font-weight:800;color:var(--brand-deep);margin:2px 0 4px;display:flex;align-items:center;gap:6px}
.help-pop .fh{margin-top:0;border-left:0;background:none;padding:0}
.help-pop .fh>div{margin-bottom:4px}
.help-pop .hp-x{font-size:11px;margin-top:4px}
.help-pop.sticky{pointer-events:none;background:#FFFEF7;border-color:#F1D49A}
details.guide{margin-bottom:12px;border:1px solid var(--line);border-radius:var(--r);background:linear-gradient(180deg,#FFF,#FBFCFE);box-shadow:var(--sh-1);overflow:hidden}
details.guide summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;padding:11px 16px;font-weight:800;color:var(--brand-deep);background:linear-gradient(90deg,var(--brand-tint),#fff)}
details.guide summary::-webkit-details-marker{display:none}
details.guide summary .muted{font-weight:500;font-size:12px}
details.guide summary::after{content:"▾";margin-left:auto;color:var(--ink-faint);transition:transform .15s}
details.guide:not([open]) summary::after{transform:rotate(-90deg)}
.guide-b{padding:12px 16px 12px}
.steps.sm li{padding:2px 0 8px 42px;min-height:34px}
.steps.sm li::before{width:30px;height:30px;border-radius:10px;font-size:13px}
.steps.sm li span{color:var(--ink);font-size:13px}
.guide-legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:4px;padding-top:10px;border-top:1px dashed var(--line);font-size:12px;color:var(--ink-soft)}
.guide-legend span{display:inline-flex;align-items:center;gap:6px}
.lg{display:inline-block;width:18px;height:12px;border-radius:3px;border:1px solid var(--line-strong)}
.lg-ed{background:#fff;outline:2px solid #BCD4F2;outline-offset:-2px}.lg-calc{background:linear-gradient(180deg,#EEF1F5,#E2E7EE)}.lg-ext{background:#fff;box-shadow:inset 0 -3px 0 var(--tho-1)}
.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.tab{min-height:38px;padding:0 14px;border-radius:10px;border:1px solid var(--line-strong);background:linear-gradient(180deg,#FFF,#F1F5FA);font:inherit;font-weight:700;color:var(--ink-soft);cursor:pointer}
.tab.on{color:#fff;border-color:transparent;background:linear-gradient(180deg,var(--thuy-1),var(--thuy) 55%,#174F93);box-shadow:0 2px 0 var(--thuy-2)}
.hd h3{font-size:15px;margin:18px 0 8px;color:var(--brand-deep)}
.hd h3:first-child{margin-top:0}
.hd p,.hd li{font-size:13.5px;line-height:1.6}
.hd ul{padding-left:20px;margin:6px 0}
.hd table.simple td,.hd table.simple th{font-size:12.5px}
.faq details{border:1px solid var(--line);border-radius:10px;margin-bottom:8px;background:#fff}
.faq summary{cursor:pointer;padding:10px 14px;font-weight:700;color:var(--brand-deep)}
.faq details>div{padding:0 14px 12px;font-size:13.5px;line-height:1.6;color:var(--ink-soft)}
@media print{.tabs,.hq{display:none!important}.hd .tabpane{display:block!important;page-break-after:always}}
.print-only{display:none}
@media print{.print-only{display:block}}
.tabs .sp{flex:1}
.hd h2.print-only{display:none}
@media print{.hd h2.print-only{display:block;margin:18px 0 8px}}

/* ===== Bản thử nghiệm kiêm nhiệm ===== */
.test-pill{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:#FFD54F;color:#5A3B00;font-size:10.5px;font-weight:800;letter-spacing:.02em;vertical-align:middle}
.notice.warn{background:#FFF6E0;border-color:#F2C46B;color:#5A3B00}
.kn-row{cursor:pointer}.kn-row:hover td{background:#F3F8FE}
.kn-h3{font-size:14px;margin:14px 0 6px;color:var(--thuy-2)}
.kn-flow{display:flex;flex-wrap:wrap;align-items:stretch;gap:6px;margin:12px 0}
.kn-step{display:flex;flex-direction:column;gap:2px;min-width:150px;max-width:220px;padding:8px 10px;border:1px solid var(--line-strong);border-radius:10px;background:linear-gradient(180deg,#fff,#F5F9FD)}
.kn-step small{color:var(--hoa-2);font-weight:700;text-transform:uppercase;font-size:10.5px}.kn-step span{font-size:12.5px}.kn-step em{font-style:normal;font-size:11.5px;color:#5B6B80}
.kn-arrow{align-self:center;font-weight:800;color:var(--thuy)}

/* ===== Đăng nhập dùng chung, 2FA ===== */
.sso-btn{display:flex;justify-content:center;align-items:center;gap:8px;width:100%;text-decoration:none}
details.noi-bo{margin-top:12px;border-top:1px dashed var(--line);padding-top:10px}details.noi-bo summary{cursor:pointer;font-size:13px}
.qr-box{display:flex;justify-content:center;margin:8px auto;width:200px;height:200px;background:#fff;padding:6px;border:1px solid var(--line);border-radius:10px}.qr-box svg{width:100%;height:100%}
.hidden{display:none!important}