:root, html[data-theme="beige"]{
  --navy:#3a2a1c;--navy2:#2a1d14;--navy3:#5a4030;--navy4:#6d5140;
  --white:#f7f1e6;--bg:#e4d3b8;--bg2:#d4c09e;--card:#f4ead8;
  --border:#c4ad8c;--border2:#ad9470;
  --text:#2a1c12;--muted:#6b5644;--light:#a08c74;
  --red:#8a3328;--green:#2f5a38;--amber:#8a6230;
  --gold:#8d6a32;--accent:#6d5132;
  --cong-bg:#edd9a4;--cong-fg:#5a3e10;
  --lon-bg:#e4c09a;--lon-fg:#6a3414;
  --latvat-bg:#ddd2c2;--latvat-fg:#4e463e;
  --tt-bg:#d5e0c4;--tt-fg:#243f28;
  --on:#f7f1e6;--on-dim:rgba(247,241,230,.72);--on-faint:rgba(247,241,230,.42);
  --chrome-line:rgba(247,241,230,.16);--chrome-hover:rgba(247,241,230,.08);
  --mark:#e6d3a3;--debt:#f0c2b4;
  --band-red:#f0c2b4;--band-green:#c9e2c4;--band-amber:#f0dd9a;--total-fg:#f0dd9a;
  --stripe:rgba(212,192,158,.55);--hover:rgba(141,106,50,.12);--chuyen:#f0d0c6;
  --desk:#d4c4a8;--home1:#efe2cc;--home2:#e0ccae;--glow:rgba(141,106,50,.22);
  --overlay:rgba(42,29,20,.5);--paper:#fffdf8;--ok:#2f5a38;
  --sidebar-w:280px;--radius:8px;--radius2:12px;
}
html[data-theme="mono"]{
  --navy:#111111;--navy2:#000000;--navy3:#2a2a2a;--navy4:#3a3a3a;
  --white:#ffffff;--bg:#f3f3f3;--bg2:#e6e6e6;--card:#ffffff;
  --border:#cfcfcf;--border2:#b5b5b5;
  --text:#111111;--muted:#5c5c5c;--light:#8a8a8a;
  --red:#222222;--green:#333333;--amber:#444444;
  --gold:#222222;--accent:#111111;
  --cong-bg:#f4f4f4;--cong-fg:#111111;
  --lon-bg:#e2e2e2;--lon-fg:#111111;
  --latvat-bg:#f7f7f7;--latvat-fg:#444444;
  --tt-bg:#dedede;--tt-fg:#111111;
  --on:#ffffff;--on-dim:rgba(255,255,255,.78);--on-faint:rgba(255,255,255,.45);
  --chrome-line:rgba(255,255,255,.16);--chrome-hover:rgba(255,255,255,.08);
  --mark:#ffffff;--debt:#ffffff;
  --band-red:#ffffff;--band-green:#d8d8d8;--band-amber:#eeeeee;--total-fg:#ffffff;
  --stripe:rgba(0,0,0,.04);--hover:rgba(0,0,0,.06);--chuyen:#ececec;
  --desk:#e5e5e5;--home1:#f7f7f7;--home2:#e8e8e8;--glow:rgba(0,0,0,.06);
  --overlay:rgba(0,0,0,.55);--paper:#ffffff;--ok:#222222;
  --sidebar-w:280px;--radius:8px;--radius2:12px;
}
html[data-theme="navy"]{
  --navy:#071833;--navy2:#041026;--navy3:#12315f;--navy4:#1a4178;
  --white:#ffffff;--bg:#f3f6fb;--bg2:#e4ebf5;--card:#ffffff;
  --border:#d3deee;--border2:#b7c7de;
  --text:#0e1c33;--muted:#5a6d86;--light:#8aa0bb;
  --red:#9b2c2c;--green:#1f6b45;--amber:#8a5a12;
  --gold:#d6e4f7;--accent:#12315f;
  --cong-bg:#e7eef8;--cong-fg:#12315f;
  --lon-bg:#d9e3f2;--lon-fg:#0e1c33;
  --latvat-bg:#eef2f7;--latvat-fg:#4d5e74;
  --tt-bg:#e5f2ea;--tt-fg:#1f6b45;
  --on:#ffffff;--on-dim:rgba(255,255,255,.78);--on-faint:rgba(255,255,255,.42);
  --chrome-line:rgba(255,255,255,.14);--chrome-hover:rgba(255,255,255,.08);
  --mark:#ffffff;--debt:#f3c7c7;
  --band-red:#f3c7c7;--band-green:#c9ead6;--band-amber:#f6e3b0;--total-fg:#f6e3b0;
  --stripe:rgba(18,49,95,.05);--hover:rgba(18,49,95,.07);--chuyen:#f8e4e4;
  --desk:#d5deea;--home1:#f7f9fc;--home2:#e7eef8;--glow:rgba(18,49,95,.12);
  --overlay:rgba(4,16,38,.55);--paper:#ffffff;--ok:#1f6b45;
  --sidebar-w:280px;--radius:8px;--radius2:12px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{font-family:Roboto,"Segoe UI",system-ui,sans-serif;font-size:13px;color:var(--text);background:var(--bg);line-height:1.35;text-transform:uppercase;}
button,input,select,textarea{font-family:inherit;text-transform:inherit;}
input[type="password"],#lg-user,#lg-pass{text-transform:none;}
.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;}
.center{text-align:center;}
.wrap{overflow-wrap:break-word;word-break:break-word;}
.up{text-transform:uppercase;}
.app{display:flex;height:100vh;}
.sidebar{width:var(--sidebar-w);background:var(--navy);color:var(--on);display:flex;flex-direction:column;flex-shrink:0;overflow:hidden;}
.sidebar-header{padding:10px 12px 8px;border-bottom:1px solid var(--chrome-line);cursor:pointer;}
.sidebar-header .co{font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--on-dim);margin-bottom:2px;}
.sidebar-header h1{font-size:14px;font-weight:900;letter-spacing:.04em;line-height:1.25;color:var(--on);}
.sidebar-nav{flex:1;overflow-y:auto;padding:6px 0;}
.nav-group{margin-bottom:10px;}
.nav-group-label{font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--on-faint);padding:8px 12px 3px;}
.nav-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:6px 12px;border:none;border-left:3px solid transparent;background:transparent;color:var(--on-dim);font-size:12px;font-weight:700;letter-spacing:.03em;cursor:pointer;text-align:left;line-height:1.25;text-transform:uppercase;}
.nav-item:hover{background:var(--chrome-hover);color:var(--on);}
.nav-item.active{border-left-color:var(--mark);background:var(--chrome-hover);color:var(--on);}
.nav-item .dot{width:10px;height:10px;border-radius:3px;flex-shrink:0;}
.nav-item .debt{font-size:11px;font-weight:600;color:var(--debt);}
.nav-item .debt.zero{color:var(--on-faint);}
.sidebar-footer{border-top:1px solid var(--chrome-line);padding:8px 12px;display:flex;flex-direction:column;gap:6px;}
.sidebar-footer button{display:flex;align-items:center;gap:6px;width:100%;padding:6px 10px;background:var(--chrome-hover);border:1px solid var(--chrome-line);border-radius:var(--radius);color:var(--on-dim);font-size:11px;font-weight:700;letter-spacing:.05em;cursor:pointer;text-transform:uppercase;}
.sidebar-footer button:hover{background:var(--chrome-hover);color:var(--on);}
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;background:var(--bg);}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;background:var(--card);border-bottom:1px solid var(--border);flex-shrink:0;gap:8px;}
.topbar .label{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;}
.topbar .title{font-size:15px;font-weight:900;letter-spacing:.03em;color:var(--navy);text-transform:uppercase;}
.topbar-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.content{flex:1;overflow-y:auto;padding:12px;}
.btn{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:var(--radius);font-size:11px;font-weight:700;letter-spacing:.04em;cursor:pointer;border:none;text-transform:uppercase;line-height:1.2;}
.btn-primary{background:var(--navy3);color:var(--on);}
.btn-primary:hover{background:var(--navy);}
.btn-outline{background:transparent;color:var(--navy3);border:1.5px solid var(--navy3);}
.btn-outline:hover{background:rgba(109,83,64,.06);}
.btn-danger{background:var(--red);color:#fff;}
.btn-ghost{background:transparent;color:var(--muted);}
.btn-ghost:hover{background:var(--bg2);color:var(--text);}
.btn-sm{padding:3px 8px;font-size:10px;}
.btn-icon{padding:2px 4px;border-radius:3px;background:transparent;border:none;cursor:pointer;color:var(--muted);font-size:13px;}
.btn-icon:hover{background:var(--bg2);color:var(--text);}
.btn:disabled{opacity:.55;cursor:wait;}
.filter-bar{display:flex;gap:6px;align-items:center;margin-bottom:8px;flex-wrap:wrap;}
.filter-bar select,.filter-bar input{padding:5px 8px;border:1.5px solid var(--border);border-radius:var(--radius);font-size:12px;font-weight:700;background:var(--card);color:var(--text);letter-spacing:.03em;text-transform:uppercase;}
.filter-bar select:focus,.filter-bar input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(166,133,74,.18);}
.card{background:var(--card);border-radius:var(--radius2);border:1px solid var(--border);overflow:hidden;margin-bottom:8px;}
.card-header{padding:6px 10px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;}
.card-header h3{font-size:12px;font-weight:900;letter-spacing:.05em;color:var(--navy);text-transform:uppercase;}
.color-dot{width:12px;height:12px;border-radius:3px;flex-shrink:0;}
.band{display:grid;grid-template-columns:repeat(4,1fr);background:var(--navy);color:var(--on);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;}
.band>div{padding:8px 10px;text-align:center;}
.band>div .val{font-size:15px;font-weight:900;margin-top:2px;color:var(--on);}
.band>div .val.red{color:var(--band-red);}
.band>div .val.green{color:var(--band-green);}
.band>div .val.amber{color:var(--band-amber);}
.tbl{width:100%;border-collapse:collapse;font-size:12px;}
.tbl th{background:var(--navy);color:var(--on);padding:5px 7px;font-weight:700;letter-spacing:.05em;text-align:center;border:1px solid var(--navy2);white-space:nowrap;font-size:11px;text-transform:uppercase;}
.tbl td{padding:4px 6px;border:1px solid var(--border);vertical-align:middle;line-height:1.35;}
.tbl tr:nth-child(even) td{background:var(--stripe);}
.tbl tr:hover td{background:var(--hover);}
.tbl .row-cong td{background:var(--cong-bg)!important;color:var(--cong-fg);}
.tbl .row-lon td{background:var(--lon-bg)!important;color:var(--lon-fg);}
.tbl .row-latvat td{background:var(--latvat-bg)!important;color:var(--latvat-fg);}
.tbl .row-tt td{background:var(--tt-bg)!important;color:var(--tt-fg);font-style:italic;font-weight:700;}
.tbl .row-chuyen-tx td{background:var(--chuyen)!important;color:var(--red);font-style:italic;font-weight:700;}
.tbl .row-band td{background:var(--navy);color:var(--on);font-weight:900;}
.tbl .row-total td{background:var(--navy2);color:var(--total-fg);font-weight:900;}
.tbl tr.row-phieu{cursor:pointer;}
.tabs{display:flex;gap:0;border-bottom:2px solid var(--border);margin-bottom:10px;}
.tab{padding:6px 12px;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--muted);cursor:pointer;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;background:none;text-transform:uppercase;}
.tab.active{color:var(--navy);border-bottom-color:var(--gold);}
.modal-overlay{position:fixed;inset:0;background:var(--overlay);z-index:200;display:none;align-items:center;justify-content:center;}
.modal-overlay.show{display:flex;}
.modal{background:var(--card);border-radius:var(--radius2);width:92%;max-width:760px;max-height:86vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 18px 50px rgba(61,43,31,.28);border:1px solid var(--border);}
.modal.wide{max-width:980px;}
.modal-header{background:var(--navy);color:var(--on);padding:10px 14px;display:flex;align-items:center;justify-content:space-between;}
.modal-header h3{font-size:14px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;}
.modal-header .close{background:none;border:none;color:rgba(255,253,248,.7);font-size:20px;cursor:pointer;}
.modal-body{padding:12px;overflow-y:auto;flex:1;}
.modal-footer{padding:8px 12px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px;}
.form-group{margin-bottom:10px;}
.form-group label{display:block;font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--muted);margin-bottom:3px;text-transform:uppercase;}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:7px 8px;border:1.5px solid var(--border);border-radius:var(--radius);font-size:12px;font-weight:500;background:var(--paper);color:var(--text);text-transform:uppercase;}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(166,133,74,.16);}
.form-row{display:flex;gap:8px;}
.form-row>*{flex:1;}
.line-items{border:1.5px solid var(--border);border-radius:var(--radius);overflow:auto;}
.line-items-header,.line-item-row{display:grid;grid-template-columns:1.6fr 46px 58px 90px 100px 1fr 28px;gap:5px;padding:4px 6px;align-items:center;}
.line-items-header{background:var(--bg);font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.03em;text-transform:uppercase;}
.line-item-row{border-top:1px solid var(--border);}
.line-item-row input{padding:4px 6px;border:1px solid var(--border);border-radius:3px;font-size:11px;width:100%;text-transform:uppercase;}
.line-item-row .rm{background:none;border:none;color:var(--red);cursor:pointer;font-size:16px;}
.line-items-footer{padding:6px 8px;background:var(--bg);display:flex;justify-content:space-between;align-items:center;border-top:2px solid var(--gold);}
.line-items-footer .total-val{font-size:14px;font-weight:900;color:var(--navy);}
.add-line-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:6px;background:var(--bg);border:1px dashed var(--border2);border-radius:var(--radius);font-size:11px;font-weight:700;color:var(--navy3);cursor:pointer;width:100%;margin-top:4px;text-transform:uppercase;}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;}
.settings-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:10px;}
.settings-card h4{font-size:12px;font-weight:900;color:var(--navy);margin-bottom:6px;letter-spacing:.05em;text-transform:uppercase;}
.settings-card .item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid var(--border);font-size:12px;}
.settings-card .item:last-child{border-bottom:none;}
.toast-container{position:fixed;top:16px;right:16px;z-index:300;display:flex;flex-direction:column;gap:8px;}
.toast{padding:8px 14px;border-radius:var(--radius);font-size:12px;font-weight:700;letter-spacing:.03em;box-shadow:0 4px 16px rgba(61,43,31,.16);text-transform:uppercase;}
.toast-success{background:var(--ok);color:var(--on);}
.toast-error{background:var(--red);color:#fff;}
.print-overlay{position:fixed;inset:0;background:var(--overlay);z-index:250;display:none;align-items:center;justify-content:center;}
.print-overlay.show{display:flex;}
.print-box{background:var(--card);border-radius:var(--radius2);width:98vw;height:96vh;display:flex;flex-direction:column;}
.print-header{background:var(--navy);color:var(--on);padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0;}
.print-actions{display:flex;gap:8px;flex-wrap:wrap;}
.print-body{flex:1;overflow:auto;background:var(--desk);}
.print-body iframe{width:100%;height:100%;border:none;background:var(--desk);}
.badge{display:inline-block;padding:1px 5px;border-radius:3px;font-size:10px;font-weight:700;letter-spacing:.04em;}
.badge-cong{background:var(--cong-bg);color:var(--cong-fg);}
.badge-lon{background:var(--lon-bg);color:var(--lon-fg);}
.badge-latvat{background:var(--latvat-bg);color:var(--latvat-fg);}
.empty-state{text-align:center;padding:22px 8px;color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;}
.login-wrap,.home-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:
  radial-gradient(1200px 500px at 10% -10%, var(--glow), transparent 50%),
  linear-gradient(180deg,var(--home1),var(--home2));}
