:root{
  --bg:#f8f7f4;--sf:#fff;--s2:#f1efe8;--bd:rgba(0,0,0,0.09);
  --tx:#1a1a18;--tx2:#5f5e5a;--tx3:#888780;--tx4:#b4b2a9;
  --ac:#185fa5;--abg:#e6f1fb;
  --go:#3b6d11;--gbg:#eaf3de;--ga:#c0dd97;
  --wa:#ba7517;--wbg:#faeeda;--wa2:#fac775;
  --da:#a32d2d;--dbg:#fcebeb;--da2:#f7c1c1;
  --mo:#534ab7;--mbg:#eeedfe;
  --co:#993c1d;--cbg:#faece7;
  --te:#0f6e56;--tbg:#e1f5ee;
  --r:10px;--rs:6px;--nav:56px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;overflow:hidden;}
body{font-family:-apple-system,'Segoe UI',sans-serif;background:var(--bg);color:var(--tx);font-size:13px;display:flex;flex-direction:column;}

/* NAV */
.nav{height:var(--nav);background:var(--sf);border-bottom:.5px solid var(--bd);display:flex;align-items:center;padding:0 20px;gap:0;flex-shrink:0;z-index:100;}
.nav-brand{font-size:14px;font-weight:600;letter-spacing:-.3px;margin-right:24px;white-space:nowrap;}
.nav-brand span{color:var(--ac);}
.nav-tabs{display:flex;gap:2px;flex:1;}
.nav-tab{padding:6px 14px;border-radius:var(--rs);border:none;background:transparent;cursor:pointer;font-size:12px;font-weight:500;color:var(--tx2);transition:all .15s;white-space:nowrap;}
.nav-tab:hover{background:var(--s2);}
.nav-tab.active{background:var(--ac);color:#fff;}
.nav-right{display:flex;gap:8px;align-items:center;}
.btn{padding:6px 13px;border-radius:var(--rs);border:.5px solid var(--bd);background:var(--sf);cursor:pointer;font-size:11px;font-weight:500;color:var(--tx);transition:all .15s;}
.btn:hover{background:var(--s2);}
.btn.primary{background:var(--ac);color:#fff;border-color:var(--ac);}
.btn.primary:hover{opacity:.9;}
.btn.danger{background:var(--dbg);color:var(--da);border-color:var(--da2);}
.btn.sm{padding:4px 10px;font-size:10px;}

/* CONTENT AREA */
.content{flex:1;overflow-y:auto;padding:0;}
.page{display:none;padding:20px;max-width:1800px;margin:0 auto;}
.page.active{display:block;}

/* UPLOAD ZONE */
.upload-zone{border:1.5px dashed var(--bd);border-radius:var(--r);padding:28px 20px;text-align:center;cursor:pointer;transition:all .2s;background:var(--sf);}
.upload-zone:hover,.upload-zone.drag{border-color:var(--ac);background:var(--abg);}
.upload-zone h3{font-size:13px;font-weight:500;margin-bottom:6px;}
.upload-zone p{font-size:11px;color:var(--tx3);}
.reg-name{cursor:pointer;color:var(--ac);text-decoration:underline;text-underline-offset:2px;}
.reg-note{color:var(--tx3);font-size:10px;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;}
.reg-loc{font-size:10px;color:var(--tx2);}
.tag-late{font-size:9px;color:var(--wa);margin-left:4px;}
.tag-ot{font-size:9px;color:var(--te);margin-left:3px;}
.tag-early{font-size:9px;color:var(--co);margin-left:3px;}
.tag-inc{font-size:9px;color:var(--wa);margin-left:3px;}
.c-go{color:var(--go);}
.c-da{color:var(--da);}
.c-ac{color:var(--ac);}
.c-wa{color:var(--wa);}
.c-tx3{color:var(--tx3);font-size:9px;}
.edit-toggle:hover{color:var(--ac);background:var(--abg)!important;}
.edit-row td{border-top:.5px solid var(--bd);}
.chip{padding:4px 11px;border-radius:20px;border:.5px solid var(--bd);background:var(--sf);cursor:pointer;font-size:11px;font-weight:500;color:var(--tx2);transition:all .15s;white-space:nowrap;}
.chip:hover{border-color:var(--ac);color:var(--ac);}
.chip.active{background:var(--ac);color:#fff;border-color:var(--ac);}
.chip-warn{border-color:var(--wa2);color:var(--wa);}
.chip-warn:hover{background:var(--wbg);}
.chip-warn.active{background:var(--wa);color:#fff;border-color:var(--wa);}

.file-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:.5px solid var(--bd);}
.file-row:last-child{border-bottom:none;}
.file-row-name{font-size:11px;font-weight:500;color:var(--tx);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.file-row-controls{display:flex;align-items:center;gap:6px;flex-shrink:0;}
.file-row-type select{font-size:10px;padding:3px 6px;border:.5px solid var(--bd);border-radius:var(--rs);background:var(--sf);color:var(--tx);cursor:pointer;width:130px;}
.file-row-sheet select{font-size:10px;padding:3px 6px;border:.5px solid var(--ac);border-radius:var(--rs);background:var(--abg);color:var(--ac);cursor:pointer;width:150px;}
.file-row-rm{background:none;border:none;cursor:pointer;color:var(--tx4);font-size:13px;padding:2px 4px;flex-shrink:0;line-height:1;}
.file-row-rm:hover{color:var(--da);}
.type-badge{font-size:9px;padding:2px 7px;border-radius:20px;background:var(--gbg);color:var(--go);font-weight:500;white-space:nowrap;}
.type-badge.warn{background:var(--wbg);color:var(--wa);}
.type-badge.site{background:var(--abg);color:var(--ac);}
.type-badge.leave{background:var(--s2);color:var(--tx2);}
.type-badge.unknown{background:var(--dbg);color:var(--da);}
.file-tag{background:var(--gbg);color:var(--go);border:.5px solid var(--ga);border-radius:20px;padding:3px 10px;font-size:10px;display:flex;align-items:center;gap:5px;}
.file-tag.warn{background:var(--wbg);color:var(--wa);border-color:var(--wa2);}
.file-tag .rm{cursor:pointer;opacity:.6;font-size:12px;line-height:1;}
.file-tag .rm:hover{opacity:1;}

/* KPI GRID */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-bottom:14px;}
.kpi{background:var(--sf);border:.5px solid var(--bd);border-radius:var(--r);padding:10px 13px;position:relative;overflow:hidden;}
.kpi-lbl{font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px;}
.kpi-val{font-size:19px;font-weight:600;letter-spacing:-.4px;line-height:1.1;}
.kpi-sub{font-size:9px;color:var(--tx2);margin-top:2px;}
.kpi-delta{position:absolute;top:8px;right:10px;font-size:9px;font-weight:600;}
.kpi-spark{height:3px;background:var(--bd);border-radius:2px;margin-top:5px;overflow:hidden;}
.kpi-spark-fill{height:100%;border-radius:2px;}
.kp-hi{background:var(--abg);border-color:#b5d4f4;}.kp-hi .kpi-val{color:var(--ac);}
.kp-go{background:var(--gbg);border-color:var(--ga);}.kp-go .kpi-val{color:var(--go);}
.kp-wa{background:var(--wbg);border-color:var(--wa2);}.kp-wa .kpi-val{color:var(--wa);}
.kp-da{background:var(--dbg);border-color:var(--da2);}.kp-da .kpi-val{color:var(--da);}
.kp-te{background:var(--tbg);border-color:#9fe1cb;}.kp-te .kpi-val{color:var(--te);}
.kp-mo{background:var(--mbg);border-color:#afa9ec;}.kp-mo .kpi-val{color:var(--mo);}

/* CARD */
.card{background:var(--sf);border:.5px solid var(--bd);border-radius:var(--r);padding:14px;}
.card-title{font-size:10px;font-weight:600;color:var(--tx3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px;}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:14px;}
@media(max-width:900px){.g2,.g3{grid-template-columns:1fr;}}

/* WEEK CARD (home) */
.week-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:16px;}
.week-card{background:var(--sf);border:.5px solid var(--bd);border-radius:var(--r);padding:13px;cursor:pointer;transition:all .15s;position:relative;}
.week-card:hover{border-color:var(--ac);box-shadow:0 0 0 2px var(--abg);}
.week-card.selected{border-color:var(--ac);background:var(--abg);}
.wc-label{font-size:12px;font-weight:600;color:var(--tx);margin-bottom:2px;}
.wc-dates{font-size:10px;color:var(--tx3);margin-bottom:8px;}
.wc-stats{display:flex;gap:10px;flex-wrap:wrap;}
.wc-stat{text-align:center;}
.wc-stat-val{font-size:14px;font-weight:600;}
.wc-stat-lbl{font-size:8px;color:var(--tx3);}
.wc-del{position:absolute;top:8px;right:8px;background:none;border:none;cursor:pointer;color:var(--tx4);font-size:14px;line-height:1;padding:2px;}
.wc-del:hover{color:var(--da);}
.add-week-card{background:transparent;border:1.5px dashed var(--bd);border-radius:var(--r);padding:13px;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;min-height:100px;color:var(--tx3);font-size:11px;}
.add-week-card:hover{border-color:var(--ac);color:var(--ac);background:var(--abg);}

/* TABLE */
.tbl-wrap{overflow-x:auto;}
table{width:100%;border-collapse:collapse;font-size:11px;}
th{text-align:left;padding:5px 8px;font-size:9px;font-weight:600;color:var(--tx3);text-transform:uppercase;letter-spacing:.3px;border-bottom:.5px solid var(--bd);background:var(--sf);white-space:nowrap;cursor:pointer;user-select:none;position:sticky;top:0;}
th:hover{color:var(--ac);}
th.sa::after{content:' ▲';font-size:7px;}
th.sd::after{content:' ▼';font-size:7px;}
th.nm,td.nm{text-align:right;font-variant-numeric:tabular-nums;}
td{padding:5px 8px;border-bottom:.5px solid var(--bd);vertical-align:middle;white-space:nowrap;}
tr:last-child td{border-bottom:none;}
tr:hover td{background:var(--bg);}
td.fw{font-weight:500;}
.dim,td.dim{font-size:10px;color:var(--tx2);}

/* BADGE */
.badge{display:inline-block;font-size:10px;font-weight:500;padding:2px 7px;border-radius:20px;}
.b-fu{background:var(--gbg);color:var(--go);}
.b-go{background:var(--abg);color:var(--ac);}
.b-mo{background:var(--mbg);color:var(--mo);}
.b-po{background:var(--wbg);color:var(--wa);}
.b-ab{background:var(--dbg);color:var(--da);}
.b-lv{background:var(--s2);color:var(--tx2);}
.b-hy{background:#f0f0f0;color:var(--tx3);}
.b-la{background:var(--wbg);color:var(--wa);}
.b-ea{background:var(--cbg);color:var(--co);}
.b-ll{background:var(--mbg);color:var(--mo);}
.b-ot{background:var(--tbg);color:var(--te);}

/* FILTERS */
.filter-bar{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:10px;}
input[type=text]{padding:5px 9px;border:.5px solid var(--bd);border-radius:var(--rs);font-size:11px;background:var(--sf);color:var(--tx);min-width:150px;outline:none;}
input[type=text]:focus{border-color:var(--ac);}
select{padding:5px 8px;border:.5px solid var(--bd);border-radius:var(--rs);font-size:11px;background:var(--sf);color:var(--tx);outline:none;cursor:pointer;}
.row-count{font-size:10px;color:var(--tx3);align-self:center;white-space:nowrap;}

/* MODAL */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:500;display:none;align-items:center;justify-content:center;}
.modal-bg.show{display:flex;}
.modal{background:var(--sf);border-radius:var(--r);padding:24px;min-width:360px;max-width:600px;width:90%;max-height:80vh;overflow-y:auto;border:.5px solid var(--bd);}
.modal h2{font-size:15px;font-weight:600;margin-bottom:4px;}
.modal p{font-size:12px;color:var(--tx2);margin-bottom:16px;}
.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;}
.progress-bar{height:4px;background:var(--s2);border-radius:2px;overflow:hidden;margin:8px 0;}
.progress-fill{height:100%;background:var(--ac);border-radius:2px;transition:width .3s;}
.step-list{list-style:none;}
.step-list li{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:.5px solid var(--bd);font-size:11px;}
.step-list li:last-child{border-bottom:none;}
.step-icon{width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;flex-shrink:0;}
.step-icon.ok{background:var(--gbg);color:var(--go);}
.step-icon.warn{background:var(--wbg);color:var(--wa);}
.step-icon.err{background:var(--dbg);color:var(--da);}
.step-icon.spin{background:var(--abg);color:var(--ac);animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

/* COMPARISON CHIPS */
.cmp-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px;align-items:center;}
.cmp-chip{padding:4px 12px;border-radius:20px;font-size:11px;font-weight:500;cursor:pointer;border:.5px solid var(--bd);background:var(--sf);color:var(--tx2);}
.cmp-chip.sel{background:var(--ac);color:#fff;border-color:var(--ac);}
.cmp-chip.add{border-style:dashed;background:transparent;}
.cmp-chip.add:hover{border-color:var(--ac);color:var(--ac);}

/* SECTION HEADER */
.sec-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;margin-top:4px;}
.sec-title{font-size:12px;font-weight:600;}
.sec-sub{font-size:10px;color:var(--tx3);}

/* TABS (within a page) */
.inner-tabs{display:flex;gap:2px;border-bottom:.5px solid var(--bd);margin-bottom:14px;}
.inner-tab{padding:6px 14px;border-bottom:2px solid transparent;cursor:pointer;font-size:11px;font-weight:500;color:var(--tx2);margin-bottom:-1px;}
.inner-tab.active{color:var(--ac);border-bottom-color:var(--ac);}

/* ALERT */
.alert{padding:8px 12px;border-radius:var(--rs);font-size:10px;margin-bottom:12px;line-height:1.5;}
.alert-warn{background:var(--wbg);border:.5px solid var(--wa2);color:var(--wa);}
.alert-info{background:var(--abg);border:.5px solid #b5d4f4;color:var(--ac);}
.alert-ok{background:var(--gbg);border:.5px solid var(--ga);color:var(--go);}

/* TREND LINE (home) */
.trend-wrap{background:var(--sf);border:.5px solid var(--bd);border-radius:var(--r);padding:14px;margin-bottom:14px;}

/* SETTINGS */
.settings-section{margin-bottom:20px;}
.settings-section h3{font-size:11px;font-weight:600;color:var(--tx3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;}
.setting-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:.5px solid var(--bd);}
.setting-row:last-child{border-bottom:none;}
.setting-label{font-size:12px;}
.setting-desc{font-size:10px;color:var(--tx3);margin-top:1px;}
input[type=number]{padding:4px 8px;border:.5px solid var(--bd);border-radius:var(--rs);font-size:11px;width:80px;outline:none;}

/* EMPTY STATE */
.empty{text-align:center;padding:40px 20px;color:var(--tx3);}
.empty-icon{font-size:32px;margin-bottom:10px;}
.empty h3{font-size:13px;font-weight:500;color:var(--tx2);margin-bottom:6px;}
.empty p{font-size:11px;}

/* CHART CANVAS */
.chart-box{position:relative;height:220px;}
.chart-box-lg{position:relative;height:300px;}

/* scrollbar */
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--bd);border-radius:3px;}

/* location summary row */
.loc-row{display:flex;align-items:center;justify-content:space-between;padding:7px 0;border-bottom:.5px solid var(--bd);}
.loc-row:last-child{border-bottom:none;}
.loc-name{font-size:12px;font-weight:500;}
.loc-sub{font-size:9px;color:var(--tx3);}
.loc-stats-row{display:flex;gap:12px;}
.ls{text-align:right;}
.ls-val{font-size:12px;font-weight:600;}
.ls-lbl{font-size:8px;color:var(--tx3);}
/* Day-cell colour states — used by the mini week grids in Staff Lookup.
   Layout rules (.week-day-grid/.day-cell sizing) live in the Staff Lookup
   redesign section below; only the per-state colours are shared here. */
.day-label{font-size:9px;font-weight:600;color:var(--tx3);letter-spacing:.2px;}
.day-dot{width:9px;height:9px;border-radius:50%;}
.day-time{font-size:8px;color:var(--tx3);}
.day-ok    {background:#e8f5e9;border-color:#a5d6a7;} .day-ok .day-dot{background:#3b6d11;}
.day-late  {background:#fff8e1;border-color:#ffe082;} .day-late .day-dot{background:#e6a800;}
.day-early {background:#fff3e0;border-color:#ffcc80;} .day-early .day-dot{background:#ba7517;}
.day-ot    {background:#f3e5f5;border-color:#ce93d8;} .day-ot .day-dot{background:#534ab7;}
.day-ll    {background:#fce4ec;border-color:#f48fb1;} .day-ll .day-dot{background:#c62828;}
.day-abs   {background:#ffebee;border-color:#ef9a9a;} .day-abs .day-dot{background:#a32d2d;}
.day-inc   {background:#fff8e1;border-color:#ffe082;} .day-inc .day-dot{background:#e6a800;opacity:.6;}
.day-err   {background:#ffebee;border-color:#ef9a9a;} .day-err .day-dot{background:#e53935;}
.day-none  {background:var(--s2);border-color:var(--bd);} .day-none .day-dot{background:var(--bd);}
.day-off   {background:transparent;border-color:transparent;opacity:.3;} .day-off .day-dot{background:var(--bd);}
/* dark mode adjustments */
@media (prefers-color-scheme:dark){
  .day-ok{background:#1b2e1b;border-color:#2d5a2d;}
  .day-late{background:#2e2500;border-color:#5a4200;}
  .day-early{background:#2e1f00;border-color:#5a3e00;}
  .day-ot{background:#1e1530;border-color:#4a3880;}
  .day-ll{background:#2e1520;border-color:#6b2040;}
  .day-abs{background:#2e1515;border-color:#6b2020;}
  .day-inc{background:#2e2500;border-color:#5a4200;}
  .day-err{background:#2e1515;border-color:#8b2020;}
}

/* ── Staff Lookup redesign ── */
.staff-layout{display:grid;grid-template-columns:240px 1fr;gap:14px;align-items:start;min-height:calc(100vh - 120px);}
@media(max-width:700px){.staff-layout{grid-template-columns:1fr;}}

/* Sidebar */
.staff-sidebar{position:sticky;top:56px;background:var(--sf);border:.5px solid var(--bd);border-radius:var(--r);overflow:hidden;}
.staff-search-wrap{padding:10px;border-bottom:.5px solid var(--bd);}
.staff-search-wrap input{width:100%;padding:6px 10px;border:.5px solid var(--bd);border-radius:var(--rs);font-size:12px;background:var(--bg);color:var(--tx);outline:none;}
.staff-search-wrap input:focus{border-color:var(--ac);box-shadow:0 0 0 2px var(--abg);}
#staff-suggestions{background:var(--sf);border:.5px solid var(--bd);border-radius:var(--rs);margin-top:4px;display:none;max-height:180px;overflow-y:auto;}
.staff-dir-filters{padding:8px 10px;border-bottom:.5px solid var(--bd);}
.staff-dir-filters select{width:100%;padding:5px 8px;border:.5px solid var(--bd);border-radius:var(--rs);font-size:11px;background:var(--bg);color:var(--tx);outline:none;}
.staff-dir-count{padding:5px 10px;font-size:10px;color:var(--tx3);border-bottom:.5px solid var(--bd);}
.staff-dir-list{max-height:calc(100vh - 240px);overflow-y:auto;}
.staff-dir-item{display:flex;align-items:center;gap:8px;padding:8px 10px;cursor:pointer;border-bottom:.5px solid var(--bd);transition:background .1s;}
.staff-dir-item:last-child{border-bottom:none;}
.staff-dir-item:hover{background:var(--s2);}
.staff-dir-item.active{background:var(--abg);}
.staff-dir-avatar{width:26px;height:26px;border-radius:50%;background:var(--s2);display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:600;color:var(--tx2);flex-shrink:0;}
.staff-dir-item.active .staff-dir-avatar{background:var(--ac);color:#fff;}
.staff-dir-name{font-size:11px;font-weight:500;color:var(--tx);line-height:1.3;}
.staff-dir-meta{font-size:9px;color:var(--tx3);}
.staff-dir-badge{margin-left:auto;flex-shrink:0;}

/* Profile panel */
.staff-profile{min-width:0;}
.staff-empty-state{background:var(--sf);border:.5px solid var(--bd);border-radius:var(--r);padding:48px 20px;}
.staff-prof-hdr{}
.staff-prof-top{display:flex;align-items:center;gap:12px;margin-bottom:2px;}
.staff-avatar{width:42px;height:42px;border-radius:50%;background:var(--abg);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:var(--ac);flex-shrink:0;}
.staff-prof-info{flex:1;min-width:0;}
.staff-prof-name{font-size:15px;font-weight:600;color:var(--tx);}
.staff-prof-meta{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--tx3);margin-top:2px;flex-wrap:wrap;}
.staff-prof-actions{margin-left:auto;}

/* Section header with legend */
.staff-section-hdr{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px;margin-bottom:10px;}
.staff-grid-legend{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--tx3);flex-wrap:wrap;}
.staff-grid-legend span{font-size:14px;line-height:1;cursor:default;}

/* Condensed KPI stat line (identity strip) */
.kpi-line{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:11px;color:var(--tx2);margin-top:12px;padding-top:10px;border-top:.5px solid var(--bd);}
.kpi-line .stat-item b{font-weight:600;color:var(--tx);}
.kpi-line .stat-sep{color:var(--tx4);}

/* Mini day-grid — shared sizing for both the week explorer rows and any
   other place a Mon–Sat attendance strip is rendered */
.week-day-grid{display:flex;gap:4px;flex-shrink:0;}
.day-cell{display:flex;flex-direction:column;align-items:center;gap:2px;width:34px;padding:4px 2px;border-radius:5px;border:.5px solid transparent;cursor:default;transition:transform .1s;}
.day-cell:hover{transform:scale(1.1);}

/* Attendance trend strip */
.staff-trend-avg{font-size:11px;color:var(--tx3);font-weight:500;}
.trend-bars{display:flex;align-items:flex-end;gap:6px;padding:2px 2px 0;overflow-x:auto;}
.trend-bar-col{display:flex;flex-direction:column;align-items:center;gap:5px;flex:1 1 0;min-width:16px;max-width:38px;}
.trend-bar-track{width:100%;height:52px;display:flex;align-items:flex-end;background:var(--s2);border-radius:3px;overflow:hidden;}
.trend-bar{width:100%;border-radius:2px 2px 0 0;transition:height .2s;}
.trend-bar-lbl{font-size:8px;color:var(--tx3);white-space:nowrap;}
/* Trend bar colours keyed to the same status groups as the badges */
.trend-bar[data-cls="b-fu"]{background:var(--go);}
.trend-bar[data-cls="b-go"]{background:var(--ac);}
.trend-bar[data-cls="b-mo"]{background:var(--mo);}
.trend-bar[data-cls="b-po"]{background:var(--wa);}
.trend-bar[data-cls="b-ab"]{background:var(--da);}
.trend-bar[data-cls="b-lv"]{background:var(--tx2);}
.trend-bar[data-cls="b-hy"]{background:var(--tx4);}
.trend-bar[data-cls="b-la"]{background:var(--wa);}
.trend-bar[data-cls="b-ea"]{background:var(--co);}
.trend-bar[data-cls="b-ll"]{background:var(--mo);}
.trend-bar[data-cls="b-ot"]{background:var(--te);}

/* Week explorer — one row per week, expands in place to the daily register */
.wk-row{border-bottom:.5px solid var(--bd);}
.wk-row:last-child{border-bottom:none;}
.wk-row-main{display:flex;align-items:center;gap:12px;padding:9px 4px;cursor:pointer;transition:background .1s;border-radius:var(--rs);}
.wk-row-main:hover{background:var(--s2);}
.wk-row.open .wk-row-main{background:var(--abg);}
.wk-row-label{display:flex;flex-direction:column;min-width:96px;flex-shrink:0;}
.wk-row-wk{font-size:11px;font-weight:600;color:var(--tx);}
.wk-row-dates{font-size:9px;color:var(--tx3);}
.wk-row-stats{display:flex;align-items:center;gap:8px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end;}
.wk-stat{font-size:11px;color:var(--tx2);white-space:nowrap;}
.wk-row-chevron{font-size:10px;color:var(--tx4);transition:transform .15s;flex-shrink:0;}
.wk-row.open .wk-row-chevron{transform:rotate(180deg);color:var(--ac);}
.wk-row-detail{overflow:hidden;padding:0 4px;}
.wk-row-detail:empty{padding:0;}
.wk-detail-hdr{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:600;color:var(--tx2);padding:8px 0 6px;}
@media(max-width:640px){
  .wk-row-main{flex-wrap:wrap;}
  .wk-row-stats{margin-left:0;width:100%;justify-content:flex-start;}
}

/* ── Print-only daily report (PDF export via window.print) ────────────────
   Hidden on screen; the app UI is hidden and only #print-root is shown when
   printing/saving as PDF. Kept plain and print-safe: no CSS variables that
   might not resolve in the print context, no dark-mode surprises. */
#print-root{display:none;}
@media print{
  body *{visibility:hidden;}
  #print-root, #print-root *{visibility:visible;}
  #print-root{
    display:block;position:absolute;top:0;left:0;width:100%;
    padding:0;font-family:-apple-system,'Segoe UI',sans-serif;color:#1a1a18;
  }
  .print-hdr{border-bottom:2px solid #1a1a18;padding-bottom:10px;margin-bottom:14px;}
  .print-brand{font-size:11px;font-weight:600;color:#5f5e5a;text-transform:uppercase;letter-spacing:.6px;}
  .print-hdr h1{font-size:20px;font-weight:700;margin:4px 0 2px;}
  .print-meta{font-size:12px;color:#5f5e5a;}
  .print-summary{display:flex;gap:18px;flex-wrap:wrap;font-size:12px;margin-bottom:18px;padding:10px 0;border-bottom:.5px solid #ccc;}
  .print-summary b{font-size:14px;}
  #print-root h2{font-size:13px;font-weight:700;margin:16px 0 6px;}
  #print-root table{width:100%;border-collapse:collapse;font-size:11px;margin-bottom:4px;}
  #print-root th{text-align:left;font-size:9px;text-transform:uppercase;letter-spacing:.4px;color:#5f5e5a;border-bottom:1px solid #1a1a18;padding:5px 6px;}
  #print-root td{padding:5px 6px;border-bottom:.5px solid #ddd;}
  #print-root thead{display:table-header-group;} /* repeat header across page breaks */
  #print-root tr{page-break-inside:avoid;}
  .print-footer{margin-top:20px;padding-top:8px;border-top:.5px solid #ccc;font-size:9px;color:#888;}
  @page{margin:16mm 14mm;}
}