/* Industrial Materials & Dependency Register — plain government-register aesthetic */
* { box-sizing: border-box; }
html { font-size: 15px; }
body {
  margin: 0; color: #1b1b1b; background: #fff;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 1.5;
}
.notice-bar {
  background: #f0f0f0; border-bottom: 1px solid #dfe1e2;
  font-size: 12px; color: #5c5c5c; padding: 4px 16px;
}
header.masthead { background: #112e51; color: #fff; padding: 18px 16px 14px; }
header.masthead .inner, .notice-bar .inner, main, nav.crumbs .inner, footer .inner {
  max-width: 1100px; margin: 0 auto;
}
header.masthead h1 { margin: 0; font-size: 21px; font-weight: 700; letter-spacing: .02em; }
header.masthead h1 a { color: #fff; text-decoration: none; }
header.masthead .sub { font-size: 12.5px; color: #aeb0b5; margin-top: 2px; }
nav.sitenav { background: #205493; }
nav.sitenav .inner { max-width: 1100px; margin: 0 auto; display: flex; flex-wrap: wrap; }
nav.sitenav a {
  color: #fff; text-decoration: none; padding: 8px 14px; font-size: 13.5px;
  border-right: 1px solid #2e6bad;
}
nav.sitenav a:hover, nav.sitenav a.active { background: #112e51; }
main { padding: 20px 16px 60px; }
h2 { font-size: 19px; border-bottom: 2px solid #112e51; padding-bottom: 4px; margin: 28px 0 10px; }
h2:first-child { margin-top: 4px; }
h3 { font-size: 15.5px; margin: 22px 0 6px; color: #112e51; }
a { color: #005ea2; }
a:visited { color: #54278f; }
.kicker { font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em; color: #5c5c5c; margin: 0 0 2px; }
.muted { color: #5c5c5c; font-size: 13px; }
.small { font-size: 12.5px; }

table.data { border-collapse: collapse; width: 100%; font-size: 13.5px; margin: 8px 0 16px; }
table.data th, table.data td { border: 1px solid #dfe1e2; padding: 4px 8px; text-align: left; vertical-align: top; }
table.data th { background: #f0f0f0; font-weight: 600; }
table.data td.num, table.data th.num { text-align: right; font-variant-numeric: tabular-nums; }
table.data tr:nth-child(even) td { background: #fafafa; }
table.data tr.group-row td { background: #e8eef5; font-weight: 700; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
table.data td.pos { color: #2e8540; }
table.data td.neg { color: #cd2026; }

.searchbox { display: flex; gap: 0; margin: 10px 0 4px; max-width: 560px; position: relative; }
.searchbox input {
  flex: 1; font-size: 15px; padding: 7px 10px; border: 1px solid #5c5c5c; border-right: 0;
}
.searchbox button {
  background: #005ea2; color: #fff; border: 0; padding: 7px 18px; font-size: 15px; cursor: pointer;
}
.search-results {
  position: absolute; top: 100%; left: 0; right: 0; background: #fff;
  border: 1px solid #5c5c5c; border-top: 0; z-index: 50; max-height: 420px; overflow: auto;
}
.search-results a { display: block; padding: 6px 10px; text-decoration: none; font-size: 13.5px; border-bottom: 1px solid #eee; }
.search-results a:hover { background: #e1f3f8; }
.search-results .tag { color: #5c5c5c; font-size: 11.5px; }

.tagchip {
  display: inline-block; font-size: 12px; padding: 1px 8px; margin: 2px 3px 2px 0;
  border: 1px solid #aeb0b5; border-radius: 2px; text-decoration: none; background: #f0f0f0;
}
.tagchip.produces { background: #e7f4e4; border-color: #94bfa2; }
.tagchip.consumes { background: #e1f3f8; border-color: #99deea; }

.statgrid { display: flex; flex-wrap: wrap; gap: 12px; margin: 12px 0; }
.stat { border: 1px solid #dfe1e2; padding: 10px 14px; min-width: 170px; background: #fafafa; }
.stat .v { font-size: 21px; font-weight: 700; color: #112e51; font-variant-numeric: tabular-nums; }
.stat .l { font-size: 12px; color: #5c5c5c; }

.cols { display: flex; gap: 28px; flex-wrap: wrap; }
.cols > div { flex: 1; min-width: 320px; }

.chart-box { border: 1px solid #dfe1e2; padding: 10px; margin: 10px 0; background: #fff; }
.chart-box .title { font-size: 13px; font-weight: 600; margin-bottom: 4px; }
.legend { font-size: 12px; margin: 4px 0; }
.legend span.swatch { display: inline-block; width: 11px; height: 11px; margin: 0 4px 0 12px; vertical-align: -1px; }

ul.plain { list-style: none; padding-left: 0; }
ul.tree, ul.tree ul { list-style: none; padding-left: 20px; border-left: 1px dotted #aeb0b5; }
ul.tree { padding-left: 0; border-left: 0; }
ul.tree li { padding: 1px 0; font-size: 13.5px; }

.dep-level { margin: 4px 0 10px 0; }
.dep-level .lvl { font-size: 11px; text-transform: uppercase; color: #5c5c5c; letter-spacing: .06em; }

footer { border-top: 3px solid #112e51; margin-top: 40px; background: #f0f0f0; }
footer .inner { padding: 16px; font-size: 12.5px; color: #5c5c5c; }
footer .inner > div { margin-bottom: 5px; }

/* generated/AI data marker — used wherever modeled data is shown next to measured data */
.gen-tag { display: inline-block; font-size: 10.5px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .03em; color: #7a4d00; background: #fdf3e1; border: 1px solid #e2c58a;
  border-radius: 2px; padding: 0 4px; vertical-align: 1px; }
.src-note { font-size: 12px; color: #5c5c5c; margin: 4px 0 0; }
.src-note a { color: #005ea2; }
/* provenance table on the methodology page */
table.provenance td { vertical-align: top; }
table.provenance .badge { font-size: 10.5px; font-weight: 600; text-transform: uppercase; padding: 1px 5px; border-radius: 2px; white-space: nowrap; }
.badge.measured { color: #1e5c2e; background: #e6f2e9; border: 1px solid #9ccda9; }
.badge.generated { color: #7a4d00; background: #fdf3e1; border: 1px solid #e2c58a; }
.badge.editorial { color: #2a3f6b; background: #e9eef7; border: 1px solid #a9bce0; }
.refs { font-size: 13.5px; }
.refs li { margin-bottom: 9px; }

input[type=text], select { font-family: inherit; }
.biginput { font-size: 18px; padding: 8px 10px; border: 1px solid #5c5c5c; width: 260px; }
.btn { background: #005ea2; color: #fff; border: 0; padding: 9px 18px; font-size: 15px; cursor: pointer; }

.bar-cell { min-width: 220px; }
.bar { height: 11px; background: #005ea2; display: inline-block; vertical-align: middle; }
.bar.over { background: #94bfa2; }

.catchip {
  display: inline-block; font-size: 10.5px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .04em; padding: 1px 7px; margin-right: 7px; border-radius: 2px;
  border: 1px solid #aeb0b5; background: #f0f0f0; color: #3d4551; white-space: nowrap;
  vertical-align: 1px;
}
.catchip.cat-total { background: #f0f0f0; border-color: #aeb0b5; }
.catchip.cat-industry { background: #e1f3f8; border-color: #99deea; }
.catchip.cat-material-rev { background: #e7f4e4; border-color: #94bfa2; }
.catchip.cat-material-capex { background: #fff1d2; border-color: #fad980; }
.catchip.cat-company { background: #f3e6f5; border-color: #d5a6dd; }
.cat-legend { margin: 8px 0 14px 0; }
.cat-legend .catchip { margin: 2px 7px 2px 0; }

#graph-svg .node rect { fill: #f0f0f0; stroke: #aeb0b5; cursor: pointer; }
#graph-svg .node text { font-size: 10.5px; cursor: pointer; }
#graph-svg .node.raw rect { fill: #e7f4e4; }
#graph-svg .node.intermediate rect { fill: #e1f3f8; }
#graph-svg .node.downstream rect { fill: #fff1d2; }
#graph-svg .node.selected rect { stroke: #112e51; stroke-width: 2.5; fill: #ffd97d; }
#graph-svg .node.up rect { stroke: #2e8540; stroke-width: 2; }
#graph-svg .node.down rect { stroke: #cd2026; stroke-width: 2; }
#graph-svg .node.dim { opacity: .25; }
#graph-svg path.edge { stroke: #aeb0b5; stroke-width: 1; fill: none; opacity: .55; }
#graph-svg path.edge.up { stroke: #2e8540; stroke-width: 2; opacity: 1; }
#graph-svg path.edge.down { stroke: #cd2026; stroke-width: 2; opacity: 1; }
#graph-svg path.edge.dim { opacity: .08; }

svg rect.hovcol:hover { fill: rgba(0, 94, 162, .07); }

.heatboard { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 6px; }
.heatboard a.tile {
  display: block; width: 132px; padding: 7px 9px; border: 1px solid #dfe1e2;
  text-decoration: none; color: #1b1b1b; background: #fafafa;
}
.heatboard a.tile:hover { outline: 2px solid #112e51; outline-offset: -1px; }
.heatboard .tile .nm { font-size: 12px; font-weight: 600; line-height: 1.25; min-height: 30px; }
.heatboard .tile .ch { font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; }
.heatboard .tile .un { font-size: 10px; color: #3d4551; }
.heat-controls { font-size: 13px; margin: 8px 0 2px; }
.heat-controls a { margin-right: 10px; }

.hover-tip {
  position: fixed; background: #fff; border: 1px solid #5c5c5c; padding: 6px 10px;
  font-size: 12px; line-height: 1.45; box-shadow: 0 2px 6px rgba(0,0,0,.18); z-index: 60;
  pointer-events: none; max-width: 280px;
}
.hover-tip .muted { color: #5c5c5c; }
.corr-matrix td { padding: 1px 3px !important; font-size: 10.5px; text-align: center; cursor: pointer; }
.corr-matrix td[data-tip]:hover { outline: 2px solid #1b1b1b; outline-offset: -2px; }
.corr-matrix th { font-size: 10px; }
.corr-matrix th.rot { height: 110px; white-space: nowrap; vertical-align: bottom; }
.corr-matrix th.rot > div { transform: rotate(-60deg); transform-origin: bottom left; width: 18px; }
