/* world-fuel-consumption — chart layer for the 8 models (charts3 look) on page A. Palette validated with the dataviz validator (dark on #0a0f1e, light on #fff). */
@font-face{font-family:'SG';src:url(/world-fuel-consumption/assets/fonts/space-grotesk-latin-400-normal.woff2) format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-2199,U+2212,U+2215}
@font-face{font-family:'SG';src:url(/world-fuel-consumption/assets/fonts/space-grotesk-latin-ext-400-normal.woff2) format('woff2');font-weight:400;font-display:swap;unicode-range:U+0100-02AF,U+0218-021B,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'SG';src:url(/world-fuel-consumption/assets/fonts/space-grotesk-latin-500-normal.woff2) format('woff2');font-weight:500;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2190-2199,U+2212}
@font-face{font-family:'SG';src:url(/world-fuel-consumption/assets/fonts/space-grotesk-latin-ext-500-normal.woff2) format('woff2');font-weight:500;font-display:swap;unicode-range:U+0100-02AF,U+0218-021B,U+1E00-1EFF}
@font-face{font-family:'SG';src:url(/world-fuel-consumption/assets/fonts/space-grotesk-latin-700-normal.woff2) format('woff2');font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2190-2199,U+2212}
@font-face{font-family:'SG';src:url(/world-fuel-consumption/assets/fonts/space-grotesk-latin-ext-700-normal.woff2) format('woff2');font-weight:700;font-display:swap;unicode-range:U+0100-02AF,U+0218-021B,U+1E00-1EFF}
@font-face{font-family:'JBM';src:url(/world-fuel-consumption/assets/fonts/jetbrains-mono-latin-400-normal.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'JBM';src:url(/world-fuel-consumption/assets/fonts/jetbrains-mono-latin-600-normal.woff2) format('woff2');font-weight:600;font-display:swap}
:root{
  --csans:'SG',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JBM',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --cD:#9e70ff;--cP:#00a5b3;--cJ:#dc7100;--cL:#ff04a9;--cO:#2a303b;
  --hD:#cdb2ff;--hP:#46f2ff;--hJ:#ffb04a;--hL:#ff7ad6;--hO:#3b4352;
  --pos:#00b8c8;--posH:#5ef6ff;--neg:#ff04a9;--negH:#ff7ad6;--mid:#3a4150;
  --acc2:#b9a2ff;--ro:#ff04a9;--tipbg:rgba(23,27,34,.97);
  --grid:rgba(238,241,245,.06);--grid2:rgba(238,241,245,.14);
  --dC:var(--cD);--pC:var(--cP);--jC:var(--cJ);
}
html.fp-light{
  --cD:#955bff;--cP:#0098a4;--cJ:#ca6800;--cL:#eb009b;--cO:#e1ded4;
  --hD:#c7a6ff;--hP:#3fe0ee;--hJ:#ffa43a;--hL:#ff6cc8;--hO:#eeece5;
  --pos:#0098a4;--posH:#00b3c3;--neg:#eb009b;--negH:#f2259f;--mid:#cfcbc0;
  --acc2:#6a43c2;--ro:#eb009b;--tipbg:rgba(255,255,255,.98);
  --grid:rgba(17,20,24,.06);--grid2:rgba(17,20,24,.15);
  --dC:var(--cD);--pC:var(--cP);--jC:var(--cJ);
}
.ph3{font-size:16px;margin:0 0 10px}
.yoyl{margin:14px 0 0}.yoyl .badge{margin:0}
.vz .host{position:relative}
.vz .viz{width:100%;display:block;overflow:visible}
.vz .viz text{font-family:var(--csans)}
.vz .ax text,.vz .mono{font-family:var(--mono)!important}
.vz .ax text{font-size:10.5px;fill:var(--dim)}.vz .ax line,.vz .ax path{stroke:var(--grid2)}
.vz .gridl line{stroke:var(--grid)}.vz .gridl path{display:none}
.vz .lbl{font-size:12.5px;font-weight:700;fill:var(--ink)}
.vz .lbl.s{font-weight:500;fill:var(--ink2);font-size:11.5px}
.vz .ann{font:500 10.5px var(--mono);fill:var(--ink2);letter-spacing:.02em}
.vz .annl{stroke:var(--ink2);stroke-width:1;stroke-dasharray:2 3;opacity:.7}
.vz .hud rect{fill:var(--tipbg);stroke:var(--line2)}
.vz .hud text{font:600 10.5px var(--mono);fill:var(--ink)}
.vz .hud .y{fill:var(--acc)}
.vz .tip{position:absolute;z-index:6;pointer-events:none;background:var(--tipbg);border:1px solid var(--line2);border-radius:12px;padding:10px 12px;font-size:12.5px;line-height:1.45;box-shadow:0 18px 40px -16px rgba(0,0,0,.5);min-width:180px;max-width:300px;opacity:0;transform:translateY(4px);transition:opacity .12s,transform .12s}
.vz .tip.on{opacity:1;transform:none}
.vz .tip b{display:block;margin-bottom:5px;font:600 12px var(--mono);letter-spacing:.04em;color:var(--acc)}
.vz .tip .r{display:flex;justify-content:space-between;gap:16px;white-space:nowrap}
.vz .tip .r strong{font:600 12.5px var(--mono)}
.vz .tip i{width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:7px;vertical-align:-1px}
.vz .tip small{display:block;color:var(--dim);margin-top:4px;font-size:11px;white-space:normal}
.vz .ctl{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px}
.vz .vbtn{height:36px;padding:0 14px;border-radius:10px;border:1px solid var(--line2);background:var(--card2);color:var(--ink);font:600 12px/1 var(--mono);letter-spacing:.04em;cursor:pointer}
.vz .vbtn.pri{background:linear-gradient(135deg,var(--cD),var(--cP));color:#fff;border-color:transparent}
html:not(.fp-light) .vz .vbtn.pri{box-shadow:0 0 18px rgba(70,242,255,.3)}
.vz .vseg{display:inline-flex;padding:3px;border:1px solid var(--line2);border-radius:11px;background:var(--card2)}
.vz .vseg button{border:0;background:transparent;color:var(--ink2);font:600 12px/1 var(--mono);padding:9px 12px;border-radius:8px;cursor:pointer}
.vz .vseg button.on{background:linear-gradient(135deg,var(--cD),var(--cP));color:#fff}
.vz .ctl input[type=range]{flex:1;min-width:140px;accent-color:var(--acc)}
.vz .yr{font:600 14px var(--mono);min-width:44px;color:var(--acc)}
.vz .lgd{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--ink2);margin-top:12px}
.vz .lgd i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.vz .vsrc{font-size:11.5px;color:var(--dim);margin-top:8px;font-family:var(--mono);line-height:1.5;overflow-wrap:anywhere}
.vz .vsrc.rec{color:var(--ink2)}
.vz .flow{display:grid;grid-template-columns:1fr 230px;gap:16px;align-items:stretch}
.vz .flow canvas{width:100%;height:280px;display:block;border-radius:12px;background:var(--card2)}
.vz .meter{display:flex;flex-direction:column;justify-content:center;gap:10px}
.vz .meter .m{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--card2)}
.vz .meter .m small{display:block;font:600 10.5px var(--mono);letter-spacing:.1em;color:var(--dim);text-transform:uppercase}
.vz .meter .m span{font:600 22px var(--mono);letter-spacing:-.02em;white-space:nowrap}
.vz .vsrc .sw{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:0}.vz .vsrc.rec b{color:var(--ink)}
.vz .meter .m.t span{font-size:26px}
.vz .bigrate{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-bottom:12px}
.vz .bigrate b{font:600 clamp(30px,5vw,46px)/1 var(--mono);letter-spacing:-.03em;background:linear-gradient(90deg,var(--hD),var(--hP));-webkit-background-clip:text;background-clip:text;color:transparent}
html.fp-light .vz .bigrate b{background:linear-gradient(90deg,var(--cD),var(--cP));-webkit-background-clip:text;background-clip:text}
.vz .bigrate span{color:var(--ink2);font-size:13px}
.vz .bub{cursor:pointer}
.vz .ridge{transition:opacity .15s}
.vz .timeline{cursor:pointer}
html:not(.fp-light) .vz .glw{filter:url(#neon)}
html:not(.fp-light) .vz .glw2{filter:url(#neonS)}
@media (max-width:760px){.vz .flow{grid-template-columns:1fr}.vz .flow canvas{height:220px}.vz .meter{display:grid;grid-template-columns:1fr 1fr;gap:8px}.vz .meter .m span{font-size:14.5px}.vz .meter .m.t span{font-size:16px}.vz .meter .m{padding:8px 10px}}