/* ============================================================
   ARLENS — dense ERP interface.
   Light chrome (white header + white menu), black ink, no radii.
   ============================================================ */
:root{
  --ink:#111111; --paper:#ffffff;
  --g0:#fcfcfc; --g1:#f7f7f8; --g2:#f0f0f1; --g3:#e4e4e6; --g4:#d2d2d5; --g5:#9a9aa0; --g6:#6a6a70; --g7:#3a3a3e;
  --hdr:#1a1a1a;
  --ok:#1b8a2a; --warn:#c77d00; --bad:#c62828;
  --focus:#111111;
  --nav:236px;
}
*{box-sizing:border-box;margin:0;padding:0;border-radius:0}
html,body{height:100%}
body{font-family:'IBM Plex Sans',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;font-size:12px;color:var(--ink);
  background:var(--g1);-webkit-font-smoothing:antialiased}
.mono,td.n,th.n,.kpi-val,.num{font-family:'JetBrains Mono',Consolas,Menlo,monospace;font-variant-numeric:tabular-nums}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font-family:inherit;font-size:12px;color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.muted{color:var(--g6)} .tiny{font-size:10.5px} .neg{color:var(--bad)}
.up{color:var(--ok)} .dn{color:var(--bad)} .wn{color:var(--warn)}
.hr{height:1px;background:var(--g3);margin:12px 0}
.right{text-align:right} .nowrap{white-space:nowrap}

