:root{
  --ink:#1B2A41;
  --paper:#EEF1EC;
  --paper-deep:#E4E9E2;
  --line:#C9D0C5;
  --seal:#A63A2E;
  --seal-deep:#7D2B22;
  --good:#2F6F52;
  --amber:#C98A2C;
  --steel:#5C6773;
  --serif:'Source Serif 4', serif;
  --mono:'IBM Plex Mono', monospace;
  --sans:'Inter', sans-serif;
}
*{box-sizing:border-box;}
body{
  margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  background-image:linear-gradient(var(--line) 1px, transparent 1px);
  background-size:100% 42px;
  min-height:100vh;
}
.wrap{max-width:1180px;margin:0 auto;padding:36px 28px 80px;}
.hidden{display:none !important;}
button{font-family:var(--sans);cursor:pointer;}

/* ===== Header ===== */
header{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;border-bottom:2px solid var(--ink);padding-bottom:18px;margin-bottom:28px;flex-wrap:wrap;}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel);margin-bottom:6px;}
h1{font-family:var(--serif);font-weight:700;font-size:clamp(26px,3.2vw,40px);margin:0;line-height:1.05;}
.subhead{font-family:var(--sans);color:var(--steel);font-size:14.5px;margin-top:8px;max-width:540px;}
.header-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;}