.login-card,.home-card{width:min(1080px,100%);}
.login-card{width:min(420px,100%);background:var(--card);border:1px solid var(--border);border-radius:16px;padding:28px 26px 22px;box-shadow:0 16px 40px rgba(74,55,40,.08);}
.brand-kicker{font-size:11px;letter-spacing:.18em;font-weight:700;color:var(--gold);text-transform:uppercase;}
.brand-title{font-size:22px;font-weight:900;color:var(--navy);letter-spacing:.04em;margin:6px 0 4px;text-transform:uppercase;}
.brand-sub{color:var(--muted);font-size:13px;margin-bottom:18px;}
.home-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:18px;}
.mod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;}
.mod{text-align:left;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;cursor:pointer;min-height:132px;display:flex;flex-direction:column;gap:6px;}
.mod:hover{border-color:var(--gold);box-shadow:0 8px 20px rgba(74,55,40,.06);}
.mod.soon{cursor:default;opacity:.72;}
.mod.soon:hover{border-color:var(--border);box-shadow:none;}
.mod .k{font-size:10px;letter-spacing:.14em;font-weight:700;color:var(--gold);text-transform:uppercase;}
.mod h3{font-size:16px;font-weight:900;color:var(--navy);text-transform:uppercase;}
.mod p{color:var(--muted);font-size:12px;line-height:1.4;}
.pill{display:inline-block;margin-top:auto;font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--navy3);text-transform:uppercase;}
.pill.soon{color:var(--muted);}
.ocr-box{background:var(--paper);border:1.5px dashed var(--border2);border-radius:8px;padding:10px;margin-bottom:10px;}
.ocr-hint{font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;margin-bottom:8px;}
.ocr-box.over{border-color:var(--navy);background:var(--bg2);box-shadow:inset 0 0 0 1px var(--navy);}
.ocr-box.busy{opacity:.7;pointer-events:none;}
.ocr-note{font-size:12px;color:var(--navy3);margin-top:6px;text-transform:uppercase;}
.ham{display:none;font-size:20px;}
@media(max-width:1024px){
  .sidebar{position:fixed;left:0;top:0;bottom:0;z-index:120;transform:translateX(-105%);}
  .sidebar.open{transform:translateX(0);}
  .ham{display:inline-flex;}
  .settings-grid,.band{grid-template-columns:1fr 1fr;}
}
@media(max-width:640px){
  .form-row,.settings-grid,.band{display:block;}
  .band>div{border-bottom:1px solid rgba(255,248,235,.08);}
}

.theme-row{display:flex;gap:8px;flex-wrap:wrap;}
.theme-opt{flex:1;min-width:140px;text-align:left;background:var(--paper);border:1.5px solid var(--border);border-radius:10px;padding:8px 10px;cursor:pointer;color:var(--text);font-size:11px;font-weight:800;letter-spacing:.04em;}
.theme-opt.on{border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy);}
.theme-opt .sw{display:block;height:28px;border-radius:6px;margin-bottom:6px;border:1px solid var(--border);}
.sw-mono{background:linear-gradient(90deg,#111 0 34%,#fff 34% 67%,#cfcfcf 67%);}
.sw-navy{background:linear-gradient(90deg,#071833 0 50%,#fff 50%);}
.sw-beige{background:linear-gradient(90deg,#3a2a1c 0 50%,#e4d3b8 50%);}