/* ------------------------------------------------------------ shell */
#app{display:flex;flex-direction:column;height:100%}
.topbar{flex:0 0 54px;height:54px;background:#fff;border-bottom:1px solid var(--g3);display:flex;align-items:stretch;z-index:60;position:relative;overflow:visible}
.topbar .logo{display:flex;align-items:center;gap:9px;flex:0 0 var(--nav);width:var(--nav);
  padding:0 16px;font-weight:600;letter-spacing:5px;font-size:15px;
  border-right:1px solid var(--g3);color:#000;box-sizing:border-box}
.topbar .logo em{font-style:normal;font-size:8.5px;letter-spacing:1.4px;color:var(--g5);font-weight:600;white-space:nowrap}
.tb-ctx{display:flex;align-items:stretch;flex:1;min-width:0;overflow:visible}
.tb-sel{display:flex;flex-direction:column;justify-content:center;gap:2px;padding:0 16px;border-right:1px solid var(--g3);min-width:0}
.tb-sel label{font-size:8.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--g5);font-weight:600}
.tb-sel.static b{font-size:12px;font-weight:600}
.tb-right{display:flex;align-items:stretch;margin-left:auto}
.tb-btn{display:flex;align-items:center;gap:7px;padding:0 14px;border-left:1px solid var(--g3);cursor:pointer;
  background:none;border-top:0;border-bottom:0;border-right:0;font-weight:500;color:var(--g7)}
.tb-btn:hover{background:var(--g1);color:#000}
.tb-btn .badge{background:var(--bad);color:#fff;font-size:9px;padding:1px 5px;font-weight:600;font-family:'JetBrains Mono',monospace}
.tb-btn.user{gap:9px}
.avatar{width:28px;height:28px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:10.5px;font-weight:600;letter-spacing:.5px;flex:0 0 28px}
.who{display:flex;flex-direction:column;line-height:1.25;text-align:left}
.who b{font-size:11.5px;font-weight:600;color:#000}
.who i{font-style:normal;font-size:9.5px;color:var(--g6)}
.tb-user{position:relative;display:flex}
.menu-pop{position:absolute;right:0;top:54px;background:#fff;border:1px solid var(--g3);min-width:210px;
  box-shadow:0 6px 20px rgba(0,0,0,.09);display:none;z-index:70}
.tb-user.open .menu-pop{display:block}
.menu-pop a{display:block;padding:8px 13px;font-size:12px}
.menu-pop a:hover{background:var(--g1)}
.mp-sep{height:1px;background:var(--g3)}

.body{display:flex;flex:1;min-height:0}
.sidebar{flex:0 0 var(--nav);width:var(--nav);box-sizing:border-box;background:#fff;border-right:1px solid var(--g3);overflow-y:auto;display:flex;flex-direction:column}
.sidebar::-webkit-scrollbar{width:8px}.sidebar::-webkit-scrollbar-thumb{background:var(--g4)}
.nav-grp{padding:13px 15px 5px;font-size:8.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--g5);font-weight:700}
.nav-i{display:flex;align-items:center;padding:6px 15px;font-size:12px;color:var(--g7);border-left:3px solid transparent;cursor:pointer}
.nav-i:hover{background:var(--g1);color:#000}
.nav-i.on{background:var(--g2);color:#000;font-weight:600;border-left-color:#000}
.nav-i .cnt{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--g5)}
.nav-i.on .cnt{color:var(--g7)}
.nav-foot{margin-top:auto;padding:14px 15px 18px}
.rolecard{border:1px solid var(--g3);padding:9px 10px;background:var(--g0)}
.rolecard .rk{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase}
.rolecard p{font-size:10px;color:var(--g6);margin:4px 0 6px;line-height:1.45}
.main{flex:1;overflow-y:auto;min-width:0;background:var(--g1)}

.page-hd{background:#fff;border-bottom:1px solid var(--g3);padding:13px 20px;display:flex;align-items:flex-start;gap:16px;
  position:sticky;top:0;z-index:40}
.page-hd h1{font-size:17px;font-weight:600;letter-spacing:-.25px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.page-hd h1 .hd-sub{font-size:11px;font-weight:400;color:var(--g6);letter-spacing:0}
.page-hd .crumb{font-size:9.5px;text-transform:uppercase;letter-spacing:1.2px;color:var(--g6);margin-bottom:3px;font-weight:600}
.page-hd .acts{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.wrap{padding:15px 20px 48px}

/* ----------------------------------------------------------- atoms */
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--ink);color:#fff;border:1px solid var(--ink);
  padding:6px 13px;cursor:pointer;font-weight:500;line-height:16px;white-space:nowrap;height:30px}
.btn:hover{background:#333;border-color:#333}
.btn.sec{background:#fff;color:var(--ink);border-color:var(--g4)}
.btn.sec:hover{background:var(--g1);border-color:var(--ink)}
.btn.dgr{background:var(--bad);border-color:var(--bad);color:#fff}
.btn.dgr:hover{background:#a71d1d;border-color:#a71d1d}
.btn.sm{height:24px;padding:2px 9px;font-size:11px}
.btn[disabled]{opacity:.42;cursor:not-allowed}
.btn.xls::before{content:'';width:11px;height:11px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1v8m0 0L5 6m3 3 3-3M2 12v2h12v-2'  stroke='%23000' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1v8m0 0L5 6m3 3 3-3M2 12v2h12v-2' stroke='%23000' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") center/contain no-repeat}
.lnk{border-bottom:1px solid var(--g4);cursor:pointer}
.lnk:hover{border-bottom-color:#000}
.pill{display:inline-block;padding:1px 6px;border:1px solid var(--g4);font-size:10px;font-weight:500;white-space:nowrap;background:#fff}
.pill.ok{color:var(--ok);border-color:#9ed3a6} .pill.wn{color:var(--warn);border-color:#e6c489}
.pill.bad{color:var(--bad);border-color:#e2a1a1} .pill.ink{background:var(--ink);color:#fff;border-color:var(--ink)}
.dot{display:inline-block;width:7px;height:7px;margin-right:6px;vertical-align:middle;background:var(--g5)}
.dot.ok{background:var(--ok)}.dot.wn{background:var(--warn)}.dot.bad{background:var(--bad)}

.card{background:#fff;border:1px solid var(--g3);margin-bottom:14px}
.card>h3{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:1.1px;padding:10px 13px;
  border-bottom:1px solid var(--g3);background:var(--g0);display:flex;align-items:center;gap:10px}
.card>h3 .r{margin-left:auto;font-weight:400;text-transform:none;letter-spacing:0;color:var(--g6);font-size:11px}
.card .pad{padding:13px}
.kpis{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:1px;background:var(--g3);
  border:1px solid var(--g3);margin-bottom:14px}
@media(max-width:1500px){.kpis{grid-template-columns:repeat(min(var(--n,4),4),minmax(0,1fr))}}
@media(max-width:1080px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.kpis{grid-template-columns:1fr}}
.kpi{background:#fff;padding:11px 13px;min-width:0;overflow:hidden}
/* a lone tile on the final row stretches to fill it rather than sitting orphaned */
.kpis .kpi:last-child{grid-column-end:-1}
.kpi .lbl{font-size:9px;text-transform:uppercase;letter-spacing:1.1px;color:var(--g6);font-weight:700;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi .kpi-val{font-size:21px;font-weight:500;margin:5px 0 3px;letter-spacing:-.6px;
  white-space:nowrap;overflow:hidden;text-overflow:clip;line-height:1.15}
.kpi .kpi-val.md{font-size:17px;letter-spacing:-.4px}
.kpi .kpi-val.sm{font-size:14.5px;letter-spacing:-.2px}
.kpi .kpi-val.xs{font-size:12.5px;letter-spacing:0}
.kpi .sub{font-size:10.5px;color:var(--g6);line-height:1.45;overflow-wrap:anywhere}
.split{display:grid;gap:14px}
.s-2{grid-template-columns:1fr 1fr} .s-3{grid-template-columns:1fr 1fr 1fr}
.s-64{grid-template-columns:1.55fr 1fr} .s-46{grid-template-columns:1fr 1.55fr}
@media(max-width:1240px){.s-2,.s-3,.s-64,.s-46{grid-template-columns:1fr}}

/* ---------------------------------------------------------- tables
   ARLENS-CSS-BUILD 2026.08.20-6

   Columns size to their content; the wrapper scrolls horizontally when the
   total exceeds the viewport. Nothing wraps. Breaking "12-Aug-2026 – 18-Aug-2026"
   across five lines to avoid a scrollbar makes every row five times taller and
   the whole grid unreadable — a horizontal scrollbar is the cheaper trade.

   Long free text (an audit detail, a bank narration) is capped and ellipsised
   rather than wrapped, so one verbose row cannot dictate the height of the
   table. The full value is in the title attribute and in the export. */
table{width:100%;border-collapse:collapse;font-size:11.5px;table-layout:auto}
thead th{background:var(--hdr);color:#fff;text-align:left;padding:8px 9px;font-weight:500;font-size:9.5px;
  text-transform:uppercase;letter-spacing:.7px;white-space:nowrap;position:sticky;top:0;z-index:2}
thead th.n{text-align:right}
thead th a.thsort{color:#fff;border-bottom:1px dotted #777}
thead th a.thsort:hover{border-bottom-color:#fff}
tbody td{padding:6px 9px;border-bottom:1px solid var(--g3);vertical-align:top;
  white-space:nowrap;word-break:keep-all;overflow-wrap:normal}
/* a column that asked to wrap now truncates instead — same intent, fixed height */
tbody td.wrap,thead th.wrap{white-space:nowrap;max-width:520px;overflow:hidden;text-overflow:ellipsis}
/* secondary lines inside a cell are their own block, and equally do not wrap */
tbody td .tiny,tbody td .muted{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
tbody td>div,tbody td>span.tiny{display:block}
tbody tr:nth-child(even){background:var(--g0)}
tbody tr:hover{background:#ececee}
tbody td.n{text-align:right}
tbody tr.tot{background:var(--g2)!important;font-weight:600}
tbody tr.tot td{border-top:2px solid var(--ink);border-bottom:0}
tbody tr.grp{background:var(--g2)!important;font-weight:600}
tbody td.empty{padding:26px;text-align:center;color:var(--g6);background:#fff}
.tbl-wrap{overflow-x:auto;overflow-y:visible} .tbl-scroll{overflow:auto;max-height:520px}
/* a hint that there is more to the right, rather than a silently clipped table */
.tbl-wrap,.tbl-scroll{scrollbar-width:thin}

/* --------------------------------------------------- forms & selects */
.filters{background:#fff;border:1px solid var(--g3);padding:9px 11px;display:flex;gap:9px;align-items:flex-end;
  flex-wrap:wrap;margin-bottom:13px}
.f{display:flex;flex-direction:column;gap:3px}
.f label{font-size:8.5px;text-transform:uppercase;letter-spacing:1.1px;color:var(--g6);font-weight:700}
.fbtns{display:flex;gap:6px}
.in,textarea.in{border:1px solid var(--g4);background:#fff;height:30px;padding:0 9px;min-width:150px}
textarea.in{height:auto;min-height:70px;padding:7px 9px;line-height:1.5;width:100%}
.in:hover{border-color:var(--g5)} .in:focus{border-color:var(--ink);outline:none;box-shadow:inset 0 0 0 1px var(--ink)}
.f.sm .in,.f.sm .sel{min-width:104px} .f.wide .in,.f.wide .sel{min-width:250px}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));gap:11px 15px}
.chk{display:flex;align-items:center;gap:7px;cursor:pointer;padding:3px 0;font-size:11.5px}
.chk input{width:13px;height:13px;accent-color:#000}

/* custom dropdown */
.sel{position:relative;min-width:158px;font-size:12px}
.sel.wide{min-width:250px} .sel.sm{min-width:104px}
.sel-btn{width:100%;height:30px;background:#fff;border:1px solid var(--g4);display:flex;align-items:center;gap:8px;
  padding:0 8px 0 9px;cursor:pointer;text-align:left}
.sel-btn:hover{border-color:var(--g5)}
.sel.open .sel-btn{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.sel-lbl{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.sel-caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid var(--g6);flex:0 0 8px}
.sel.open .sel-caret{border-top-color:var(--ink)}
.sel-pop{position:absolute;top:calc(100% + 2px);left:0;min-width:100%;background:#fff;border:1px solid var(--ink);
  box-shadow:0 8px 24px rgba(0,0,0,.12);display:none;z-index:120;max-width:360px}
.sel.open .sel-pop{display:block}
.sel.up .sel-pop{top:auto;bottom:calc(100% + 2px)}
.sel-search{padding:6px;border-bottom:1px solid var(--g3);background:var(--g0)}
.sel-search input{width:100%;height:26px;border:1px solid var(--g4);padding:0 7px;background:#fff}
.sel-list{max-height:264px;overflow:auto}
.sel-opt{padding:6px 10px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sel-opt:hover,.sel-opt.hi{background:var(--g2)}
.sel-opt.on{background:var(--ink);color:#fff;font-weight:500}
.sel-none{display:none;padding:9px 10px;color:var(--g6)}
.sel-pop.empty .sel-none{display:block}
.tb-sel .sel-btn{border:0;height:22px;padding:0;background:none}
.tb-sel .sel-btn:hover .sel-lbl{border-bottom:1px solid var(--g4)}
.tb-sel .sel.open .sel-btn{box-shadow:none}
.tb-sel .sel{min-width:auto;max-width:210px}
.tb-sel .sel-pop{min-width:216px;top:calc(100% + 8px)}
.tb-sel .sel-lbl{font-size:12px;font-weight:600}

/* --------------------------------------------------------- widgets */
.note{background:var(--g0);border-left:3px solid var(--g4);padding:9px 12px;font-size:11.5px;color:var(--g7);
  margin-bottom:13px;line-height:1.55}
.note.w{border-left-color:var(--warn)} .note.b{border-left-color:var(--bad)} .note.g{border-left-color:var(--ok)}
.bar-row{display:flex;align-items:center;gap:9px;margin-bottom:5px}
.bar-row .bl{font-size:10.5px;color:var(--g7);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-row .bt{flex:1;background:var(--g2);height:14px;position:relative;min-width:40px}
.bar-row .bt i{position:absolute;left:0;top:0;bottom:0;background:var(--ink);display:block}
.bar-row .bt i.wn{background:var(--warn)}.bar-row .bt i.bad{background:var(--bad)}.bar-row .bt i.ok{background:#2f8f3c}
.bar-row .bt i em{position:absolute;left:0;top:0;bottom:0;background:var(--bad);display:block}
.bar-row.klik{cursor:pointer} .bar-row.klik:hover .bl{color:#000;text-decoration:underline}
.bar-row .bv{min-width:94px;flex:0 0 auto;text-align:right;font-family:'JetBrains Mono',monospace;
  font-size:11px;white-space:nowrap;padding-left:4px}
.chart{width:100%;display:block}
.chart .cl{font-size:9px;fill:var(--g6);font-family:'JetBrains Mono',monospace}
.chart .cv{font-size:8.5px;fill:var(--g7);font-family:'JetBrains Mono',monospace}
.chart .ax{font-size:8.5px;fill:var(--g5);font-family:'JetBrains Mono',monospace}
.chart .gl{stroke:var(--g3)} .chart .gl0{stroke:var(--g4)}
.chart .axr{font-size:8.5px;fill:var(--warn);font-family:'JetBrains Mono',monospace}
.chart .pv{font-size:8.5px;fill:var(--warn);font-family:'JetBrains Mono',monospace;font-weight:600}
.legend{display:flex;gap:15px;flex-wrap:wrap;font-size:10.5px;color:var(--g7);margin-top:7px}
.stack{display:flex;height:16px;border:1px solid var(--g3);overflow:hidden;background:#fff}
.stack i{display:block;height:100%}
dl.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;font-size:11.5px}
dl.kv dt{color:var(--g6);white-space:nowrap} dl.kv dd{font-weight:500;text-align:right}
.tabs{display:flex;border-bottom:1px solid var(--g3);background:#fff;margin-bottom:13px;overflow-x:auto}
.tabs a{padding:9px 15px;cursor:pointer;border-bottom:2px solid transparent;font-weight:500;color:var(--g6);white-space:nowrap}
.tabs a:hover{color:#000} .tabs a.on{color:#000;border-bottom-color:#000}
.steps{display:flex;border:1px solid var(--g3);background:#fff;margin-bottom:14px}
.steps div{flex:1;padding:10px 13px;border-right:1px solid var(--g3);color:var(--g6)}
.steps div:last-child{border-right:0}
.steps div b{display:block;font-size:11.5px;color:inherit}
.steps div span{font-size:9px;text-transform:uppercase;letter-spacing:1.1px}
.steps div.on{background:var(--ink);color:#fff} .steps div.done{color:var(--ok)}
.drop{border:2px dashed var(--g4);padding:32px;text-align:center;background:var(--g0);cursor:pointer;display:block}
.drop:hover,.drop.over{border-color:var(--ink);background:#fff}
.drop b{display:block;font-size:13px;margin-bottom:5px}
.drop span{color:var(--g6)}
.rpt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(308px,1fr));gap:1px;background:var(--g3);border:1px solid var(--g3)}
.rpt{background:#fff;padding:13px 15px;display:block}
.rpt:hover{background:var(--g0)}
.rpt b{display:block;font-size:12.5px;margin-bottom:3px}
.rpt .c{font-size:9px;letter-spacing:1.1px;color:var(--g6);font-weight:600;font-family:'JetBrains Mono',monospace}
.rpt p{color:var(--g6);font-size:11px;margin-top:5px;line-height:1.5}
.matrix td{text-align:center} .matrix td:first-child{text-align:left;font-weight:500}
.toast{position:fixed;right:18px;bottom:18px;background:var(--ink);color:#fff;padding:11px 15px;z-index:300;
  border-left:3px solid var(--ok);max-width:400px;box-shadow:0 8px 26px rgba(0,0,0,.2)}
.toast.err{border-left-color:var(--bad)} .toast.warn{border-left-color:var(--warn)}
.modal-bg{position:fixed;inset:0;background:rgba(17,17,17,.5);z-index:250;display:flex;align-items:flex-start;
  justify-content:center;padding:52px 20px;overflow:auto}
.modal{background:#fff;width:100%;max-width:820px;border:1px solid var(--ink);box-shadow:0 20px 60px rgba(0,0,0,.25)}
.modal h3{padding:12px 15px;border-bottom:1px solid var(--g3);font-size:13.5px;display:flex;align-items:center;font-weight:600}
.modal h3 .x{margin-left:auto;cursor:pointer;font-size:17px;line-height:1;color:var(--g6)}
.modal h3 .x:hover{color:#000}
.modal .mb{padding:15px} .modal .mf{padding:11px 15px;border-top:1px solid var(--g3);display:flex;gap:8px;justify-content:flex-end;background:var(--g0)}
.filelist{border:1px solid var(--g3)}
.filerow{display:flex;align-items:center;gap:11px;padding:8px 11px;border-bottom:1px solid var(--g3)}
.filerow:last-child{border-bottom:0}
.fico{width:30px;height:34px;border:1px solid var(--g4);display:flex;align-items:center;justify-content:center;
  font-size:8.5px;font-weight:700;color:var(--g6);flex:0 0 30px;background:var(--g0)}

/* ----------------------------------------------------------- login */
.login-pg{display:flex;min-height:100vh;background:#fff}
.lg-brand{flex:1;background:#0e0e0f;color:#fff;padding:54px 60px;display:flex;flex-direction:column;
  justify-content:space-between;position:relative;overflow:hidden;min-width:0}
.lg-brand::after{content:'';position:absolute;right:-160px;top:-160px;width:520px;height:520px;
  border:1px solid rgba(255,255,255,.06);border-radius:50%}
.lg-brand::before{content:'';position:absolute;right:-70px;bottom:-230px;width:520px;height:520px;
  border:1px solid rgba(255,255,255,.05);border-radius:50%}
.lg-top{position:relative;z-index:1}
.lg-mark{font-size:23px;letter-spacing:11px;font-weight:600;line-height:1}
.lg-sub{font-size:9px;letter-spacing:3.2px;text-transform:uppercase;color:rgba(255,255,255,.45);margin-top:12px}
.lg-lead{position:relative;z-index:1;max-width:560px}
.lg-rule{width:44px;height:2px;background:#fff;margin-bottom:22px}
.lg-lead h2{font-size:30px;line-height:1.3;font-weight:500;letter-spacing:-.6px;margin-bottom:16px}
.lg-lead p{color:rgba(255,255,255,.62);line-height:1.7;font-size:13px;max-width:50ch}
.lg-flow{display:flex;flex-wrap:wrap;gap:0;margin-top:30px;border-top:1px solid rgba(255,255,255,.12)}
.lg-flow div{padding:13px 18px 13px 0;flex:1 1 128px;border-right:1px solid rgba(255,255,255,.1);padding-left:18px}
.lg-flow div:first-child{padding-left:0}
.lg-flow div:last-child{border-right:0}
.lg-flow b{display:block;font-size:11.5px;font-weight:500;margin-bottom:3px}
.lg-flow span{font-size:10px;color:rgba(255,255,255,.42);line-height:1.4;display:block}
.lg-stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.12);padding-top:20px}
.lg-stats div{padding-right:18px}
.lg-stats b{display:block;font-family:'JetBrains Mono',monospace;font-size:23px;font-weight:400;letter-spacing:-.5px}
.lg-stats span{font-size:9px;text-transform:uppercase;letter-spacing:1.3px;color:rgba(255,255,255,.42);
  margin-top:5px;display:block;line-height:1.4}
.lg-foot{position:relative;z-index:1;font-size:10px;color:rgba(255,255,255,.3);letter-spacing:.4px}

.lg-form{width:452px;flex:0 0 452px;padding:0 56px;display:flex;flex-direction:column;justify-content:center;background:#fff}
.lg-form h1{font-size:20px;font-weight:600;letter-spacing:-.3px;margin-bottom:5px}
.lg-form .hint{color:var(--g6);margin-bottom:26px;font-size:12px;line-height:1.6}
.lg-f{margin-bottom:15px}
.lg-f label{display:flex;align-items:baseline;font-size:9px;letter-spacing:1.3px;text-transform:uppercase;
  color:var(--g6);font-weight:700;margin-bottom:6px}
.lg-f label a{margin-left:auto;text-transform:none;letter-spacing:0;font-size:10.5px;font-weight:400;
  color:var(--g6);border-bottom:1px solid var(--g4)}
.lg-f label a:hover{color:#000;border-bottom-color:#000}
.lg-f .in{width:100%;min-width:0;height:38px;border-color:var(--g4)}
.lg-btn{width:100%;height:42px;justify-content:center;font-size:13px;font-weight:500;letter-spacing:.2px;margin-top:6px}
.lg-err{border-left:3px solid var(--bad);background:#fdf4f4;padding:10px 13px;margin-bottom:16px;
  font-size:11.5px;line-height:1.55}
.lg-meta{display:flex;align-items:center;gap:10px;margin:14px 0 0;font-size:10.5px;color:var(--g6)}
.lg-meta .lock{width:11px;height:11px;border:1.5px solid var(--g5);border-top-width:5px;flex:0 0 11px;margin-top:1px}
.lg-roles{margin-top:26px;border-top:1px solid var(--g3);padding-top:16px}
.lg-roles .t{font-size:9px;letter-spacing:1.3px;text-transform:uppercase;color:var(--g6);font-weight:700;margin-bottom:10px}
.rolebtn{display:flex;gap:11px;align-items:center;width:100%;background:#fff;border:1px solid var(--g3);
  padding:9px 11px;margin-bottom:6px;cursor:pointer;text-align:left}
.rolebtn:hover{border-color:var(--ink);background:var(--g0)}
.rolebtn.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.rolebtn b{font-size:11.5px;font-weight:600;display:block}
.rolebtn i{font-style:normal;font-size:10px;color:var(--g6);display:block;margin-top:2px;line-height:1.4}
.rolebtn .rb-k{font-size:9px;font-weight:700;letter-spacing:.6px;background:var(--ink);color:#fff;
  padding:4px 6px;flex:0 0 auto;font-family:'JetBrains Mono',monospace}
.rolebtn:hover .rb-k{background:#000}
@media(max-width:1080px){.lg-brand{display:none}.lg-form{width:100%;flex:1;padding:40px 28px}}

/* ------------------------------------------------------ dd report */
.dd-doc{background:#fff;border:1px solid var(--g3)}
.dd-body{padding:22px 26px 40px;max-width:1080px}
.dd-cover{border-bottom:1px solid var(--g3);padding:26px}
.dd-cover .k{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--g6);font-weight:700}
.dd-cover h2{font-size:24px;font-weight:600;letter-spacing:-.4px;margin:6px 0 3px}
.dd-cover .sub{color:var(--g6);font-size:12px}
.dd-verdict{display:flex;gap:1px;background:var(--g3);border:1px solid var(--g3);margin-top:18px}
.dd-verdict div{background:#fff;padding:11px 14px;flex:1}
.dd-verdict .lbl{font-size:8.5px;letter-spacing:1.1px;text-transform:uppercase;color:var(--g6);font-weight:700}
.dd-verdict .val{font-size:17px;font-weight:600;margin-top:4px;letter-spacing:-.3px}
.dd-toc{display:flex;flex-wrap:wrap;gap:1px;background:var(--g3);border-top:1px solid var(--g3)}
.dd-toc a{background:#fff;padding:8px 13px;flex:1 1 190px;font-size:11px}
.dd-toc a:hover{background:var(--g1)}
.dd-body h3{font-size:15px;font-weight:600;margin:28px 0 9px;padding-bottom:6px;border-bottom:2px solid var(--ink)}
.dd-body h3:first-child{margin-top:0}
.dd-body h4{font-size:12.5px;font-weight:600;margin:16px 0 6px}
.dd-body p{margin:0 0 10px;line-height:1.62;max-width:88ch}
.dd-body ul{margin:0 0 12px 18px} .dd-body li{margin-bottom:5px;line-height:1.55}
.formula{background:var(--g0);border-left:3px solid var(--ink);padding:9px 12px;margin:0 0 11px;
  font-family:'JetBrains Mono',monospace;font-size:11px}
.scorebar{display:flex;height:22px;border:1px solid var(--g3);background:var(--g1);position:relative;margin:8px 0 4px}
.scorebar i{background:var(--ink);display:block}
.scorebar span{position:absolute;right:7px;top:3px;font-size:10.5px;font-family:'JetBrains Mono',monospace}
@media print{.topbar,.sidebar,.page-hd .acts,.dd-toc{display:none}.main{overflow:visible}.wrap{padding:0}}

/* KPI tiles that drill through to the report behind the number */
.kpi-link{display:block;text-decoration:none;color:inherit;position:relative}
.kpi-link:hover{background:var(--g0)}
.kpi-link:hover .kpi-val{text-decoration:underline;text-underline-offset:3px}
.kpi .lbl{display:flex;align-items:center;gap:6px}
.kpi-go{margin-left:auto;font-size:11px;color:var(--g4);font-weight:400}
.kpi-link:hover .kpi-go{color:var(--ink)}

/* ------------------------------------------------------------- pagination */
.pager{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:8px 11px;background:var(--g0);
  border:1px solid var(--g3);border-bottom:0;font-size:11.5px}
.tbl-wrap + .pager,.tbl-scroll + .pager{border-top:0;border-bottom:1px solid var(--g3)}
.pg-count{color:var(--g7)}
.pg-size,.pg-nav{display:flex;align-items:center;gap:2px;color:var(--g6)}
.pg-size{margin-left:auto}
.pg-size a,.pg-nav a,.pg-nav span{display:inline-block;padding:2px 7px;border:1px solid transparent;
  font-family:'JetBrains Mono',monospace;font-size:10.5px}
.pg-size a:hover,.pg-nav a:hover{border-color:var(--g4);background:#fff}
.pg-size a.on,.pg-nav a.on{background:var(--ink);color:#fff;border-color:var(--ink);font-weight:600}
.pg-nav span.off{color:var(--g4)}
.pg-nav span.gap{color:var(--g5);padding:2px 3px}
.pg-warn{color:var(--warn);font-size:10.5px}
.lg-or{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--g5);font-size:11px;
  text-transform:uppercase;letter-spacing:1.4px}
.lg-or::before,.lg-or::after{content:'';flex:1;height:1px;background:var(--g3)}