:root{
  --ground:#0E1418; --paper:#F1EFEA; --surface:#FFFFFF; --ink:#15191C; --dim:#5B6662;
  --line:rgba(21,25,28,.14); --line-soft:rgba(21,25,28,.07);
  --accent:#9A6E34; --accent-soft:rgba(154,110,52,.10);
  --ok:#2F7D52; --ok-bg:rgba(47,125,82,.12);
  --stop:#B23A3A; --stop-bg:rgba(178,58,58,.12);
  --neutral-bg:rgba(21,25,28,.07);
  --sans:"Helvetica Neue","Segoe UI",Roboto,Arial,system-ui,sans-serif;
  --mono:ui-monospace,"SF Mono","Cascadia Code",Consolas,monospace;
}
@media (prefers-color-scheme:dark){
  :root{
    --paper:#0B1013; --surface:#141C21; --ink:#ECE7DE; --dim:#96A09D;
    --line:rgba(236,231,222,.15); --line-soft:rgba(236,231,222,.07);
    --accent:#CBA25C; --accent-soft:rgba(203,162,92,.12);
    --ok:#66C08A; --ok-bg:rgba(102,192,138,.13);
    --stop:#E27070; --stop-bg:rgba(226,112,112,.13);
    --neutral-bg:rgba(236,231,222,.09);
  }
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.55;
  -webkit-font-smoothing:antialiased}
h1,h2,h3{margin:0;text-wrap:balance}
p{margin:0}
a{color:var(--accent)}
.muted{color:var(--dim)}
.small{font-size:.82rem}
.strong{font-weight:650}
.num{text-align:right;font-variant-numeric:tabular-nums}
.cur{color:var(--dim);font-size:.8em}
.yes{color:var(--ok);font-weight:700}
.no{color:var(--dim)}

