:root {
  --bg: #07111f;
  --panel: #0f1d2e;
  --panel-2: #14263a;
  --line: #294056;
  --text: #f4f7fb;
  --muted: #9eb0c2;
  --cyan: #19c3d4;
  --blue: #5b8cff;
  --yellow: #f8cb4f;
  --orange: #f0844b;
  --rose: #f25f7b;
  --green: #45d49a;
  --purple: #a78bfa;
  --slate: #60758c;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  background:
    radial-gradient(circle at 80% 8%, rgba(25, 195, 212, .08), transparent 28rem),
    var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  margin: 0;
  overflow-x: hidden;
}
a { color: inherit; }
.skip-link { background: var(--yellow); color: #07111f; left: 1rem; padding: .7rem 1rem; position: fixed; top: -5rem; z-index: 100; }
.skip-link:focus { top: 1rem; }
.shell { margin: 0 auto; max-width: 1240px; padding-left: 1.4rem; padding-right: 1.4rem; }

.hero { border-bottom: 1px solid var(--line); min-height: 100vh; overflow: hidden; padding: 2rem 0 3rem; position: relative; }
.hero::before, .hero::after { content: ""; pointer-events: none; position: absolute; }
.hero::before {
  background: repeating-linear-gradient(90deg, transparent 0 42px, rgba(25, 195, 212, .14) 42px 43px);
  height: 1px; left: 0; top: 32%; width: 100%;
}
.hero::after {
  border: 1px solid rgba(25, 195, 212, .25); border-radius: 50%; height: 39rem; right: -14rem; top: -17rem; width: 39rem;
  box-shadow: 0 0 0 5rem rgba(25, 195, 212, .025), 0 0 0 10rem rgba(25, 195, 212, .02);
}
.back-link { color: var(--muted); display: inline-flex; font-size: .75rem; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.back-link:hover { color: var(--cyan); }
.back-link:focus-visible, button:focus-visible, .source-ledger a:focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; }
.kicker, .eyebrow, .data-stamp, .chapter-head > span, .growth-head, .updated {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.kicker { color: var(--cyan); font-size: .72rem; margin: 7rem 0 1.5rem; }
.hero h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(4.2rem, 10vw, 9rem); font-weight: 400; letter-spacing: -.065em; line-height: .82; margin: 0; max-width: 1000px; }
.hero h1 span { color: var(--cyan); font-style: italic; }
.dek { color: #c6d0da; font-size: clamp(1.05rem, 1.8vw, 1.35rem); line-height: 1.6; margin: 3rem 0 4.5rem; max-width: 760px; }
.hero-metrics { border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(4, 1fr); }
.hero-metrics article { min-width: 0; padding: 1.5rem 1.3rem; }
.hero-metrics article + article { border-left: 1px solid var(--line); }
.hero-metrics span, .hero-metrics small { color: var(--muted); display: block; }
.hero-metrics span { font-size: .66rem; letter-spacing: .09em; text-transform: uppercase; }
.hero-metrics strong { display: block; font-size: clamp(1.65rem, 3vw, 2.6rem); letter-spacing: -.04em; margin: .45rem 0 .25rem; }
.hero-metrics small { font-size: .72rem; }
.unit-strip { align-items: center; display: grid; gap: 1.2rem; grid-template-columns: 1fr auto 1.25fr 2fr; margin-top: 2rem; }
.unit-strip > div { background: var(--panel); border: 1px solid var(--line); padding: 1rem; }
.unit-strip b, .unit-strip span { display: block; }
.unit-strip b { font-size: .85rem; }
.unit-strip span { color: var(--muted); font-size: .75rem; margin-top: .2rem; }
.unit-strip i { color: var(--cyan); font: .72rem ui-monospace, monospace; }
.unit-strip p { color: var(--muted); font-size: .8rem; line-height: 1.55; margin: 0; }
.unit-strip p b { color: var(--text); display: inline; }

.chapters { padding-bottom: 3rem; }
.chapter { border-bottom: 1px solid var(--line); padding: 8rem 0; }
.chapter-head { display: grid; gap: 1.3rem; grid-template-columns: minmax(150px, .6fr) minmax(0, 1.55fr) minmax(250px, 1fr); margin-bottom: 3rem; }
.chapter-head > span { color: var(--cyan); font-size: .65rem; padding-top: .7rem; }
.chapter-head h2 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.7rem, 5.7vw, 5.4rem); font-weight: 400; letter-spacing: -.055em; line-height: .93; margin: 0; }
.chapter-head > p { color: var(--muted); font-size: .96rem; line-height: 1.7; margin: .5rem 0 0; }
.chapter-head.compact { grid-template-columns: minmax(150px, .6fr) 2.55fr; }

