:root{
    --ink:#16140f;--paper:#f4efe4;--paper2:#ece4d3;--diesel:#b8772a;--diesel-dark:#8a5418;
    --volt:#1faa6e;--volt-dark:#137a4d;--volt-light:#d7f2e5;--line:#d8cdb6;--muted:#736b58;
    --road:#26231c;--red:#a11c1c;--red-light:#f6dede;--ghost:#cfc4ab;
    --sans:'Barlow',-apple-system,sans-serif;--cond:'Barlow Condensed',sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
  body{font-family:var(--sans);color:var(--ink);line-height:1.55;min-height:100vh;
    background:radial-gradient(110% 70% at 85% -5%, rgba(31,170,110,.12), transparent 55%),
               radial-gradient(90% 60% at 0% 105%, rgba(184,119,42,.12), transparent 55%),
               linear-gradient(180deg,var(--paper),var(--paper2));
    display:flex;flex-direction:column}
  .wrap{width:100%;max-width:960px;margin:0 auto;padding:0 16px}

  .masthead{background:var(--road);color:#f4efe4;padding:11px 0;border-bottom:4px solid var(--volt-dark)}
  .masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
  .brand{font-family:var(--cond);font-weight:900;font-size:23px;letter-spacing:.02em;text-transform:uppercase;display:flex;align-items:center;gap:8px}
  .brand a{color:inherit;text-decoration:none}
  .brand .plug{color:var(--volt)}
  .brand .tag{font-size:12px;background:var(--volt-dark);color:#fff;padding:2px 7px;border-radius:4px;font-weight:700;letter-spacing:.05em}
  .masthead nav{display:flex;align-items:center;gap:16px;font-size:13px;flex-wrap:wrap}
  .masthead nav a{color:#cdbf9f;text-decoration:none;border-bottom:1px solid transparent}
  .masthead nav a:hover{color:#fff;border-bottom-color:var(--volt)}

  .hero{padding:40px 0 6px;max-width:74ch}
  .kicker{font-family:var(--cond);font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:14px;color:var(--volt-dark)}
  .hero h1{font-family:var(--cond);font-weight:900;font-size:clamp(34px,7vw,58px);line-height:.98;letter-spacing:-.01em;text-transform:uppercase;margin:8px 0 0}
  .hero h1 .hl{color:var(--diesel-dark)}
  .hero p.lead{font-size:18px;color:#534c3d;margin:16px 0 0}
  .live{display:inline-flex;align-items:center;gap:8px;margin:18px 0 0;font-size:13.5px;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 12px}
  .live .dot{width:9px;height:9px;border-radius:50%;background:var(--ghost)}
  .live.ok .dot{background:var(--volt)}
  .live.err .dot{background:var(--red)}

  /* the overview */
  .glance{margin:26px 0 0;border-radius:18px;overflow:hidden;border:2px solid var(--line);background:#fff;box-shadow:0 18px 40px -26px rgba(90,70,30,.6)}
  .glance .head{background:var(--road);color:#f4efe4;padding:13px 20px;font-family:var(--cond);font-weight:900;text-transform:uppercase;letter-spacing:.05em;font-size:19px}
  .glance .scroll{overflow-x:auto}
  .glance table{border-collapse:collapse;width:100%;font-size:14.5px;min-width:560px}
  .glance th{font-family:var(--cond);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:12.5px;color:var(--muted);text-align:left;padding:10px 14px;border-bottom:2px solid var(--line)}
  .glance td{padding:10px 14px;border-bottom:1px solid #eee6d4;vertical-align:top}
  .glance tr:last-child td{border-bottom:0}
  .glance td a{color:var(--ink);font-weight:600;text-decoration:none;border-bottom:1px solid var(--line)}
  .glance td a:hover{border-bottom-color:var(--volt)}
  .glance td .n{font-family:var(--cond);font-weight:800;color:var(--volt-dark);margin-right:6px}
  .glance .num{white-space:nowrap;font-variant-numeric:tabular-nums}
  .count{font-family:var(--cond);font-weight:800;font-size:18px}
  .count.all{color:var(--volt-dark)}
  .count.some{color:var(--diesel-dark)}

  /* the articles */
  article{margin:52px 0 0;padding-top:4px;scroll-margin-top:16px}
  article .no{font-family:var(--cond);font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:13.5px;color:var(--volt-dark)}
  article h2{font-family:var(--cond);font-weight:900;text-transform:uppercase;font-size:clamp(26px,4.6vw,38px);line-height:1.02;margin:4px 0 0;max-width:30ch}
  article .deck{font-size:17px;color:#534c3d;margin:10px 0 0;max-width:72ch}
  article p{margin:12px 0 0;max-width:74ch}
  article b.v, .glance b.v{font-variant-numeric:tabular-nums;white-space:nowrap}
  .setup{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0}
  .setup span{font-size:12.5px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px 10px;color:#534c3d}
  .setup span.what{background:var(--volt-light);border-color:#b9e3cd;color:var(--volt-dark);font-weight:600}

  .tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 0;max-width:780px}
  .tile{background:#fff;border:2px solid var(--line);border-radius:14px;padding:14px 14px 13px}
  .tile .big{font-family:var(--cond);font-weight:900;font-size:30px;line-height:1;color:var(--volt-dark);font-variant-numeric:tabular-nums}
  .tile .big.neg{color:var(--red)}
  .tile .lbl{font-family:var(--cond);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:12px;color:var(--muted);margin-top:7px;line-height:1.3}

  /* bars: one row per truck, money left over per truck after the period */
  .chart{margin:20px 0 0;background:#fff;border:2px solid var(--line);border-radius:16px;padding:14px 16px 12px;max-width:780px}
  .chart .ct{font-family:var(--cond);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:14px}
  .chart .cs{font-size:12.5px;color:var(--muted);margin:2px 0 10px}
  .legend{display:flex;flex-wrap:wrap;gap:14px;font-size:12px;color:var(--muted);margin:0 0 8px}
  .legend i{display:inline-block;width:14px;height:9px;border-radius:2px;margin-right:5px;vertical-align:middle}
  .row{display:grid;grid-template-columns:minmax(120px,210px) 1fr 62px;align-items:center;gap:10px;font-size:13px;line-height:1.2;padding:3px 0}
  .row .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .row .nm small{color:var(--muted);font-variant-numeric:tabular-nums}
  .row .tr{position:relative;height:16px}
  .row .zero{position:absolute;top:-3px;bottom:-3px;width:1px;background:#8d8470}
  .row .bar,.row .gh{position:absolute;top:3px;height:10px;border-radius:2px}
  .row .gh{top:0;height:16px;background:transparent;border:1.5px dashed var(--ghost)}
  .row .bar{background:var(--volt)}
  .row .bar.neg{background:var(--red)}
  .row .val{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
  .row .val.neg{color:var(--red)}

  .try{display:inline-block;margin:16px 0 0;font-weight:700;color:var(--volt-dark);text-decoration:none;border-bottom:2px solid #b9e3cd}
  .try:hover{border-bottom-color:var(--volt)}
  .why{margin:16px 0 0;background:var(--volt-light);border:2px solid #b9e3cd;border-radius:14px;padding:14px 18px;max-width:74ch}
  .why .lbl{font-family:var(--cond);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:13px;color:var(--volt-dark)}
  .why p{margin:6px 0 0}

  .wrapup{margin:56px 0 0;border-radius:18px;background:var(--road);color:#f4efe4;padding:22px 24px}
  .wrapup h2{font-family:var(--cond);font-weight:900;text-transform:uppercase;font-size:clamp(24px,4vw,32px);line-height:1.05}
  .wrapup ol{margin:12px 0 0 20px;max-width:74ch}
  .wrapup li{margin-top:10px}
  .wrapup b{color:#8fe0b9}
  .wrapup a{color:#8fe0b9}

  .sources{margin:40px 0 0;font-size:14px;color:var(--muted);max-width:74ch}
  .sources h3{font-family:var(--cond);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:15px;color:var(--ink)}
  .sources a{color:var(--muted)}
  .sources li{margin:6px 0 0 18px}
  footer.foot{margin-top:auto;padding:30px 0 34px;font-size:13px;color:var(--muted)}
  footer.foot a{color:var(--muted)}

  #engine{position:absolute;left:-10000px;top:0;width:1200px;height:800px;border:0;visibility:hidden}

  @media (max-width:700px){
    .tiles{grid-template-columns:1fr 1fr}
    .tiles .tile:last-child{grid-column:1 / -1}
    .hero{padding-top:26px}
    .row{grid-template-columns:minmax(0,118px) 1fr 54px;gap:8px;font-size:12px}
    .row .nm small{display:none}
    .wrapup{padding:18px 16px}
  }