:root {
  --steel-50:#f7f8fa; --steel-100:#edeff3; --steel-200:#dde1e8; --steel-300:#c1c8d4; --steel-400:#8d97a8; --steel-500:#647082; --steel-600:#4c5766; --steel-700:#3a4453; --steel-800:#232c38; --steel-900:#131a22;
  --ink-100:#d6ecf1; --ink-500:#1f7f96; --ink-600:#17667a; --ink-700:#175363;
  --brass-100:#f9edcb; --brass-500:#c58a1f; --brass-700:#855018;
  --moss-100:#d3f0dd; --moss-700:#1f663e; --ochre-100:#fbf0bd; --ochre-700:#8f5a10; --clay-100:#fbe0dd; --clay-700:#962d27;
  --bg:#fff; --bg-muted:var(--steel-50); --border:var(--steel-200); --text:var(--steel-900); --muted:var(--steel-600); --dimmed:#677384;
  --serif:"Source Serif 4",Georgia,serif; --sans:"Source Sans 3",system-ui,sans-serif;
  --r:4px; --r-control:6px; --r-card:9px;
}
* { box-sizing:border-box; }
html { font-size:18px; }
body { margin:0; background:var(--bg); color:var(--text); font:400 1rem/1.5 var(--sans); font-variant-numeric:tabular-nums; -webkit-font-smoothing:antialiased; }
::selection { background:var(--ink-100); }
h1,h2 { font-family:var(--serif); font-weight:600; margin:0; }
h1 { font-size:1.75rem; line-height:1.2; }
h2 { font-size:0.8125rem; font-family:var(--sans); font-weight:600; color:var(--muted); letter-spacing:0; margin:1.25rem 0 0.25rem; }
p { margin:0; }
button { font:inherit; color:inherit; background:none; border:0; cursor:pointer; border-radius:var(--r-control); }
button:focus-visible, input:focus-visible, select:focus-visible { outline:2px solid var(--ink-500); outline-offset:2px; }
input, select { font:inherit; color:inherit; background:var(--bg); border:1px solid var(--border); border-radius:var(--r-control); padding:0.2rem 0.5rem; min-width:0; }
input:hover, select:hover { border-color:var(--steel-300); }
input[type=number] { width:6.5rem; text-align:right; }
input[type=range] { accent-color:var(--ink-500); width:9rem; padding:0; border:0; }