.card { background: linear-gradient(145deg, rgba(20, 38, 58, .92), rgba(13, 28, 44, .94)); border: 1px solid var(--line); border-radius: .8rem; box-shadow: 0 1.4rem 4rem rgba(0, 0, 0, .12); }
.chart-card, .ledger-note, .load-card, .outlook-card, .growth-board { padding: 1.6rem; }
.card-head { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; }
.eyebrow { color: var(--cyan); font-size: .62rem; margin: 0 0 .5rem; }
.card-head h3, .ledger-note h3, .load-card h3 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.6rem, 3vw, 2.55rem); font-weight: 400; letter-spacing: -.035em; margin: 0; }
.data-stamp { border: 1px solid var(--line); color: var(--muted); flex: none; font-size: .55rem; padding: .5rem .65rem; }
.chart-wrap { position: relative; width: 100%; }
.chart-short { height: 170px; margin: 1.1rem 0 .8rem; }
.mix-key { display: flex; flex-wrap: wrap; gap: .65rem 1rem; }
.mix-key span { align-items: center; color: var(--muted); display: flex; font-size: .72rem; gap: .4rem; }
.mix-key b { color: var(--text); }
.mix-key i { border-radius: 50%; height: .65rem; width: .65rem; }
.coal { background: #677383; } .gas { background: #f0844b; } .hydro { background: #4f9cff; } .nuclear { background: #a78bfa; }
.wind { background: #19c3d4; } .solar { background: #f8cb4f; } .other { background: #45d49a; }

.source-grid { display: grid; gap: 1px; grid-template-columns: repeat(4, 1fr); margin-top: 1.4rem; background: var(--line); border: 1px solid var(--line); }
.source-card { background: var(--bg); min-height: 210px; padding: 1.35rem; position: relative; }
.source-card::before { background: var(--c, var(--cyan)); content: ""; height: 3px; left: 0; position: absolute; top: 0; width: 100%; }
.source-card span, .source-card strong, .source-card b, .source-card em { display: block; }
.source-card span { color: var(--muted); font: .67rem ui-monospace, monospace; letter-spacing: .1em; text-transform: uppercase; }
.source-card strong { font-size: 1.55rem; letter-spacing: -.04em; margin: .8rem 0 .25rem; }
.power-equiv, .heading-equivalent { color: var(--muted); display: block; font-size: .68rem; font-weight: 500; }
.source-card .power-equiv { color: #c6d0da; margin: -.05rem 0 .55rem; }
.source-card b { font-size: .72rem; }
.source-card em { color: var(--c, var(--cyan)); font-size: .75rem; font-style: normal; margin-top: .55rem; }
.source-card p { color: var(--muted); font-size: .76rem; line-height: 1.5; margin: 1rem 0 0; }
.source-solar { --c: var(--yellow); } .source-wind { --c: var(--cyan); } .source-hydro { --c: var(--blue); }
.source-nuclear { --c: var(--purple); } .source-coal { --c: #8190a2; } .source-gas { --c: var(--orange); }
.source-bio { --c: var(--green); } .source-other { --c: var(--rose); }

.two-col { display: grid; gap: 1.4rem; grid-template-columns: 1.35fr .8fr; }
.align-stretch > * { height: 100%; }
.demand-list { display: grid; gap: .65rem; grid-template-columns: repeat(2, 1fr); margin-top: 1.2rem; }
.demand-list div { border-left: 2px solid var(--cyan); display: grid; gap: .1rem .7rem; grid-template-columns: 1fr auto; padding-left: .8rem; }
.demand-list span { font-size: .8rem; }
.demand-list b { color: var(--cyan); font-size: .8rem; }
.demand-list small { color: var(--muted); font-size: .68rem; grid-column: 1 / -1; line-height: 1.4; }
.heading-equivalent { margin: .4rem 0 0; }
.dc-breakout { align-items: center; background: rgba(167, 139, 250, .08); border: 1px dashed rgba(167, 139, 250, .55); display: grid; gap: .7rem 1rem; grid-template-columns: 1.4fr auto; margin-top: 1.3rem; padding: 1rem; }
.dc-breakout span { color: var(--purple); display: block; font: .58rem ui-monospace, monospace; letter-spacing: .08em; }
.dc-breakout strong { display: block; font-size: 1.2rem; margin-top: .35rem; }
.dc-breakout strong small { color: var(--muted); display: inline; font-size: .65rem; font-weight: 500; }
.dc-breakout > b { color: var(--purple); font-size: .72rem; }
.dc-breakout p { color: var(--muted); font-size: .65rem; grid-column: 1 / -1; line-height: 1.5; margin: 0; }
.ledger-note { display: flex; flex-direction: column; }
.ledger-note > p { color: var(--muted); font-size: .8rem; line-height: 1.6; }
.ledger-note hr { border: 0; border-top: 1px solid var(--line); margin: 1.5rem 0; width: 100%; }
.ledger-note h4 { font-size: .84rem; letter-spacing: .04em; margin: 0 0 .8rem; text-transform: uppercase; }
.ledger-flow { align-items: center; display: grid; gap: .55rem; grid-template-columns: 1fr auto 1fr auto 1fr; margin: 1.6rem 0 1rem; }
.ledger-flow div { border: 1px solid var(--line); padding: .75rem; text-align: center; }
.ledger-flow strong, .ledger-flow span { display: block; }
.ledger-flow strong { font-size: .8rem; }
.ledger-flow span { color: var(--muted); font-size: .58rem; margin-top: .25rem; }
.ledger-flow i { color: var(--cyan); font-size: .8rem; }
.signal-list { display: grid; gap: .8rem; list-style: none; margin: 0; padding: 0; }
.signal-list li { display: grid; gap: .6rem; grid-template-columns: 5rem 1fr; }
.signal-list b { color: var(--green); font-size: .74rem; }
.signal-list span { color: var(--muted); font-size: .72rem; line-height: 1.45; }

.country-scoreboard { align-items: stretch; display: grid; gap: 1rem; grid-template-columns: 1fr auto 1fr; margin-bottom: 1.4rem; }
.country-scoreboard.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.country-banner { border: 1px solid var(--line); display: grid; gap: .3rem; grid-template-columns: 1fr auto; padding: 1.5rem; }
.country-banner.us { background: linear-gradient(120deg, rgba(91, 140, 255, .17), var(--panel)); }
.country-banner.china { background: linear-gradient(120deg, rgba(242, 95, 123, .18), var(--panel)); }
.country-banner.europe { background: linear-gradient(120deg, rgba(69, 212, 154, .16), var(--panel)); }
.country-banner p, .country-banner span, .country-banner b { font-size: .65rem; margin: 0; }
.country-banner p { color: var(--muted); grid-column: 1 / -1; letter-spacing: .1em; }
.country-banner strong { font-size: clamp(2.1rem, 4vw, 3.5rem); grid-column: 1; grid-row: 2; letter-spacing: -.055em; }
.country-banner small { color: #c6d0da; font-size: .63rem; grid-column: 1; grid-row: 3; }
.country-banner span { grid-column: 2; grid-row: 2; }
.country-banner b { grid-column: 2; grid-row: 3; }
.country-banner span, .country-banner b { align-self: end; text-align: right; }
.country-banner span { color: var(--muted); }
.country-banner b { color: var(--cyan); }
.versus { align-items: center; color: var(--muted); display: flex; }
.country-grid { display: grid; gap: 1.4rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.country-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.country-card { background: var(--panel); border: 1px solid var(--line); overflow: hidden; }
.country-title { align-items: center; display: flex; gap: 1.2rem; padding: 1.5rem; }
.country-title > span { align-items: center; border: 1px solid var(--line); border-radius: 50%; display: flex; flex: none; font: 1rem ui-monospace, monospace; height: 4.2rem; justify-content: center; width: 4.2rem; }
.us-card .country-title > span { color: var(--blue); } .china-card .country-title > span { color: var(--rose); }
.europe-card .country-title > span { color: var(--green); }
.country-title p { color: var(--muted); font: .6rem ui-monospace, monospace; letter-spacing: .1em; margin: 0 0 .4rem; }
.country-title h3 { font-family: Georgia, serif; font-size: 1.55rem; font-weight: 400; letter-spacing: -.03em; margin: 0; }
.country-chart { height: 300px; padding: 0 1rem; }
.growth-ribbon { border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: .55rem; padding: 1rem 1.5rem; }
.growth-ribbon span { background: rgba(69, 212, 154, .08); border: 1px solid rgba(69, 212, 154, .2); color: var(--muted); font-size: .63rem; padding: .45rem .55rem; }
.growth-ribbon b { color: var(--green); }
.growth-ribbon .hot { background: rgba(248, 203, 79, .09); border-color: rgba(248, 203, 79, .25); }
.growth-ribbon .hot b { color: var(--yellow); }
.growth-ribbon .down { background: rgba(242, 95, 123, .08); border-color: rgba(242, 95, 123, .2); }
.growth-ribbon .down b { color: var(--rose); }
.sector-panel { padding: 1.5rem; }
.sector-row { align-items: center; display: grid; gap: .6rem; grid-template-columns: 7rem 1fr 5.6rem 3.3rem; margin: .9rem 0; }
.sector-row span { color: var(--muted); font-size: .67rem; }
.sector-row i { background: rgba(255,255,255,.06); height: .42rem; overflow: hidden; position: relative; }
.sector-row i::after { background: var(--cyan); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: var(--w); }
.china-card .sector-row i::after { background: var(--rose); }
.europe-card .sector-row i::after { background: var(--green); }
.sector-row b, .sector-row em { font-size: .65rem; font-style: normal; text-align: right; }
.sector-row b small { color: var(--muted); display: block; font-size: .55rem; font-weight: 500; margin-top: .12rem; }
.sector-row em { color: var(--green); }
.country-grid.three .country-title { align-items: flex-start; padding: 1.25rem; }
.country-grid.three .country-title > span { height: 3.4rem; width: 3.4rem; }
.country-grid.three .country-title h3 { font-size: 1.25rem; }
.country-grid.three .country-chart { height: 270px; }
.country-grid.three .growth-ribbon { padding: .85rem 1.2rem; }
.country-grid.three .sector-panel { padding: 1.2rem; }
.country-grid.three .sector-row { gap: .4rem; grid-template-columns: 6.6rem 1fr 5.1rem 2.6rem; }
.country-grid.three .fine-print { padding: 0 1.2rem 1.2rem; }
.fine-print { color: var(--muted); font-size: .65rem; line-height: 1.5; margin: 0; padding: 0 1.5rem 1.5rem; }
.takeaway-strip { align-items: center; background: rgba(25, 195, 212, .08); border: 1px solid rgba(25, 195, 212, .28); display: grid; gap: 2rem; grid-template-columns: .5fr 2fr; margin-top: 1.4rem; padding: 1.4rem; }
.takeaway-strip b { color: var(--cyan); font: .75rem ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase; }
.takeaway-strip p { color: #c4d0dc; font-size: .8rem; line-height: 1.6; margin: 0; }

.load-intro { display: grid; grid-template-columns: repeat(2, 1fr); margin-bottom: 1.4rem; }
.load-intro > div { padding: 1.5rem; }
.load-intro > div + div { border-left: 1px solid var(--line); }
.load-intro p { color: var(--muted); font: .62rem ui-monospace, monospace; letter-spacing: .1em; margin: 0; }
.load-intro strong, .load-intro span { display: block; }
.load-intro strong { font-size: 2.3rem; letter-spacing: -.05em; margin: .5rem 0 .25rem; }
.load-intro .power-equiv { color: #c6d0da; font-size: .7rem; margin: -.1rem 0 .45rem; }
.load-intro span { color: var(--muted); font-size: .7rem; }
.load-grid { display: grid; gap: 1.4rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.facility-counts { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); margin: 1.7rem 0; }
.facility-counts div { border: 1px solid var(--line); padding: 1rem; }
.facility-counts span, .facility-counts strong, .facility-counts small { display: block; }
.facility-counts span { color: var(--muted); font-size: .65rem; }
.facility-counts strong { font-size: 2.4rem; letter-spacing: -.06em; margin: .35rem 0; }
.facility-counts small { color: var(--muted); font-size: .62rem; }
.warning { background: rgba(248, 203, 79, .08); border-left: 3px solid var(--yellow); color: var(--muted); font-size: .72rem; line-height: 1.55; padding: .8rem; }
.warning b { color: var(--yellow); }
.power-pairs { border-top: 1px solid var(--line); display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); margin-top: 1.4rem; padding-top: 1.4rem; }
.power-pairs span, .power-pairs strong, .power-pairs small, .power-pairs em { display: block; }
.power-pairs span { color: var(--muted); font-size: .63rem; }
.power-pairs strong { font-size: 1.4rem; margin: .3rem 0; }
.power-pairs small { color: #c6d0da; font-size: .62rem; margin-bottom: .3rem; }
.power-pairs em { color: var(--cyan); font-size: .62rem; font-style: normal; }
.ev-counts strong { color: var(--yellow); }
.growth-callouts { display: grid; gap: .7rem; grid-template-columns: repeat(2, 1fr); }
.growth-callouts p { color: var(--muted); font-size: .7rem; line-height: 1.5; margin: 0; }
.growth-callouts b { color: var(--text); }
.growth-callouts strong { color: var(--green); }
.outlook-card { margin-top: 1.4rem; }
.year-toggle { background: var(--bg); border: 1px solid var(--line); display: flex; padding: .25rem; }
.year-toggle button { background: transparent; border: 0; color: var(--muted); cursor: pointer; font: .65rem ui-monospace, monospace; padding: .65rem 1rem; }
.year-toggle button.active { background: var(--cyan); color: #06111d; }
.outlook-chart { height: 390px; margin-top: 1.2rem; }
.outlook-annotation { border-left: 3px solid var(--cyan); color: #c4d0dc; font-size: .78rem; line-height: 1.55; margin: 1rem 0; padding: .6rem .9rem; }
.outlook-facts { border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(4, 1fr); padding-top: 1rem; }
.outlook-facts div { padding: .7rem; }
.outlook-facts div + div { border-left: 1px solid var(--line); }
.outlook-facts span, .outlook-facts b { display: block; }
.outlook-facts span { color: var(--muted); font-size: .6rem; }
.outlook-facts b { font-size: .72rem; margin-top: .3rem; }
.compute-roadmap { margin-top: 1.4rem; padding: 1.6rem; }
.compute-roadmap h3, .operator-card h3, .regional-head h3, .device-deck h3, .growth-explainer h3 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.6rem, 3vw, 2.55rem); font-weight: 400; letter-spacing: -.035em; margin: 0; }
.chart-explainer, .scenario-note, .capacity-intro, .capacity-note, .device-intro, .device-note, .verification-card p { color: var(--muted); font-size: .72rem; line-height: 1.6; }
.chart-explainer { margin: 1rem 0 0; max-width: 950px; }
.horizon-chart { height: 470px; margin: 1.2rem 0; }
.horizon-ledger { background: var(--line); border: 1px solid var(--line); display: grid; gap: 1px; grid-template-columns: repeat(6, 1fr); }
.horizon-ledger div { background: var(--bg); padding: 1rem; }
.horizon-ledger span, .horizon-ledger b, .horizon-ledger small { display: block; }
.horizon-ledger span { color: var(--cyan); font: .65rem ui-monospace, monospace; }
.horizon-ledger b { font-size: .75rem; margin: .5rem 0 .3rem; }
.horizon-ledger small { color: var(--muted); font-size: .6rem; line-height: 1.45; }
.forecast-caveat { align-items: baseline; background: rgba(248, 203, 79, .08); border: 1px solid rgba(248, 203, 79, .3); display: grid; gap: 1.5rem; grid-template-columns: 14rem 1fr; margin-top: 1rem; padding: 1rem; }
.forecast-caveat strong { color: var(--yellow); font-size: .78rem; }
.forecast-caveat p { color: #c6d0da; font-size: .7rem; line-height: 1.55; margin: 0; }
.scenario-note { border-left: 3px solid var(--line); margin: 1rem 0 0; padding-left: .9rem; }
.capacity-comparison { display: grid; gap: 1.4rem; grid-template-columns: 1fr; margin-top: 1.4rem; }
.operator-card { padding: 1.6rem; }
.capacity-intro { margin: 1rem 0 0; max-width: 980px; }
.capacity-intro b { color: var(--text); }
.operator-chart { height: 430px; margin-top: 1.2rem; }
.capacity-ledger { background: var(--line); border: 1px solid var(--line); display: grid; gap: 1px; grid-template-columns: repeat(5, 1fr); margin-top: 1rem; }
.capacity-ledger div { background: var(--bg); padding: 1rem; }
.capacity-ledger span, .capacity-ledger b, .capacity-ledger small { display: block; }
.capacity-ledger span { color: var(--cyan); font: .61rem ui-monospace, monospace; line-height: 1.4; }
.capacity-ledger b { font-size: .7rem; line-height: 1.4; margin: .5rem 0 .25rem; }
.capacity-ledger small { color: var(--muted); font-size: .6rem; line-height: 1.45; }
.capacity-note { border-top: 1px solid var(--line); margin: 1rem 0 0; padding-top: 1rem; }
.capacity-note b { color: var(--text); }
.google-reality { background: rgba(69, 212, 154, .08); border: 1px solid rgba(69, 212, 154, .28); margin-top: 1.3rem; padding: 1rem; }
.google-reality > span { color: var(--green); display: block; font: .6rem ui-monospace, monospace; letter-spacing: .09em; }
.google-reality strong { display: block; font-size: 1.55rem; margin: .5rem 0; }
.google-reality strong small { color: var(--muted); font-size: .65rem; }
.google-reality p { color: var(--muted); font-size: .66rem; line-height: 1.5; margin: 0; }

.growth-board { padding: 0; overflow: hidden; }
.growth-head { background: var(--panel-2); color: var(--muted); display: flex; font-size: .58rem; justify-content: space-between; padding: 1rem 1.4rem; }
.growth-lanes article { align-items: center; display: grid; gap: 1.2rem; grid-template-columns: 16rem 1fr 16rem; padding: 1.15rem 1.4rem; }
.growth-lanes article + article { border-top: 1px solid var(--line); }
.growth-lanes article > div { display: flex; justify-content: space-between; }
.growth-lanes span { color: var(--muted); font-size: .72rem; }
.growth-lanes strong { color: var(--green); font-size: .72rem; }
.growth-lanes i { background: rgba(255,255,255,.06); height: .55rem; position: relative; }
.growth-lanes i::after { background: linear-gradient(90deg, var(--cyan), var(--green)); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: var(--g); }
.growth-lanes p { color: var(--muted); font-size: .68rem; line-height: 1.45; margin: 0; }
.growth-lanes .negative strong { color: var(--rose); }
.growth-lanes .negative i::after { background: var(--rose); }
.growth-explainer { display: grid; gap: 1.4rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1.4rem; }
.growth-explainer > article { padding: 1.6rem; }
.growth-explainer .signal-list { margin-top: 1.3rem; }
.verification-card { background: linear-gradient(145deg, rgba(248, 203, 79, .1), rgba(13, 28, 44, .94)); }
.verification-card p b { color: var(--yellow); }

.final-chapter { border-bottom: 0; }
.citizen-grid { display: grid; gap: 1.4rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.citizen-card { border: 1px solid var(--line); overflow: hidden; padding: 1.8rem; position: relative; }
.us-citizen { background: linear-gradient(150deg, rgba(91, 140, 255, .18), var(--panel) 55%); }
.china-citizen { background: linear-gradient(150deg, rgba(242, 95, 123, .19), var(--panel) 55%); }
.flag-label { border: 1px solid currentColor; color: var(--muted); display: inline-flex; font: .62rem ui-monospace, monospace; letter-spacing: .1em; padding: .45rem .6rem; }
.citizen-card > p { color: var(--muted); font: .65rem ui-monospace, monospace; letter-spacing: .1em; margin: 2.5rem 0 .4rem; }
.citizen-card > strong { display: block; font-size: clamp(3rem, 7vw, 5.6rem); letter-spacing: -.07em; line-height: 1; }
.citizen-card > span { color: var(--muted); font-size: .8rem; }
.watt-number { border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); font-size: 2rem; font-weight: 700; margin: 2rem 0 0; padding: 1.2rem 0; }
.watt-number small { color: var(--muted); font-size: .7rem; font-weight: 400; }
.home-line { display: flex; font-size: .68rem; justify-content: space-between; padding: 1rem 0; }
.home-line span { color: var(--muted); }
.price-box { background: rgba(7, 17, 31, .65); border: 1px solid var(--line); margin-top: 1.5rem; padding: 1.2rem; }
.price-box > span { color: var(--muted); display: block; font-size: .62rem; }
.price-box > strong { display: block; font-size: 2rem; letter-spacing: -.04em; margin: .5rem 0; }
.price-box > strong small { color: var(--muted); font-size: .7rem; }
.price-box p { color: var(--muted); font-size: .68rem; line-height: 1.5; margin: 0; }
.price-box p b { color: var(--text); }
.regional-people { background: var(--line); border: 1px solid var(--line); display: grid; gap: 1px; grid-template-columns: 1.15fr repeat(3, 1fr); margin-top: 1.4rem; }
.regional-people > * { background: var(--bg); padding: 1.25rem; }
.regional-head { display: flex; flex-direction: column; justify-content: center; }
.regional-head h3 { font-size: 1.65rem; }
.regional-people article span, .regional-people article strong, .regional-people article b, .regional-people article p { display: block; }
.regional-people article span { color: var(--muted); font: .62rem ui-monospace, monospace; letter-spacing: .08em; }
.regional-people article strong { font-size: 1.7rem; letter-spacing: -.04em; margin: .65rem 0 .2rem; }
.regional-people article b { color: var(--cyan); font-size: 1rem; }
.regional-people article p { color: var(--muted); font-size: .62rem; margin: .35rem 0 0; }
.regional-note { color: var(--muted); font-size: .62rem; line-height: 1.5; margin: .65rem 0 0; }
.device-deck { margin-top: 1.4rem; padding: 1.6rem; }
.device-intro { margin: 1rem 0 1.3rem; max-width: 850px; }
.device-grid { display: grid; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.device-grid article { background: var(--bg); border: 1px solid var(--line); padding: 1.2rem; }
.device-watts { color: var(--yellow); font-size: 2rem; font-weight: 800; letter-spacing: -.04em; }
.device-grid h4 { font-family: Georgia, serif; font-size: 1.25rem; font-weight: 400; margin: .5rem 0; }
.device-grid p { color: var(--muted); font-size: .72rem; line-height: 1.5; margin: 0 0 .7rem; }
.device-grid p b { color: var(--text); }
.device-grid small { color: var(--cyan); font-size: .64rem; }
.device-note { border-top: 1px solid var(--line); margin: 1.2rem 0 0; padding-top: 1rem; }
.last-word { border-left: 4px solid var(--cyan); margin: 5rem auto 0; max-width: 1000px; padding-left: 2rem; }
.last-word p { color: var(--cyan); font: .65rem ui-monospace, monospace; letter-spacing: .1em; text-transform: uppercase; }
.last-word h3 { font-family: Georgia, serif; font-size: clamp(1.9rem, 4.2vw, 3.8rem); font-weight: 400; letter-spacing: -.04em; line-height: 1.05; margin: 0; }

.sources { padding: 4rem 0; }
.method-grid { border: 1px solid var(--line); display: grid; grid-template-columns: repeat(4, 1fr); }
.method-grid p { color: var(--muted); font-size: .68rem; line-height: 1.55; margin: 0; padding: 1.1rem; }
.method-grid p + p { border-left: 1px solid var(--line); }
.method-grid b { color: var(--text); }
.source-ledger { list-style: none; margin: 2rem 0; padding: 0; }
.source-ledger li { align-items: baseline; border-top: 1px solid var(--line); display: grid; gap: .8rem; grid-template-columns: 2rem 1.1fr 1fr; padding: .85rem 0; }
.source-ledger li:last-child { border-bottom: 1px solid var(--line); }
.source-ledger span { color: var(--muted); font: .58rem ui-monospace, monospace; }
.source-ledger a { color: var(--text); font-size: .76rem; text-decoration-color: var(--cyan); text-underline-offset: .2rem; }
.source-ledger p { color: var(--muted); font-size: .68rem; line-height: 1.5; margin: 0; }
.updated { color: var(--muted); font-size: .58rem; text-align: right; }
footer { align-items: center; border-top: 1px solid var(--line); color: var(--muted); display: flex; font-size: .68rem; justify-content: space-between; padding: 2rem max(1.4rem, calc((100vw - 1240px) / 2)); }
footer a { color: var(--text); text-decoration-color: var(--cyan); }

@media (max-width: 980px) {
  .hero-metrics { grid-template-columns: repeat(2, 1fr); }
  .hero-metrics article:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .hero-metrics article:nth-child(4) { border-top: 1px solid var(--line); }
  .unit-strip { grid-template-columns: 1fr auto 1fr; }
  .unit-strip p { grid-column: 1 / -1; }
  .chapter-head { grid-template-columns: 9rem 1fr; }
  .chapter-head > p { grid-column: 2; }
  .source-grid { grid-template-columns: repeat(2, 1fr); }
  .two-col, .load-grid { grid-template-columns: 1fr; }
  .country-grid.three { grid-template-columns: 1fr; }
  .country-grid.three .country-chart { height: 320px; }
  .capacity-comparison, .growth-explainer { grid-template-columns: 1fr; }
  .growth-lanes article { grid-template-columns: 13rem 1fr 12rem; }
  .method-grid { grid-template-columns: repeat(2, 1fr); }
  .method-grid p:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .method-grid p:nth-child(4) { border-top: 1px solid var(--line); }
  .outlook-facts { grid-template-columns: repeat(2, 1fr); }
  .outlook-facts div:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .outlook-facts div:nth-child(4) { border-top: 1px solid var(--line); }
  .horizon-ledger { grid-template-columns: repeat(3, 1fr); }
  .capacity-ledger { grid-template-columns: repeat(2, 1fr); }
  .regional-people { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 720px) {
  .shell { padding-left: 1rem; padding-right: 1rem; }
  .hero { min-height: auto; padding-bottom: 2rem; }
  .kicker { margin-top: 5rem; }
  .hero h1 { font-size: clamp(3.6rem, 18vw, 6.2rem); }
  .dek { margin: 2rem 0 3rem; }
  .hero-metrics article { padding: 1.1rem .75rem; }
  .hero-metrics article:nth-child(even) { border-left: 1px solid var(--line); }
  .unit-strip { gap: .6rem; grid-template-columns: 1fr; }
  .unit-strip i { transform: rotate(90deg); width: fit-content; }
  .unit-strip p { grid-column: 1; }
  .chapter { padding: 5rem 0; }
  .chapter-head, .chapter-head.compact { display: block; }
  .chapter-head > span { display: block; margin-bottom: 1rem; }
  .chapter-head h2 { font-size: clamp(2.7rem, 13vw, 4.5rem); }
  .chapter-head > p { margin-top: 1.2rem; }
  .card-head { display: block; }
  .data-stamp { display: inline-block; margin-top: .8rem; }
  .chart-short { height: 135px; }
  .source-grid { grid-template-columns: 1fr; }
  .source-card { min-height: 0; }
  .demand-list { grid-template-columns: 1fr; }
  .ledger-flow { grid-template-columns: 1fr; }
  .ledger-flow i { transform: rotate(90deg); }
  .country-scoreboard, .country-scoreboard.three { grid-template-columns: 1fr; }
  .versus { justify-content: center; }
  .country-grid, .citizen-grid { grid-template-columns: 1fr; }
  .country-chart { height: 260px; }
  .sector-row { grid-template-columns: 6.8rem 1fr 4.6rem; }
  .country-grid.three .sector-row { grid-template-columns: 6.8rem 1fr 4.8rem; }
  .sector-row em { grid-column: 3; }
  .country-grid.three .sector-row em { grid-column: 3; }
  .takeaway-strip { grid-template-columns: 1fr; }
  .load-intro { grid-template-columns: 1fr; }
  .load-intro > div + div { border-left: 0; border-top: 1px solid var(--line); }
  .facility-counts, .growth-callouts, .power-pairs { grid-template-columns: 1fr; }
  .year-toggle { margin-top: 1rem; width: fit-content; }
  .outlook-chart { height: 320px; }
  .horizon-chart { height: 390px; }
  .horizon-ledger, .capacity-ledger, .regional-people, .device-grid { grid-template-columns: 1fr; }
  .forecast-caveat { gap: .6rem; grid-template-columns: 1fr; }
  .operator-chart { height: 330px; }
  .dc-breakout { grid-template-columns: 1fr; }
  .dc-breakout p { grid-column: 1; }
  .growth-head { display: grid; gap: .5rem; }
  .growth-lanes article { gap: .7rem; grid-template-columns: 1fr; }
  .growth-lanes article > div { gap: 1rem; }
  .growth-lanes i { width: 100%; }
  .home-line { display: grid; gap: .35rem; }
  .method-grid { grid-template-columns: 1fr; }
  .method-grid p + p, .method-grid p:nth-child(4) { border-left: 0; border-top: 1px solid var(--line); }
  .source-ledger li { grid-template-columns: 2rem 1fr; }
  .source-ledger p { grid-column: 2; }
  footer { align-items: flex-start; flex-direction: column; gap: .6rem; padding-left: 1rem; padding-right: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .001ms !important; }
}
