:root {
  --brand: #1F3864;
  --brand-light: #2E74B5;
  --bg: #F4F6F9;
  --card: #FFFFFF;
  --border: #E1E0D9;
  --text: #23272B;
  --muted: #6B7280;
  --green: #1E7E34;
  --green-bg: #E6F4EA;
  --red: #B02A37;
  --red-bg: #FBEAEC;
  --amber: #8A6D00;
  --amber-bg: #FFF6DA;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, "Segoe UI", Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
}
header.topbar {
  background-color: #102a43;
  background-image: linear-gradient(90deg, rgba(8,26,44,.38), rgba(8,26,44,.04) 50%, rgba(8,26,44,.55)), url("/static/assets/kensho-banner.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: #fff;
  padding: 18px 28px;
  min-height: clamp(180px, 28vw, 320px);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}
header.topbar h1 {
  font-size: 18px;
  margin: 0;
  font-weight: 600;
  text-shadow: 0 2px 12px rgba(0,0,0,.9);
}
header.topbar .sub {
  font-size: 12px;
  opacity: 0.85;
  margin-top: 2px;
  text-shadow: 0 2px 10px rgba(0,0,0,.95);
}
header.topbar .who {
  text-align: right;
  font-size: 13px;
  background: rgba(8,26,44,.76);
  border: 1px solid rgba(216,184,107,.45);
  border-radius: 8px;
  padding: 8px 10px;
}
header.topbar .who a {
  color: #cfe0f5;
  text-decoration: underline;
  margin-left: 10px;
}
main {
  max-width: 1200px;
  margin: 24px auto;
  padding: 0 20px 60px;
}
.mis-module-tabs{display:flex;gap:0;background:#fff;border-bottom:1px solid var(--border);box-shadow:0 3px 10px rgba(16,42,67,.06);padding:0 max(20px,calc((100vw - 1200px)/2));position:sticky;top:0;z-index:20}.mis-module-tab{display:block;padding:15px 22px;color:#526475;text-decoration:none;font-size:13px;font-weight:700;border-bottom:3px solid transparent}.mis-module-tab:hover{color:#163954;background:#f5f7f8}.mis-module-tab.active{color:#163954;border-bottom-color:#b4975a;background:#fbfaf7}.mis-module-tab.disabled{color:#9aa5ad;cursor:not-allowed}
.card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 18px 20px;
  margin-bottom: 20px;
}
.card h2 {
  font-size: 15px;
  margin: 0 0 12px;
  color: var(--brand);
}
.card h3 {
  font-size: 13px;
  margin: 0 0 8px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
  margin-bottom: 6px;
}
.stat {
  background: #FAFBFD;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 14px;
}
.stat .label { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.stat .value { font-size: 22px; font-weight: 700; color: var(--brand); margin-top: 4px; }
table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
th, td {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
th {
  background: var(--brand);
  color: #fff;
  font-weight: 600;
  position: sticky;
  top: 0;
}
tbody tr:nth-child(even) { background: #FAFBFD; }
.table-wrap { overflow-x: auto; }
.pill {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}
.pill.pending { background: var(--amber-bg); color: var(--amber); }
.pill.recommended { background: #E3EEFB; color: var(--brand-light); }
.pill.not-recommended { background: #F0F0F0; color: var(--muted); }
.pill.authorised { background: var(--green-bg); color: var(--green); }
.pill.declined { background: var(--red-bg); color: var(--red); }
.pill.positive { background: var(--green-bg); color: var(--green); }
.pill.negative { background: var(--red-bg); color: var(--red); }
.pill.submitted { background: #E3EEFB; color: var(--brand-light); }
.pill.flagged { background: var(--amber-bg); color: var(--amber); }
button, select, input[type=text], input[type=password] {
  font-family: inherit;
  font-size: 13px;
}
button {
  cursor: pointer;
  border: none;
  border-radius: 6px;
  padding: 6px 12px;
  font-weight: 600;
}
button.primary { background: var(--brand); color: #fff; }
button.primary:hover { background: var(--brand-light); }
button.success { background: var(--green); color: #fff; }
button.danger { background: var(--red); color: #fff; }
button.ghost { background: #fff; border: 1px solid var(--border); color: var(--text); }
button:disabled { opacity: 0.5; cursor: not-allowed; }
button + button { margin-left: 6px; }
select {
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #fff;
}
.toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.muted { color: var(--muted); font-size: 12px; }
.empty { color: var(--muted); font-size: 13px; padding: 16px 0; text-align: center; }
.error-banner {
  background: var(--red-bg); color: var(--red); border: 1px solid #f0c3c9;
  border-radius: 8px; padding: 10px 14px; margin-bottom: 16px; font-size: 13px;
}
a.export-link { color: var(--brand-light); font-size: 12px; text-decoration: none; margin-right: 12px; }
a.export-link:hover { text-decoration: underline; }

/* --- Tabs (legacy 5-tab analytics dashboard) ------------------------------- */
.tabbar {
  display: flex;
  gap: 4px;
  border-bottom: 2px solid var(--border);
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.tabbar button {
  background: transparent;
  color: var(--muted);
  border: none;
  border-radius: 8px 8px 0 0;
  padding: 10px 16px;
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
  position: relative;
  top: 2px;
}
.tabbar button:hover { color: var(--text); background: #EDF1F6; }
.tabbar button.active { color: var(--brand); background: var(--card); border: 2px solid var(--border); border-bottom: 2px solid var(--card); }
.tab-panel { display: none; }
.tab-panel.active { display: block; }

/* Simple dependency-free horizontal bar "sparkline" for period-over-period trends */
.trend-bars { display: flex; flex-direction: column; gap: 8px; }
.trend-row { display: grid; grid-template-columns: 90px 1fr 60px; align-items: center; gap: 10px; font-size: 12px; }
.trend-row .track { background: #EDF1F6; border-radius: 5px; height: 16px; overflow: hidden; }
.trend-row .fill { background: var(--brand-light); height: 100%; border-radius: 5px 0 0 5px; }
.trend-row .val { text-align: right; color: var(--text); font-weight: 600; }

.reason-list { display: flex; flex-direction: column; gap: 6px; }
.reason-row { display: grid; grid-template-columns: 1fr 70px 90px; align-items: center; gap: 10px; font-size: 12px; padding: 4px 0; border-bottom: 1px solid var(--border); }

/* --- Weekly Employee Timesheet ------------------------------------------- */
.timesheet-card {
  border: 1px solid var(--border); border-radius: 8px; padding: 10px 14px; margin-bottom: 10px; background: #FAFBFD;
}
.timesheet-card summary {
  cursor: pointer; display: flex; gap: 16px; align-items: center; flex-wrap: wrap; font-size: 13px; font-weight: 600;
  list-style: none;
}
.timesheet-card summary::-webkit-details-marker { display: none; }
.timesheet-card summary::before { content: "▸"; color: var(--muted); margin-right: 2px; }
.timesheet-card[open] summary::before { content: "▾"; }
.timesheet-detail { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); }
.timesheet-detail textarea { font-family: inherit; border: 1px solid var(--border); border-radius: 6px; padding: 8px; }

.entry-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.entry-row {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)) auto;
  gap: 8px; align-items: end; background: #FAFBFD; border: 1px solid var(--border); border-radius: 8px; padding: 10px;
}
.entry-row label { display: block; font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; margin-bottom: 2px; }
.entry-row input, .entry-row select {
  width: 100%; padding: 6px 8px; border: 1px solid var(--border); border-radius: 6px; font-size: 12px;
}
.entry-row button.remove-row { background: var(--red-bg); color: var(--red); align-self: end; }
.form-actions { margin-top: 4px; margin-bottom: 16px; }

/* --- Capacity-to-Value product workspace -------------------------------- */
.product-shell { background: #eef1f3; }
.product-topbar { background-color: #102a43; padding: 18px 32px; border-bottom: 3px solid #b4975a; }
.product-main { max-width: 1380px; }
.product-hero { background: linear-gradient(125deg,#102a43,#1f4966); color:#fff; border-radius:16px; padding:32px 38px; margin-bottom:18px; display:grid; grid-template-columns:1fr auto; gap:30px; align-items:center; box-shadow:0 18px 45px rgba(16,42,67,.16); }
.product-hero h2 { margin:5px 0 9px; max-width:790px; font-size:28px; line-height:1.18; font-weight:650; }
.product-hero p { max-width:820px; margin:0; color:#d6e1e8; line-height:1.55; font-size:14px; }
.eyebrow,.section-kicker { letter-spacing:.13em; font-size:10px; font-weight:800; color:#b4975a; }
.status-orb { width:126px; height:126px; border:1px solid rgba(255,255,255,.28); border-radius:50%; display:flex; flex-direction:column; justify-content:center; text-align:center; background:rgba(255,255,255,.06); }
.status-orb span { font-size:18px; font-weight:750; }.status-orb small{font-size:9px;color:#b8c8d3;margin-top:5px;letter-spacing:.1em}
.product-controls { display:flex; gap:12px; align-items:end; background:#fff; padding:13px 18px; border:1px solid var(--border); border-radius:10px; margin-bottom:18px; }
.product-controls label,.upload-stack label { display:flex; flex-direction:column; gap:5px; font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; font-weight:700; }
.product-controls select { min-width:300px; }.product-spacer{flex:1}.ghost-link{font-size:12px;color:#1f4966;text-decoration:none;font-weight:650}
.product-controls #active-period{min-width:170px}.period-alignment{display:flex;gap:12px;align-items:center;padding:10px 12px;margin:8px 0 14px;border-radius:7px;font-size:12px}.period-alignment strong{font-size:9px;letter-spacing:.06em;white-space:nowrap}.period-alignment.matched{background:#eaf5ef;color:#235f46}.period-alignment.unmatched{background:#fff3e6;color:#8a4f24}.period-alignment span{line-height:1.4}
.benchmark-control{display:flex;gap:8px;align-items:center}.benchmark-control input{width:100px!important}.benchmark-result{display:grid;grid-template-columns:1fr auto;gap:8px 14px;margin-top:16px;border-top:1px solid #e5eaed;padding-top:12px;font-size:12px}.benchmark-result strong{color:#102a43}.modal{position:fixed;inset:0;background:rgba(9,27,43,.68);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}.modal-card{background:#fff;width:min(900px,95vw);max-height:90vh;overflow:auto;border-radius:12px;padding:24px;box-shadow:0 24px 70px rgba(0,0,0,.3)}.exceptional-form{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:16px 0}.exceptional-form input{padding:9px;border:1px solid var(--border);border-radius:6px}.exceptional-form button{grid-column:1/-1;padding:10px}#exceptional-summary{display:flex;flex-direction:column;gap:4px;margin:12px 0;color:#617585;font-size:12px}#exceptional-summary strong{color:#a05a2c}
.product-grid.two { display:grid; grid-template-columns:1fr 1fr; gap:18px; }.product-panel { border:none; box-shadow:0 5px 18px rgba(16,42,67,.06); }
.product-panel h2 { font-size:18px; color:#102a43; margin-top:5px; }.hidden{display:none!important}
.upload-stack { display:grid; gap:13px; }.upload-stack input[type=text],.product-panel input[type=text]{padding:9px 10px;border:1px solid var(--border);border-radius:6px}
.drop-zone { border:1px dashed #8da2b1; background:#f7f9fa; padding:15px; border-radius:8px; }.drop-zone input{margin-top:7px}.wide{width:100%;padding:10px}
.file-queue{display:flex;flex-direction:column;gap:5px}.file-queue>div{display:grid;grid-template-columns:24px 1fr auto;gap:8px;align-items:center;background:#f7f9fa;border:1px solid #e4e8eb;border-radius:6px;padding:7px 9px}.file-queue>div span{width:20px;height:20px;border-radius:50%;background:#1f4966;color:#fff;text-align:center;line-height:20px;font-size:10px}.file-queue>div strong{font-size:11px;color:#223b4c;overflow:hidden;text-overflow:ellipsis}.file-queue>div small{white-space:nowrap}.upload-success{margin-top:6px;color:var(--green);line-height:1.55}.upload-errors{margin-top:6px;color:var(--red);line-height:1.55}
.metric-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }.board-metric{padding:17px;border:1px solid #e4e8eb;border-radius:9px;background:#fafbfc;min-height:105px}
.financial-metric-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.link-metric-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.index-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.decision-narrative{display:flex;gap:18px;align-items:center;margin-top:14px;background:#102a43;color:#e9f0f4;padding:15px 18px;border-left:4px solid #b4975a;border-radius:7px;font-size:13px;line-height:1.5}.decision-narrative strong{color:#e0bd68;white-space:nowrap}.decision-narrative span{flex:1}
.board-metric span{display:block;font-size:10px;color:#617585;text-transform:uppercase;letter-spacing:.07em;font-weight:750}.board-metric strong{display:block;color:#102a43;font-size:24px;margin:8px 0 4px}.board-metric small{color:#81909b}
.linked-metric{display:block;color:inherit;text-decoration:none;position:relative;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.linked-metric:hover,.linked-metric:focus{transform:translateY(-2px);border-color:#b4975a;box-shadow:0 8px 18px rgba(16,42,67,.12);outline:none}.linked-metric em{display:block;margin-top:10px;color:#2c6e83;font-size:10px;font-style:normal;font-weight:750;text-transform:uppercase;letter-spacing:.05em}
.unavailable-metric{cursor:default;background:#f6f7f8;border-color:#eceff1}.unavailable-metric span,.unavailable-metric strong,.unavailable-metric small{opacity:.48}.unavailable-metric em{display:block;margin-top:10px;color:#97a2aa;opacity:.58;font-size:10px;font-style:normal;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.trend-chart{min-height:285px;border:1px solid #e4e8eb;border-radius:9px;background:#fafbfc;padding:10px}.trend-chart svg{display:block;width:100%;height:auto;min-height:250px}.trend-chart .axis{stroke:#cbd5dc;stroke-width:1}.trend-chart .grid{stroke:#e7ecef;stroke-width:1}.trend-chart text{fill:#617585;font-size:10px}.trend-chart .legend-label{font-size:9px;font-weight:700}.trend-chart .no-trend{display:flex;align-items:center;justify-content:center;min-height:250px;color:#97a2aa;text-align:center;padding:20px}
.configuration-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}.configuration-grid label{font-size:11px;color:#526a7a}.configuration-grid input,.configuration-grid select{display:block;width:100%;margin-top:4px;padding:8px}.configuration-grid .span-two{grid-column:1/-1}.mapping-form{display:grid;grid-template-columns:1.4fr 1.3fr 1fr .7fr;gap:8px;margin:14px 0}.mapping-form button{grid-column:1/-1}.confidence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.confidence-card{border:1px solid #e1e7ea;border-left:5px solid #97a2aa;border-radius:7px;padding:13px;background:#fafbfc}.confidence-card.confirmed{border-left-color:#2f7d62}.confidence-card.strong-indicator{border-left-color:#2c6e83}.confidence-card.provisional{border-left-color:#b4975a}.confidence-card.unavailable{opacity:.6}.confidence-card span{font-size:10px;font-weight:800;letter-spacing:.05em}.confidence-card strong{display:block;margin:6px 0}.confidence-card small{display:block;color:#647985;line-height:1.45}.confidence-card em{display:block;margin-top:8px;font-size:11px;color:#7b4d23}
.analysis-detail{border-top:4px solid #b4975a;scroll-margin-top:72px}.analysis-heading{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.analysis-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;margin:18px 0 24px}.detail-graph{display:flex;flex-direction:column;gap:11px}.detail-bar{display:grid;grid-template-columns:145px 1fr 110px;gap:10px;align-items:center;font-size:12px}.detail-bar>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.detail-bar i{height:18px;background:#edf1f3;border-radius:9px;overflow:hidden}.detail-bar b{display:block;height:100%;background:linear-gradient(90deg,#1f4966,#b4975a);border-radius:9px}.detail-bar strong{text-align:right;color:#102a43}.executive-observation{background:#f5f2ea;border-left:4px solid #b4975a;padding:14px 16px;border-radius:4px;color:#294459;font-size:13px;line-height:1.55}.analysis-facts{margin:14px 0 0}.analysis-facts>div{display:grid;grid-template-columns:100px 1fr;gap:10px;border-bottom:1px solid #e7eaec;padding:9px 0}.analysis-facts dt{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:#617585;font-weight:750}.analysis-facts dd{margin:0;font-size:12px;color:#294459}.analysis-detail table th{position:static;width:190px;background:#eef2f4;color:#294459}.analysis-detail table td{white-space:normal}
.value-bars{display:flex;flex-direction:column;gap:13px}.value-bars>div{display:grid;grid-template-columns:115px 1fr 100px;gap:10px;align-items:center;font-size:12px}.value-bars i{height:13px;background:#e9edf0;border-radius:9px;overflow:hidden}.value-bars b{display:block;height:100%;background:linear-gradient(90deg,#2c6e83,#70a9a1);border-radius:9px}.value-bars strong{text-align:right;color:#102a43}
.total-callout{margin-top:20px;border-top:1px solid var(--border);padding-top:14px;display:flex;justify-content:space-between;color:#102a43}.total-callout strong{font-size:20px}
.check-row{display:grid;grid-template-columns:14px 1fr auto;gap:10px;align-items:center;padding:10px 2px;border-bottom:1px solid #edf0f2;font-size:13px}.check-dot{width:9px;height:9px;border-radius:50%}.check-dot.ok{background:#2e7d5b}.check-dot.fail{background:#ba4343}.check-row strong{font-size:10px;letter-spacing:.06em}
.source-warning{background:#fff8f1;padding:12px 10px;border-left:3px solid #ba6b43}.source-warning small{display:block;color:#7a6a61;margin-top:4px}
.ledger{display:flex;flex-direction:column;gap:8px}.ledger>div{display:grid;grid-template-columns:115px 1fr auto;align-items:center;gap:10px;padding:9px;border-bottom:1px solid #edf0f2;font-size:12px}.ledger small{color:var(--muted)}.source-badge{background:#e7eef2;color:#24485c;border-radius:99px;padding:4px 8px;font-size:9px;text-transform:uppercase;font-weight:800;text-align:center}
@media(max-width:1100px){.financial-metric-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:850px){.product-grid.two{grid-template-columns:1fr}.metric-grid,.index-grid,.financial-metric-grid{grid-template-columns:1fr 1fr}.product-hero{grid-template-columns:1fr}.status-orb{display:none}.product-controls{align-items:stretch;flex-direction:column}.product-controls select{min-width:0;width:100%}.mis-module-tabs{position:static;overflow-x:auto;padding:0}.mis-module-tab{white-space:nowrap}.decision-narrative{align-items:flex-start;flex-direction:column;gap:6px}.analysis-layout{grid-template-columns:1fr}}
@media(max-width:620px){.exceptional-form{grid-template-columns:1fr}.exceptional-form button{grid-column:auto}}
@media(max-width:520px){.metric-grid{grid-template-columns:1fr}.value-bars>div{grid-template-columns:90px 1fr 80px}.ledger>div{grid-template-columns:1fr}.product-hero{padding:24px}.product-hero h2{font-size:22px}}

/* Shared sign-in treatment uses the same application banner as every dashboard. */
body.login-page { display:flex; flex-direction:column; min-height:100vh; }
.login-banner { width:100%; flex:0 0 auto; }
.login-content { display:flex; align-items:center; justify-content:center; flex:1; width:100%; padding:30px 18px; }
.login-box { box-shadow:0 12px 36px rgba(16,42,67,.12); }
@media(max-width:700px){header.topbar{min-height:165px;background-size:cover;background-position:center}.product-topbar{min-height:165px}header.topbar h1{font-size:15px}header.topbar .sub{font-size:10px}}
.scenario-form,.intervention-form{margin-bottom:14px}.ledger>div>em{display:block;color:#5b6872;font-size:.82rem;font-style:normal}
