:root {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color-scheme: light;
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-soft: #f8fafc;
  --surface-strong: #101828;
  --text: #162033;
  --text-muted: #667085;
  --text-soft: #98a2b3;
  --border: #e3e8ef;
  --border-soft: #eaecf0;
  --button-soft: #eef2f6;
  --button-soft-hover: #e4e7ec;
  --input-bg: #ffffff;
  --shadow: 0 8px 30px rgba(16,24,40,.04);
  --good-bg: #ecfdf3;
  --good-text: #067647;
  --good-border: #abefc6;
  --warn-bg: #fffaeb;
  --warn-text: #93370d;
  --warn-border: #fedf89;
  --error-bg: #fef3f2;
  --error-text: #b42318;
  --error-border: #fecdca;
  --danger: #b42318;
  --danger-bg: #fef3f2;
  --kpi-text: #ffffff;
  --kpi-muted: #cbd5e1;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b111c;
  --surface: #121a27;
  --surface-soft: #172132;
  --surface-strong: #eaf0f7;
  --text: #eef3f8;
  --text-muted: #9ca9bb;
  --text-soft: #738197;
  --border: #263247;
  --border-soft: #202c3d;
  --button-soft: #1b2738;
  --button-soft-hover: #243248;
  --input-bg: #0f1724;
  --shadow: 0 12px 34px rgba(0,0,0,.22);
  --good-bg: #0f2d23;
  --good-text: #73e2b4;
  --good-border: #1f6b50;
  --warn-bg: #33280f;
  --warn-text: #f9cd68;
  --warn-border: #6e561d;
  --error-bg: #351718;
  --error-text: #ff9d99;
  --error-border: #793536;
  --danger: #ff9d99;
  --danger-bg: #351718;
  --kpi-text: #101828;
  --kpi-muted: #344054;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: var(--bg); color: var(--text); transition: background-color .18s ease, color .18s ease; }
button, input { font: inherit; }
.shell { width: min(1180px, calc(100% - 32px)); margin: 34px auto 70px; }
.topbar { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; margin-bottom:22px; }
.top-actions { display:flex; align-items:center; justify-content:flex-end; gap:9px; flex-wrap:wrap; }
h1 { margin:4px 0 6px; font-size:34px; letter-spacing:-0.04em; }
h2 { margin:3px 0 0; font-size:20px; }
p { margin:0; color:var(--text-muted); }
.eyebrow { font-size:11px; letter-spacing:.14em; font-weight:800; color:var(--text-muted); }
.panel { background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:22px; box-shadow:var(--shadow); margin-bottom:18px; }
.status-pill { border:1px solid var(--border); background:var(--surface); border-radius:999px; padding:9px 13px; font-size:13px; color:var(--text-muted); white-space:nowrap; }
.status-pill.good { color:var(--good-text); background:var(--good-bg); border-color:var(--good-border); }
.status-pill.warn { color:var(--warn-text); background:var(--warn-bg); border-color:var(--warn-border); }
.segmented { display:inline-flex; padding:3px; gap:2px; border:1px solid var(--border); background:var(--surface); border-radius:10px; }
.segment { min-width:40px; border:0; border-radius:7px; background:transparent; color:var(--text-muted); padding:6px 8px; font-size:12px; font-weight:800; cursor:pointer; }
.segment.active { background:var(--button-soft); color:var(--text); }
.theme-toggle { border:1px solid var(--border); background:var(--surface); color:var(--text); border-radius:10px; padding:8px 10px; font-size:12px; font-weight:800; cursor:pointer; white-space:nowrap; }
.theme-toggle:hover { background:var(--surface-soft); }
.week-grid { display:grid; grid-template-columns:repeat(2,minmax(0,220px)); gap:14px; margin-bottom:18px; }
label { display:flex; flex-direction:column; gap:7px; font-size:13px; font-weight:700; color:var(--text); }
input[type="date"] { padding:11px 12px; border:1px solid var(--border); border-radius:10px; background:var(--input-bg); color:var(--text); }
.drop-zone { min-height:170px; border:2px dashed #78879d; border-radius:16px; display:flex; align-items:center; justify-content:center; text-align:center; padding:28px; cursor:pointer; background:var(--surface-soft); transition:.18s ease; }
.drop-zone:hover, .drop-zone.drag { border-color:var(--text-muted); filter:brightness(.99); }
.drop-zone strong { font-size:18px; color:var(--text); }
.drop-zone span { font-weight:400; color:var(--text-muted); margin-top:5px; }
.file-list { display:grid; gap:9px; margin-top:16px; }
.file-list.empty { color:var(--text-soft); font-size:13px; }
.file-card { display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:12px; background:var(--surface-soft); border:1px solid var(--border-soft); border-radius:12px; padding:11px 13px; }
.file-card.error-card { background:var(--error-bg); border-color:var(--error-border); }
.file-card strong { font-size:14px; display:block; }
.file-card small { color:var(--text-muted); display:block; margin-top:2px; }
.badge { font-size:12px; font-weight:800; border-radius:999px; padding:5px 9px; background:var(--good-bg); color:var(--good-text); white-space:nowrap; }
.badge.error { background:var(--error-bg); color:var(--error-text); }
.icon-button { width:32px; height:32px; border:0; border-radius:8px; background:var(--button-soft); color:var(--text-muted); cursor:pointer; font-weight:900; }
.icon-button:hover { background:var(--button-soft-hover); }
.upload-notices { display:grid; gap:7px; margin-top:14px; }
.upload-notices.hidden, .hidden { display:none !important; }
.upload-notice { border-radius:10px; padding:9px 11px; font-size:12px; background:var(--warn-bg); color:var(--warn-text); border:1px solid var(--warn-border); }
.actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-top:18px; }
.button { border:0; border-radius:11px; padding:11px 16px; font-weight:800; cursor:pointer; transition:transform .1s ease, opacity .15s ease; }
.button:hover:not(:disabled) { transform:translateY(-1px); }
.button:disabled { opacity:.45; cursor:not-allowed; }
.button.primary { background:var(--surface-strong); color:var(--bg); }
.button.secondary { background:var(--button-soft); color:var(--text); }
.button.success { background:#067647; color:white; }
.button.danger { background:var(--danger-bg); color:var(--danger); border:1px solid var(--error-border); }
.results.hidden { display:none; }
.result-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:0 2px 12px; }
.result-toolbar > div:first-child { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.toolbar-actions { display:flex; align-items:center; gap:8px; }
.mode-pill { font-size:12px; font-weight:800; border-radius:999px; padding:6px 10px; background:var(--button-soft); color:var(--text); }
.mode-pill.saved { background:var(--good-bg); color:var(--good-text); }
#resultPeriod { font-size:13px; color:var(--text-muted); }
.kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:18px; }
.kpi { background:var(--surface-strong); color:var(--kpi-text); padding:18px; border-radius:16px; min-height:105px; display:flex; flex-direction:column; justify-content:space-between; }
.kpi span { font-size:12px; color:var(--kpi-muted); }
.kpi strong { font-size:25px; letter-spacing:-.03em; }
.section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:14px; margin-bottom:15px; }
.section-head.compact { align-items:center; }
.note, .muted, .save-hint { color:var(--text-muted); font-size:12px; }
.selection-summary { color:var(--text-muted); font-size:13px; font-weight:700; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; min-width:720px; }
th { text-align:left; color:var(--text-muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em; border-bottom:1px solid var(--border-soft); padding:9px 10px; }
td { padding:12px 10px; border-bottom:1px solid var(--border-soft); font-size:14px; }
td.money { font-variant-numeric:tabular-nums; }
td.strong { font-weight:800; }
.warnings { display:grid; gap:9px; }
.warning { border-radius:11px; padding:11px 12px; font-size:13px; background:var(--warn-bg); color:var(--warn-text); border:1px solid var(--warn-border); }
.warning.error { background:var(--error-bg); color:var(--error-text); border-color:var(--error-border); }
.warning.ok { background:var(--good-bg); color:var(--good-text); border-color:var(--good-border); }
.save-panel { display:flex; align-items:center; justify-content:space-between; gap:18px; background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:18px 22px; box-shadow:var(--shadow); margin-bottom:18px; }
.save-panel.saved { border-color:var(--good-border); background:var(--good-bg); }
.save-panel.warning { border-color:var(--warn-border); background:var(--warn-bg); }
.save-panel strong { display:block; margin-bottom:3px; }
.history-panel { margin-top:30px; }
.text-button { background:none; border:0; color:var(--text-muted); font-weight:800; cursor:pointer; }
.history-list { display:grid; }
.history-row { display:grid; grid-template-columns:1.35fr .85fr .85fr .85fr auto; gap:12px; align-items:center; padding:13px 0; border-bottom:1px solid var(--border-soft); font-size:13px; }
.history-row strong { display:block; }
.history-row .history-metric span { display:block; color:var(--text-muted); font-size:11px; margin-bottom:2px; }
.history-actions { display:flex; gap:7px; align-items:center; }
.history-open, .history-delete { border:1px solid var(--border); background:var(--surface); color:var(--text); border-radius:9px; padding:8px 11px; font-size:12px; font-weight:800; cursor:pointer; }
.history-open:hover { background:var(--surface-soft); }
.history-delete { color:var(--danger); border-color:var(--error-border); background:var(--danger-bg); }
.history-delete:hover { filter:brightness(.98); }

@media (max-width: 1000px) { .topbar { flex-direction:column; } .top-actions { width:100%; justify-content:flex-start; } }
@media (max-width: 900px) { .history-row { grid-template-columns:1.3fr 1fr 1fr auto; } .history-row .history-metric:nth-of-type(3) { display:none; } }
@media (max-width: 800px) { .kpis { grid-template-columns:repeat(2,1fr); } .week-grid { grid-template-columns:1fr 1fr; } .result-toolbar, .save-panel { align-items:stretch; flex-direction:column; } .toolbar-actions { justify-content:flex-end; } }
@media (max-width: 620px) { .history-row { grid-template-columns:1fr auto; } .history-row .history-metric { display:none; } .file-card { grid-template-columns:1fr auto; } .file-card .badge { display:none; } }
@media (max-width: 520px) { .shell { width:min(100% - 18px,1180px); margin-top:16px; } .panel { padding:16px; border-radius:14px; } .kpis, .week-grid { grid-template-columns:1fr; } h1 { font-size:29px; } .actions, .toolbar-actions { align-items:stretch; flex-direction:column; } .button { width:100%; } .top-actions { align-items:stretch; } .status-pill, .theme-toggle { text-align:center; } }

.app-nav { display:flex; gap:8px; margin:0 0 18px; flex-wrap:wrap; }
.nav-button { border:1px solid var(--border); background:var(--surface); color:var(--text-muted); border-radius:11px; padding:9px 13px; font-size:13px; font-weight:800; cursor:pointer; }
.nav-button.active { background:var(--surface-strong); color:var(--bg); border-color:var(--surface-strong); }
.view-section.hidden { display:none !important; }
.file-card { grid-template-columns:1fr auto auto auto; }
.review-button { border:1px solid var(--border); background:var(--surface); color:var(--text); border-radius:8px; padding:7px 10px; font-size:12px; font-weight:800; cursor:pointer; }
.file-audit { margin-top:9px; border:1px solid var(--border-soft); border-radius:12px; overflow:hidden; background:var(--surface-soft); }
.file-audit summary { cursor:pointer; padding:10px 12px; font-weight:800; font-size:13px; }
.audit-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:0 12px 12px; }
.audit-stat { background:var(--surface); border:1px solid var(--border-soft); border-radius:9px; padding:9px; }
.audit-stat span { display:block; color:var(--text-muted); font-size:10px; text-transform:uppercase; letter-spacing:.05em; }
.audit-stat strong { display:block; margin-top:3px; font-size:13px; }
.audit-table { width:100%; min-width:0; }
.audit-table th, .audit-table td { font-size:12px; padding:7px 8px; }
.subsection-title { margin:14px 12px 6px; font-size:12px; color:var(--text-muted); text-transform:uppercase; letter-spacing:.06em; font-weight:800; }
.manager-form { display:grid; grid-template-columns:140px minmax(220px,1fr) 160px 110px auto; gap:10px; align-items:end; }
.manager-form input[type="text"], .manager-form input[type="number"], .manager-form textarea { width:100%; border:1px solid var(--border); border-radius:10px; padding:10px 11px; background:var(--input-bg); color:var(--text); }
.checkbox-row { display:flex; flex-direction:row; align-items:center; gap:8px; min-height:41px; }
.manager-actions { display:flex; gap:7px; }
.manager-table table { min-width:760px; }
.rate-chip { display:inline-flex; align-items:center; border:1px solid var(--border); background:var(--surface-soft); border-radius:999px; padding:4px 8px; font-size:11px; font-weight:800; }
.parser-badge { font-size:11px; font-weight:800; border-radius:999px; padding:5px 8px; white-space:nowrap; }
.parser-badge.good { background:var(--good-bg); color:var(--good-text); }
.parser-badge.warn { background:var(--warn-bg); color:var(--warn-text); }
.parser-badge.error { background:var(--error-bg); color:var(--error-text); }
.tech-rate-details { margin-top:8px; }
.tech-rate-details summary { cursor:pointer; color:var(--text-muted); font-size:12px; font-weight:800; }
.mini-rates { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.modal-backdrop { position:fixed; inset:0; background:rgba(15,23,42,.55); display:flex; align-items:center; justify-content:center; padding:18px; z-index:999; }
.modal { width:min(640px,100%); max-height:90vh; overflow:auto; background:var(--surface); border:1px solid var(--border); border-radius:18px; box-shadow:0 24px 80px rgba(0,0,0,.28); padding:20px; }
.modal h3 { margin:2px 0 14px; }
.modal-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.modal-grid .full { grid-column:1/-1; }
.modal input[type="text"], .modal input[type="number"], .modal textarea { width:100%; border:1px solid var(--border); border-radius:10px; padding:10px 11px; background:var(--input-bg); color:var(--text); }
.modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }
.help-card { background:var(--surface-soft); border:1px solid var(--border-soft); border-radius:12px; padding:12px; color:var(--text-muted); font-size:13px; line-height:1.45; }
.empty-state { text-align:center; color:var(--text-muted); padding:24px 10px; }
.pill-row { display:flex; flex-wrap:wrap; gap:6px; }
@media (max-width: 900px) { .manager-form { grid-template-columns:1fr 1fr; } .manager-form .button { width:auto; } .audit-grid { grid-template-columns:1fr 1fr; } }
@media (max-width: 620px) { .manager-form, .audit-grid, .modal-grid { grid-template-columns:1fr; } .modal-grid .full { grid-column:auto; } .file-card { grid-template-columns:1fr auto; } .file-card .review-button { grid-column:1; width:max-content; } }
