:root{
  --navy:#243569; --navy-dark:#001090; --cyan:#00b0e8; --teal:#00c0c8; --green:#9ad08a;
  --ink:#1d2233; --muted:#5a6172; --line:#d9dde5; --bg:#f4f6f9; --card:#fff;
  --ok:#1f7a3d; --ok-bg:#e6f4ea; --warn:#8a5a00; --warn-bg:#fff3d6; --bad:#a1262b; --bad-bg:#fde8e8; --grey-bg:#eceff4;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 "Noto Sans","Segoe UI",system-ui,-apple-system,Arial,sans-serif}
a{color:var(--navy)}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px}
.topbar{background:#fff;border-bottom:3px solid var(--navy)}
.topbar-inner{display:flex;align-items:center;gap:24px;min-height:68px;flex-wrap:wrap;padding-top:6px;padding-bottom:6px}
.brand img{height:44px;display:block}
.nav{display:flex;gap:4px;flex-wrap:wrap;flex:1}
.nav a{padding:8px 12px;border-radius:6px;text-decoration:none;color:var(--ink);font-weight:500}
.nav a:hover{background:var(--grey-bg)}
.nav a.active{background:var(--navy);color:#fff}
.count{background:var(--cyan);color:#fff;border-radius:10px;padding:0 7px;font-size:12px;font-weight:700}
.userbox{display:flex;align-items:center;gap:10px;margin:0}
.username{color:var(--muted);font-size:14px}
button.link{background:none;border:0;color:var(--navy);text-decoration:underline;cursor:pointer;font:inherit;padding:0}
main{padding-top:30px;padding-bottom:30px;min-height:70vh}
.foot{color:var(--muted);font-size:12px;padding-top:14px;padding-bottom:26px;border-top:1px solid var(--line)}
h1{font-size:24px;margin:0;color:var(--navy)}
h2{font-size:17px;margin:0 0 12px;color:var(--navy)}
.sub{margin:4px 0 0;color:var(--muted)}
.pagehead{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.card{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:20px;margin-bottom:18px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}
@media (max-width:820px){.grid2,.grid3{grid-template-columns:1fr}}
.stat{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:16px 18px;border-top:4px solid var(--cyan)}
.stat .n{font-size:30px;font-weight:700;color:var(--navy);line-height:1.1}
.stat .l{color:var(--muted);font-size:13px}
.btn{display:inline-block;border:1px solid var(--navy);background:var(--navy);color:#fff;padding:9px 18px;border-radius:6px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none}
.btn:hover{background:#1a2750}
.btn-ghost{background:#fff;color:var(--navy)}
.btn-ghost:hover{background:var(--grey-bg)}
.btn-green{background:var(--ok);border-color:var(--ok)}
.btn-green:hover{background:#17612f}
.btn-red{background:#fff;color:var(--bad);border-color:var(--bad)}
.btn-red:hover{background:var(--bad-bg)}
.btn-link{border:0;background:none;color:var(--navy);padding:0;text-decoration:underline;cursor:pointer;font:inherit}
.badge{display:inline-block;padding:2px 10px;border-radius:12px;font-size:12px;font-weight:600;white-space:nowrap}
.badge-green{background:var(--ok-bg);color:var(--ok)}
.badge-amber{background:var(--warn-bg);color:var(--warn)}
.badge-red{background:var(--bad-bg);color:var(--bad)}
.badge-grey{background:var(--grey-bg);color:var(--muted)}
.right{text-align:right}.center{text-align:center}
.muted{color:var(--muted)}.small{font-size:12.5px}.strong{font-weight:700}
.req{color:var(--bad)}
.flash{padding:12px 16px;border-radius:6px;margin-bottom:16px;border:1px solid}
.flash-ok{background:var(--ok-bg);border-color:#b6dcc0;color:var(--ok)}
.flash-error{background:var(--bad-bg);border-color:#f2b8b8;color:var(--bad)}
.flash ul{margin:6px 0 0;padding-left:20px}
table{border-collapse:collapse;width:100%}
th,td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
th{font-size:12.5px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);background:#f8f9fb;white-space:nowrap}
td.right,th.right{text-align:right}
tr:hover td{background:#fafbfd}
.tablewrap{overflow-x:auto}
table.grid th{background:var(--navy);color:#fff}
table.grid td{border:1px solid var(--line)}
table.grid tr:hover td{background:#fff}
table.grid tfoot td{background:#eef1f7}
table.editable input{width:100%;min-width:90px;border:0;padding:6px 8px;background:transparent;font:inherit}
table.editable input:focus{outline:2px solid var(--cyan);outline-offset:-2px;background:#fff}
td.rowtools{width:34px;text-align:center}
button.icon{border:0;background:none;color:var(--muted);font-size:20px;cursor:pointer;line-height:1}
button.icon:hover{color:var(--bad)}
.field{margin-bottom:16px}.field label{display:block;font-weight:600;margin-bottom:5px;color:var(--navy)}
input[type=text],input[type=date],input[type=month],input[type=email],select,textarea{width:100%;padding:9px 11px;border:1px solid #b9bfcc;border-radius:6px;font:inherit;background:#fff}
input:focus,textarea:focus,select:focus{outline:2px solid var(--cyan);outline-offset:0;border-color:var(--cyan)}
.formcols{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
@media (max-width:700px){.formcols{grid-template-columns:1fr}}
.field-wide{grid-column:1 / -1}
.summarybox{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-top:10px}
.summarybox div{background:#eef1f7;border-radius:6px;padding:10px 14px;display:flex;flex-direction:column}
.summarybox span{color:var(--muted);font-size:12.5px}.summarybox strong{font-size:17px;color:var(--navy)}
.datalist{display:grid;grid-template-columns:1fr 1fr;gap:14px 24px;margin:0}
.datalist dt{font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.datalist dd{margin:2px 0 0;font-weight:500}
.datawide{grid-column:1 / -1}.pre{white-space:pre-wrap}
@media (max-width:700px){.datalist{grid-template-columns:1fr}}
.meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px 20px}
.meta div span{display:block;font-size:12.5px;color:var(--muted)}.meta div strong{font-weight:600}
ol.chain{list-style:none;margin:0;padding:0;position:relative}
.step{display:flex;gap:14px;padding:10px 0}
.step .dot{flex:0 0 32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff}
.dot-green{background:var(--ok)}.dot-amber{background:#d99100}.dot-red{background:var(--bad)}.dot-grey{background:#9aa1b1}
.stepbody{flex:1;border-bottom:1px solid var(--line);padding-bottom:10px}
.steptop{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.steptop .badge{margin-left:auto}
.is-current .stepbody{background:#fffaf0;margin-left:-8px;padding:0 8px 10px;border-radius:6px}
.stepcomment{margin-top:6px;padding:8px 12px;background:#f3f5f9;border-left:3px solid var(--cyan);border-radius:0 6px 6px 0;white-space:pre-wrap}
.progress{height:8px;background:var(--grey-bg);border-radius:4px;overflow:hidden;margin-top:12px}
.bar{height:100%;background:linear-gradient(90deg,var(--cyan),var(--teal),var(--green))}
.bar-0{width:0}.bar-1{width:10%}.bar-2{width:20%}.bar-3{width:30%}.bar-4{width:40%}.bar-5{width:50%}.bar-6{width:60%}.bar-7{width:70%}.bar-8{width:80%}.bar-9{width:90%}.bar-10{width:100%}
ul.events{list-style:none;margin:0;padding:0}ul.events li{padding:8px 0;border-bottom:1px solid var(--line)}
.when{color:var(--muted);font-size:12.5px;margin-right:6px;white-space:nowrap}
.decide textarea{margin-bottom:12px}
.decide .btnrow{display:flex;gap:10px;flex-wrap:wrap}
.chainedit .row{display:grid;grid-template-columns:2fr 1.4fr 40px;gap:10px;margin-bottom:8px}
.tplcard{display:block;text-decoration:none;color:inherit}
.tplcard:hover{border-color:var(--cyan);box-shadow:0 2px 8px rgba(36,53,105,.12)}
.tplcard h2{margin-bottom:6px}
.chip{display:inline-block;background:var(--grey-bg);border-radius:12px;padding:1px 10px;font-size:12.5px;margin:2px 4px 2px 0}
.empty{text-align:center;color:var(--muted);padding:24px}
.login{max-width:420px;margin:70px auto;text-align:center}
.login img{height:64px;margin-bottom:18px}
.tablewrap table.plain td,.tablewrap table.plain th{border-bottom:1px solid var(--line)}
.pager{display:flex;gap:12px;justify-content:center;margin-top:14px}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.filters input,.filters select{width:auto;min-width:160px}
.inline{display:inline}
@media print{.topbar,.foot,.actions,.decide{display:none}}

/* reports */
.w0{width:0%}.w1{width:1%}.w2{width:2%}.w3{width:3%}.w4{width:4%}.w5{width:5%}.w6{width:6%}.w7{width:7%}.w8{width:8%}.w9{width:9%}.w10{width:10%}.w11{width:11%}.w12{width:12%}.w13{width:13%}.w14{width:14%}.w15{width:15%}.w16{width:16%}.w17{width:17%}.w18{width:18%}.w19{width:19%}.w20{width:20%}.w21{width:21%}.w22{width:22%}.w23{width:23%}.w24{width:24%}.w25{width:25%}.w26{width:26%}.w27{width:27%}.w28{width:28%}.w29{width:29%}.w30{width:30%}.w31{width:31%}.w32{width:32%}.w33{width:33%}.w34{width:34%}.w35{width:35%}.w36{width:36%}.w37{width:37%}.w38{width:38%}.w39{width:39%}.w40{width:40%}.w41{width:41%}.w42{width:42%}.w43{width:43%}.w44{width:44%}.w45{width:45%}.w46{width:46%}.w47{width:47%}.w48{width:48%}.w49{width:49%}.w50{width:50%}.w51{width:51%}.w52{width:52%}.w53{width:53%}.w54{width:54%}.w55{width:55%}.w56{width:56%}.w57{width:57%}.w58{width:58%}.w59{width:59%}.w60{width:60%}.w61{width:61%}.w62{width:62%}.w63{width:63%}.w64{width:64%}.w65{width:65%}.w66{width:66%}.w67{width:67%}.w68{width:68%}.w69{width:69%}.w70{width:70%}.w71{width:71%}.w72{width:72%}.w73{width:73%}.w74{width:74%}.w75{width:75%}.w76{width:76%}.w77{width:77%}.w78{width:78%}.w79{width:79%}.w80{width:80%}.w81{width:81%}.w82{width:82%}.w83{width:83%}.w84{width:84%}.w85{width:85%}.w86{width:86%}.w87{width:87%}.w88{width:88%}.w89{width:89%}.w90{width:90%}.w91{width:91%}.w92{width:92%}.w93{width:93%}.w94{width:94%}.w95{width:95%}.w96{width:96%}.w97{width:97%}.w98{width:98%}.w99{width:99%}.w100{width:100%}
.hbar{height:10px;background:var(--grey-bg);border-radius:5px;overflow:hidden;min-width:90px}.hfill{height:100%;background:linear-gradient(90deg,var(--cyan),var(--teal),var(--green))}
.chartcol{width:26%}.presets{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.filterform{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}.filterform .field{margin:0}
.cols2{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:16px}
.kpis .d{color:var(--muted);font-size:12px;margin-top:4px}
.kpis .n{font-size:24px}