.top { height:56px; display:flex; align-items:center; justify-content:space-between; padding:0 12px; border-bottom:1px solid var(--border); position:sticky; top:0; background:var(--bg); z-index:2; }
.brands { display:flex; align-items:center; gap:14px; }
.brands .aes { height:34px; width:auto; }
.brands .es { display:inline-flex; align-items:center; gap:8px; padding-left:14px; border-left:1px solid var(--border); font-family:var(--serif); font-weight:600; font-size:1rem; color:var(--ink-700); }
.steps { display:flex; gap:4px; }
.steps button { display:flex; align-items:center; gap:8px; padding:6px 10px; color:var(--muted); }
.steps button span { display:inline-grid; place-items:center; width:1.375rem; height:1.375rem; border-radius:50%; border:1px solid var(--steel-300); font-size:0.75rem; font-weight:600; }
.steps button:hover { background:var(--bg-muted); color:var(--text); }
.steps button[aria-current] { color:var(--ink-600); font-weight:600; }
.steps button[aria-current] span { background:var(--ink-500); border-color:var(--ink-500); color:#fff; }

main { max-width:1120px; margin:0 auto; padding:24px 12px 48px; }
.page-head { max-width:62ch; margin-bottom:24px; }
.page-head p { color:var(--muted); margin-top:0.5rem; }
.page-foot { display:flex; justify-content:space-between; align-items:center; margin-top:32px; padding-top:16px; border-top:1px solid var(--border); }
.primary { background:var(--ink-500); color:#fff; padding:0.45rem 1rem; font-weight:600; }
.primary:hover { background:var(--ink-600); }
.ghost { color:var(--muted); padding:0.45rem 0.75rem; }
.ghost:hover { background:var(--bg-muted); color:var(--text); }

.worksheet { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:32px; align-items:start; }
.inputs h2:first-child { margin-top:0; }
.row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:0.45rem 0; border-bottom:1px solid var(--border); }
.row > span:first-child { color:var(--text); }
.field { display:inline-flex; align-items:center; gap:8px; }
.field em { font-style:normal; color:var(--dimmed); font-size:0.875rem; min-width:3.5rem; }
.field output { min-width:2.5rem; text-align:right; font-weight:600; }

.tiles { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.tile { border:1px solid var(--border); border-radius:var(--r-card); padding:12px 14px; background:var(--bg); }
.tile-head { display:flex; justify-content:space-between; align-items:center; gap:8px; color:var(--muted); font-size:0.875rem; }
.tile strong { display:block; font-family:var(--serif); font-size:2rem; line-height:1.1; margin:0.35rem 0 0.15rem; }
.tile strong i { font-style:normal; font-family:var(--sans); font-size:0.875rem; color:var(--muted); font-weight:400; }
.tile small { color:var(--dimmed); font-size:0.8125rem; }
.badge { font-size:0.6875rem; font-weight:600; padding:2px 8px; border-radius:12px; text-transform:none; }
.badge.ok { background:var(--moss-100); color:var(--moss-700); }
.badge.warning { background:var(--ochre-100); color:var(--ochre-700); }
.badge.critical { background:var(--clay-100); color:var(--clay-700); }
.badge.none { background:var(--steel-100); color:var(--steel-700); }

table { border-collapse:collapse; width:100%; }
.chain { margin-top:16px; }
.chain th { text-align:left; font-weight:400; padding:0.4rem 0; border-bottom:1px solid var(--border); }
.chain sup { font-size:0.6875rem; color:var(--dimmed); margin-left:2px; }
.chain td { padding:0.4rem 0; border-bottom:1px solid var(--border); text-align:right; white-space:nowrap; }
.chain .total th, .chain .total td { border-bottom:0; padding-top:0.6rem; }
.chain .total td { font-family:var(--serif); font-size:1.5rem; font-weight:600; color:var(--clay-700); }
.notes { margin:16px 0 0; padding-left:1.1rem; color:var(--dimmed); font-size:0.8125rem; line-height:1.5; }
.notes li { padding-left:4px; }
.page-notes { margin-top:32px; max-width:72ch; }
.aside { color:var(--muted); font-size:0.9375rem; }

.services { list-style:none; margin:0; padding:0; border-top:1px solid var(--border); }
.services li { display:grid; grid-template-columns:1.5rem minmax(0,1fr) 12rem; gap:16px; align-items:start; padding:12px 8px; border-bottom:1px solid var(--border); border-radius:var(--r-control); }
.services li:hover { background:var(--bg-muted); }
.services li.on { background:var(--ink-100); }
.services input[type=checkbox] { width:1.1rem; height:1.1rem; margin:0.2rem 0 0; accent-color:var(--ink-500); }
.services b { display:block; font-weight:600; }
.services small { color:var(--muted); font-size:0.9375rem; display:block; }
.services .effect { font-size:0.9375rem; color:var(--text); padding-top:0.1rem; }
.services .effect.none { color:var(--dimmed); }
.strip { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:16px; padding:12px 0 0; border-top:2px solid var(--steel-800); }
.strip span { display:block; color:var(--muted); font-size:0.875rem; }
.strip strong { font-family:var(--serif); font-size:1.5rem; font-weight:600; }

.delta table { max-width:760px; }
.delta td { white-space:nowrap; }
.delta th, .delta td { padding:0.45rem 0 0.45rem 20px; border-bottom:1px solid var(--border); text-align:right; }
.delta th:first-child, .delta td:first-child { padding-left:0; }
.delta th:first-child, .delta td:first-child { text-align:left; font-weight:400; }
.delta thead th { color:var(--muted); font-weight:600; font-size:0.875rem; }
.delta td:last-child { font-weight:600; }
.nb { white-space:nowrap; }
.charts { display:grid; grid-template-columns:1fr 1fr; gap:24px 32px; margin-top:32px; align-items:start; }
.charts .wide { grid-column:1 / -1; }
.cost { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:8px; padding-top:8px; border-top:1px solid var(--border); }
.cost input { width:7rem; text-align:right; }
figure { margin:0; }
figcaption b { display:block; font-weight:600; }
figcaption span { color:var(--muted); font-size:0.875rem; }
.chart { margin-top:8px; }
.chart svg { width:100%; height:auto; display:block; font-family:var(--sans); }
.chart text { fill:var(--muted); font-size:12px; }
.chart .grid { stroke:var(--steel-200); }
.chart .axis { stroke:var(--steel-300); }
.chart .rule { stroke:var(--steel-500); stroke-dasharray:3 4; }
.chart .s-read { stroke:#1f7f96; fill:none; stroke-width:2; }
.chart .s-repeat { stroke:#1f7f96; fill:none; stroke-width:2; stroke-dasharray:4 4; }
.chart .s-after { stroke:#c58a1f; fill:none; stroke-width:2; }
.chart .s-cost { stroke:var(--steel-500); fill:none; stroke-width:1.5; stroke-dasharray:3 4; }
.chart .fill { fill:#c58a1f; opacity:0.12; }
.chart .band { fill:#c58a1f; opacity:0.18; }
.chart .mark { fill:#fff; stroke-width:2; }
.chart .label { fill:var(--text); font-weight:600; }
.chart .legend text { fill:var(--text); }
.chart .hover line { stroke:var(--steel-400); }
.chart .hover text { fill:var(--text); font-weight:600; }

.report { display:none; }

@media (max-width:900px) {
  html { font-size:16px; }
  .top { height:auto; flex-wrap:wrap; gap:8px; padding:8px 12px; }
  .steps { flex-wrap:wrap; }
  .steps button { padding:4px 6px; font-size:0.875rem; }
  .delta th, .delta td { padding-left:10px; font-size:0.9375rem; }
  .worksheet, .charts { grid-template-columns:minmax(0,1fr); }
  .charts .wide { grid-column:auto; }
  .tiles { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .row > span:first-child, .field { min-width:0; }
  .chain { table-layout:fixed; }
  .chain td { white-space:normal; }
  .row { flex-wrap:wrap; }
  .row > span:first-child { flex:1 1 55%; }
  .field { flex:1 1 auto; justify-content:flex-end; }
  .field em { min-width:0; }
  input[type=number] { width:5.5rem; }
  input[name=plant], input[name=unit] { width:11rem; }
  .chain th { width:55%; }
  .delta td { white-space:normal; }
  .services li { grid-template-columns:1.5rem minmax(0,1fr); }
  .services .effect { grid-column:2; justify-self:start; }
  .strip { grid-template-columns:1fr 1fr; }
}

@media print {
  @page { size:letter; margin:0.6in; }
  html { font-size:11pt; }
  body { color:#000; }
  .top, main { display:none; }
  .report { display:block; }
  .report header { display:flex; justify-content:space-between; align-items:flex-end; padding-bottom:10pt; border-bottom:1px solid #000; }
  .report .brands { gap:10pt; }
  .report .brands img { height:28pt; width:auto; }
  .report .brands span { font-family:var(--serif); font-weight:600; color:#000; }
  .report .meta { text-align:right; }
  .report .meta b { display:block; font-family:var(--serif); font-size:16pt; }
  .report .meta span { display:block; color:#333; font-size:10pt; }
  .report h2 { font-family:var(--serif); font-size:13pt; color:#000; margin:16pt 0 6pt; }
  .r-table th, .r-table td { padding:3pt 0; border-bottom:1px solid #ccc; text-align:right; vertical-align:top; font-size:10pt; }
  .r-table th, .r-table td:first-child { font-weight:400; text-align:left; }
  .r-table thead th { font-weight:600; color:#333; }
  .r-table td.what { text-align:left; color:#333; padding:3pt 8pt; }
  .r-table tfoot th, .r-table tfoot td { border-bottom:0; font-weight:600; border-top:1px solid #000; }
  .r-table td.strong { font-weight:600; }
  .r-charts { display:grid; grid-template-columns:1fr 1fr; gap:16pt; margin-top:12pt; break-inside:avoid; }
  .r-charts b { font-size:10pt; }
  .r-charts .chart text { font-size:9pt; }
  .report ul { margin:0; padding-left:14pt; font-size:9.5pt; color:#333; }
  .r-foot { margin-top:14pt; font-size:9pt; color:#555; border-top:1px solid #ccc; padding-top:6pt; }
  .chart .s-read { stroke:#175363; }
  .chart .s-after { stroke:#855018; }
}