/* top bar */
.topbar{background:var(--ground);color:#F2EFE8;position:sticky;top:0;z-index:30}
.tb-inner{max-width:1240px;margin-inline:auto;padding:0 clamp(14px,3vw,24px);
  display:flex;align-items:center;gap:22px;height:56px}
.tb-brand{font-weight:800;letter-spacing:.2em;font-size:.8rem;color:#F2EFE8;text-decoration:none;white-space:nowrap}
.tb-brand span{color:#CBA25C;margin-left:.4em}
.tb-nav{display:flex;gap:18px;flex:1;overflow-x:auto}
.tb-nav a{color:#9AA3A1;text-decoration:none;font-size:.84rem;font-weight:500;white-space:nowrap;
  padding:3px 0;border-bottom:2px solid transparent}
.tb-nav a.on{color:#F2EFE8;border-bottom-color:#CBA25C}
.tb-who{font-size:.78rem;color:#C9D0CD;white-space:nowrap}
.tb-who em{font-style:normal;color:#CBA25C;font-weight:700;margin-left:5px}
.tb-out{color:#9AA3A1;font-size:.8rem;text-decoration:none;white-space:nowrap}

.flash{background:var(--ok-bg);color:var(--ok);padding:10px clamp(14px,3vw,24px);font-size:.86rem;font-weight:600;
  border-bottom:1px solid var(--line)}
.app{max-width:1240px;margin-inline:auto;padding:clamp(16px,3vw,24px)}

.pagehead{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.pagehead h1{font-size:1.4rem;font-weight:650;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.headacts{display:flex;gap:8px;flex-wrap:wrap}

/* buttons */
.btn{display:inline-block;font:inherit;font-size:.85rem;font-weight:650;padding:8px 16px;border:1px solid var(--line);
  border-radius:2px;background:var(--surface);color:var(--ink);cursor:pointer;text-decoration:none;white-space:nowrap}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.ghost{background:transparent}
.btn.small{padding:5px 11px;font-size:.78rem}
button{font:inherit}

/* KPIs */
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);margin-bottom:18px}
.kpi{background:var(--surface);padding:16px 18px}
.kpi .n{font-size:1.6rem;font-weight:700;font-variant-numeric:tabular-nums}
.kpi .l{font-size:.65rem;letter-spacing:.13em;text-transform:uppercase;color:var(--dim);margin-top:3px}

/* search */
.searchbar{display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap}
.searchbar input[type=text]{flex:1;min-width:220px}
.searchbar input,.searchbar select,.searchbar button{padding:9px 12px;font:inherit;font-size:.87rem;
  border:1px solid var(--line);border-radius:2px;background:var(--surface);color:var(--ink)}
.searchbar button{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:650;cursor:pointer}
.searchbar .btn{padding:9px 14px}
.wrapfields input[type=date]{min-width:150px}

/* panels */
.panel{background:var(--surface);border:1px solid var(--line);margin-bottom:20px}
.panel-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:14px 18px;border-bottom:1px solid var(--line)}
.panel-head h2{font-size:.98rem;font-weight:650}
.panel-body{padding:18px}

/* forms */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:18px}
.grid.pad{padding:18px}
.grid label{display:block;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);font-weight:700}
.grid label.wide{grid-column:1 / -1}
.grid input,.grid select,.grid textarea{width:100%;margin-top:6px;padding:9px 11px;font:inherit;font-size:.9rem;
  background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:2px;
  text-transform:none;letter-spacing:normal;font-weight:400}
.grid textarea{resize:vertical}
.formacts{display:flex;gap:10px;padding:0 18px 18px;flex-wrap:wrap}
.formacts.wide{grid-column:1 / -1;padding:0}
.jobform .panel{margin-bottom:16px}

/* tables */
.tablewrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:700px;font-size:.87rem}
thead th{text-align:left;font-size:.63rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);
  font-weight:700;padding:11px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
thead th.num{text-align:right}
tbody td{padding:11px 14px;border-bottom:1px solid var(--line-soft);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
td .sub{font-size:.76rem;color:var(--dim);margin-top:2px}
td.empty{text-align:center;color:var(--dim);padding:30px}
.pill{display:inline-block;font-size:.71rem;font-weight:700;padding:.28em .7em;border-radius:2px;
  background:var(--neutral-bg);color:var(--dim);white-space:nowrap}
.dtype{font-size:.7rem;font-weight:700;background:var(--accent-soft);color:var(--accent);
  padding:.3em .6em;border-radius:2px;white-space:nowrap}

/* charge table */
table.charges input,table.charges select{width:100%;padding:7px 9px;font:inherit;font-size:.85rem;
  background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:2px}
table.charges input.num{text-align:right}
table.charges tfoot td{padding:12px 14px;border-top:2px solid var(--ink);font-weight:700}
table.charges td.catcell{font-weight:650;font-size:.85rem;white-space:nowrap;background:var(--neutral-bg)}
table.charges td.catcell .sub{font-weight:400}
table.charges tr.vatrow td{background:rgba(154,110,52,.06)}
table.charges tr.vatrow td.catcell{background:rgba(154,110,52,.12)}
input.readonly{background:var(--neutral-bg) !important;font-weight:700}
.linkbtn{background:none;border:0;padding:4px 0 0;color:var(--accent);font-size:.72rem;font-weight:600;
  cursor:pointer;text-decoration:underline;text-transform:none;letter-spacing:normal}
.splitbox{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border-top:1px solid var(--line)}
.splitbox>div{background:var(--surface);padding:14px 18px;display:flex;flex-direction:column;gap:3px}
.splitbox .l{font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-weight:700}
.splitbox .v{font-size:1.1rem;font-weight:700;font-variant-numeric:tabular-nums}
.splitbox .tot{background:var(--accent-soft)}

/* upload */
.uploadbar{display:flex;gap:8px;padding:16px 18px;flex-wrap:wrap;border-bottom:1px solid var(--line);
  background:var(--neutral-bg)}
.uploadbar select,.uploadbar input[type=text]{padding:8px 11px;font:inherit;font-size:.86rem;
  border:1px solid var(--line);border-radius:2px;background:var(--surface);color:var(--ink)}
.uploadbar input[type=text]{flex:1;min-width:160px}
.uploadbar input[type=file]{font-size:.84rem;color:var(--dim);align-self:center}

.appfoot{max-width:1240px;margin-inline:auto;padding:18px clamp(14px,3vw,24px);display:flex;
  justify-content:space-between;gap:14px;flex-wrap:wrap;color:var(--dim);font-size:.8rem}

/* login */
.loginpage{background:var(--ground)}
.gate{min-height:100svh;display:grid;place-items:center;padding:28px}
.gatecard{width:min(400px,100%);background:#fff;border-radius:3px;padding:32px 28px;text-align:center;
  box-shadow:0 26px 70px -30px rgba(0,0,0,.7)}
.gatecard img{width:160px;height:auto;margin-bottom:20px}
.gatecard h1{font-size:1.05rem;font-weight:650;color:#15191C;margin-bottom:6px}
.gatecard p{font-size:.86rem;color:#5B6662}
.gatecard form{margin-top:20px;display:flex;flex-direction:column;gap:10px}
.gatecard input{width:100%;padding:11px 13px;font:inherit;font-size:.93rem;text-align:center;
  background:#F6F4EF;color:#15191C;border:1px solid rgba(21,25,28,.14);border-radius:2px}
.gatecard button{padding:10px 20px;border:0;border-radius:2px;background:#9A6E34;color:#fff;
  font-weight:650;font-size:.9rem;cursor:pointer}
.gatecard .err{color:#B23A3A;font-size:.85rem}
.gatecard footer{margin-top:18px;font-size:.72rem;color:#8A938F}

/* printable assessment */
.printdoc{background:var(--paper)}
.sheet{max-width:900px;margin-inline:auto;background:var(--surface);border:1px solid var(--line);
  padding:clamp(22px,4vw,42px);margin-block:26px;position:relative}
.printbtn{position:fixed;top:18px;right:18px}
.dochead{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;
  padding-bottom:18px;border-bottom:2px solid var(--ink)}
.dochead .brand{font-weight:800;letter-spacing:.2em;font-size:.95rem}
.dochead .brand span{color:var(--accent);margin-left:.4em}
.dochead h1{font-size:1.3rem;font-weight:650}
.dochead .right{text-align:right}
.docmeta{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:18px 0;border-bottom:1px solid var(--line-soft)}
.docmeta .k{display:block;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-weight:700}
.docmeta .v{font-size:.9rem;font-weight:500}
.cargo{padding:14px 0;font-size:.9rem;border-bottom:1px solid var(--line-soft)}
.doctable{margin-top:18px;min-width:0}
.doctable tr.grp td{background:var(--neutral-bg);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;
  font-weight:700;color:var(--dim);padding:9px 14px}
.doctable tr.sub-total td{font-weight:650;border-top:1px solid var(--line)}
.doctable tr.grand td{font-weight:800;font-size:1rem;border-top:2px solid var(--ink);background:var(--neutral-bg)}
.docfoot{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:26px;padding-top:14px;
  border-top:1px solid var(--line-soft);color:var(--dim);font-size:.78rem}

@media (max-width:1000px){ .grid{grid-template-columns:repeat(2,1fr)} .docmeta{grid-template-columns:repeat(2,1fr)} }
@media (max-width:660px){ .grid{grid-template-columns:1fr} .kpis{grid-template-columns:1fr}
  .splitbox{grid-template-columns:1fr} .tb-nav{gap:12px} }

@media print{
  :root{--paper:#fff;--surface:#fff;--ink:#15191C;--dim:#4A5450;--line:rgba(21,25,28,.25);
    --line-soft:rgba(21,25,28,.12);--accent:#8A6230;--neutral-bg:rgba(21,25,28,.06)}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .no-print,.printbtn,.topbar,.appfoot,.uploadbar,.formacts{display:none !important}
  .sheet{border:0;margin:0;padding:0;max-width:none}
  tbody tr,.panel{page-break-inside:avoid;break-inside:avoid}
  @page{margin:14mm}
}

.resulttable{margin-top:22px;max-width:520px;margin-left:auto}
.resulttable td{padding:9px 14px}
.doctable tr.grand td{font-weight:800}

.vathelp{display:flex;gap:12px;margin-top:2px}
.vatnote{display:block;font-size:.68rem;color:var(--dim);font-weight:400;text-transform:none;
  letter-spacing:normal;margin-top:3px}