/* ===== Buttons ===== */
.btn{font-family:var(--mono);font-size:12.5px;background:transparent;border:1px solid var(--ink);color:var(--ink);padding:9px 16px;border-radius:2px;transition:all .15s ease;}
.btn:hover{background:var(--ink);color:var(--paper);}
.btn.primary{background:var(--ink);color:var(--paper);}
.btn.primary:hover{background:var(--seal-deep);border-color:var(--seal-deep);}
.btn.danger{border-color:var(--seal);color:var(--seal);}
.btn.danger:hover{background:var(--seal);color:#fff;}
.btn.small{padding:5px 10px;font-size:11px;}

/* ===== Upload screen ===== */
.center-screen{min-height:60vh;display:flex;align-items:center;justify-content:center;}
.dropzone{
  width:100%;max-width:560px;border:2px dashed var(--steel);background:#fff;
  padding:56px 36px;text-align:center;border-radius:4px;transition:border-color .15s ease, background .15s ease;
}
.dropzone.drag{border-color:var(--seal);background:#FBF3F1;}
.dropzone h2{font-family:var(--serif);font-size:22px;margin:0 0 8px;}
.dropzone p{color:var(--steel);font-size:14px;margin:0 0 22px;}
.dropzone input[type=file]{display:none;}
.file-hint{font-family:var(--mono);font-size:11px;color:var(--steel);margin-top:18px;}

/* ===== Mapping screen ===== */
.step-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--steel);margin-bottom:6px;}
.step-title{font-family:var(--serif);font-size:22px;font-weight:600;margin:0 0 18px;}
.sheet-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px;}
.grid-scroll{max-height:340px;overflow:auto;border:1px solid var(--line);background:#fff;margin-bottom:22px;}
table.preview{border-collapse:collapse;font-family:var(--mono);font-size:12px;width:100%;}
table.preview td, table.preview th{border:1px solid var(--line);padding:5px 9px;white-space:nowrap;}
table.preview th{background:var(--paper-deep);position:sticky;top:0;text-align:left;color:var(--steel);}
table.preview tr.rownum td:first-child, table.preview th:first-child{position:sticky;left:0;background:var(--paper-deep);color:var(--steel);text-align:center;}
table.preview tr.header-row-selected td{background:#FBEFD9;}
table.preview tr.clickable-row:hover td{background:#F4F1EA;cursor:pointer;}
table.preview tr.header-row-selected:hover td{background:#FBEFD9;}

.mapping-panel{background:#fff;border:1px solid var(--line);padding:22px;margin-bottom:22px;}
.mapping-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;}
.map-field label{display:block;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--steel);margin-bottom:6px;}
.map-field label .req{color:var(--seal);}
.map-field select{width:100%;padding:8px 10px;font-family:var(--sans);font-size:13.5px;border:1px solid var(--ink);background:#fff;color:var(--ink);border-radius:2px;}
.mapping-actions{display:flex;justify-content:space-between;align-items:center;margin-top:8px;}
.note{font-family:var(--mono);font-size:11.5px;color:var(--steel);}

/* ===== App shell / tabs ===== */
.view-tabs{display:flex;gap:8px;margin-bottom:26px;}
.view-tab{font-family:var(--mono);font-size:12.5px;background:transparent;border:1px solid var(--ink);color:var(--ink);padding:8px 18px;border-radius:2px;}
.view-tab.active{background:var(--ink);color:var(--paper);}

/* ===== Stamp + KPI (dashboard) ===== */
.top-grid{display:grid;grid-template-columns:200px 1fr;gap:36px;margin-bottom:8px;align-items:center;}
@media (max-width:760px){ .top-grid{grid-template-columns:1fr;} .stamp{margin:0 auto;} }
.stamp{
  width:176px;height:176px;border-radius:50%;border:3px double var(--seal);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  transform:rotate(-7deg);color:var(--seal);font-family:var(--mono);text-align:center;
  position:relative;mix-blend-mode:multiply;transition:color .3s ease;filter:saturate(1.05);
}
.stamp::before{content:'';position:absolute;inset:8px;border:1px solid currentColor;border-radius:50%;opacity:.55;}
.stamp.good{color:var(--good);}
.stamp.amber{color:var(--amber);}
.stamp .pct{font-size:34px;font-weight:600;letter-spacing:-1px;}
.stamp .lbl{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;margin-top:2px;}
.stamp .verdict{font-size:12px;letter-spacing:.2em;margin-top:6px;font-weight:600;text-transform:uppercase;border-top:1px solid currentColor;padding-top:5px;width:70%;}

.kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
.kpi{padding:6px 22px;border-left:1px solid var(--line);}
.kpi:first-child{border-left:none;padding-left:0;}
.kpi .k-label{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--steel);}
.kpi .k-value{font-family:var(--serif);font-size:30px;font-weight:600;margin-top:4px;color:var(--ink);}
.kpi .k-value.seal{color:var(--seal);}
.kpi .k-value.good{color:var(--good);}
.kpi .k-sub{font-family:var(--mono);font-size:11px;color:var(--steel);margin-top:2px;}
@media (max-width:760px){ .kpi-row{grid-template-columns:repeat(2,1fr);} .kpi{border-left:none;border-top:1px solid var(--line);padding:14px 0;} .kpi:nth-child(2n){padding-left:22px;} }

.filters{display:flex;gap:8px;flex-wrap:wrap;margin:34px 0 26px;align-items:center;}
.filters .group-label{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--steel);margin-right:6px;}
.tab{font-family:var(--mono);font-size:12.5px;background:transparent;border:1px solid var(--ink);color:var(--ink);padding:7px 15px;border-radius:2px;transition:all .15s ease;}
.tab:hover{background:var(--ink);color:var(--paper);}
.tab.active{background:var(--ink);color:var(--paper);box-shadow:3px 3px 0 var(--line);}

.panels{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;margin-bottom:8px;}
@media (max-width:900px){ .panels{grid-template-columns:1fr;} }
.panel{background:#fff;border:1px solid var(--line);padding:20px 20px 12px;}
.panel h2{font-family:var(--serif);font-size:16.5px;margin:0 0 2px;font-weight:600;}
.panel .cap{font-family:var(--mono);font-size:10.5px;color:var(--steel);margin-bottom:14px;text-transform:uppercase;letter-spacing:.06em;}
.chart-holder{position:relative;height:260px;}

.ledger-wrap{background:#fff;border:1px solid var(--line);margin-top:26px;overflow-x:auto;}
.ledger-head{display:flex;justify-content:space-between;align-items:center;padding:16px 20px 0;flex-wrap:wrap;gap:10px;}
.ledger-head h2{font-family:var(--serif);font-size:16.5px;margin:0;font-weight:600;}
table.ledger{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12.5px;margin-top:14px;min-width:760px;}
table.ledger thead th{text-align:left;font-family:var(--sans);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--steel);border-bottom:2px solid var(--ink);padding:9px 16px 8px;}
table.ledger tbody td{padding:8px 16px;border-bottom:1px solid var(--line);}
table.ledger tbody tr:hover{background:var(--paper);}
td.num, th.num{text-align:right;}
.badge{display:inline-block;padding:1px 8px;border-radius:10px;font-size:11px;font-weight:600;}
.badge.good{background:#E4EFE8;color:var(--good);}
.badge.amber{background:#F5E9D4;color:var(--amber);}
.badge.bad{background:#F3DFDC;color:var(--seal-deep);}
.month-group td{font-family:var(--sans);font-weight:700;font-size:12px;background:var(--paper-deep);color:var(--ink);text-transform:uppercase;letter-spacing:.05em;}

/* ===== Data (edit) view ===== */
.data-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:10px;}
table.editable{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12.5px;background:#fff;border:1px solid var(--line);}
table.editable thead th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--steel);border-bottom:2px solid var(--ink);padding:9px 12px;background:var(--paper-deep);}
table.editable tbody td{padding:6px 12px;border-bottom:1px solid var(--line);}
table.editable tbody tr:hover{background:var(--paper);}
[contenteditable="true"]{outline:none;border-bottom:1px dashed transparent;min-width:40px;display:inline-block;}
[contenteditable="true"]:focus{border-bottom:1px dashed var(--seal);background:#FBF3F1;}
.row-actions button{margin-right:4px;}

footer{margin-top:40px;font-family:var(--mono);font-size:11px;color:var(--steel);text-align:center;}

/* ===== Print / PDF ===== */
@media print{
  body{background:#fff;}
  .header-actions, .view-tabs, .filters, footer{display:none !important;}
  #viewData{display:none !important;}
  .wrap{max-width:none;padding:0;}
  .panel, .ledger-wrap, .kpi{box-shadow:none;}
  .stamp{mix-blend-mode:normal;}
  .panels{grid-template-columns:1fr 1fr;}
  table.ledger{font-size:10.5px;}
}