/* Spritpreis-Zerlegung (Energiemonitor 1.0.6), scoped under .oem-sprit */
.oem-sprit{
  --bg:#0c1622;--card:#132030;--bd:#1f3044;--bd2:#2b4260;--text:#c8d4e2;--mut:#7d90a7;--mut2:#62758c;
  --blue:#4a8cff;--amber:#f3b544;--e5:#f2c94c;--diesel:#c5cbd3;
  --staat:#ff6b4a;--staat2:#ff8a6a;--prod:#5b8def;
  --c-est:#f2c94c;--c-co2:#53d695;--c-ebv:#8b9bb0;--c-mwst:#e07a5f;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  font-size:15px;line-height:1.5;color:var(--text);
  background:var(--bg);border:1px solid var(--bd);border-radius:16px;padding:22px 22px 14px;margin:1.5em 0 2em;
  box-sizing:border-box;max-width:100%;
}
.oem-sprit *,.oem-sprit *::before,.oem-sprit *::after{box-sizing:border-box}
.oem-sprit .oem-sprit-top{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--bd)}
.oem-sprit .oem-sprit-top h2,
body.single-post .entry-content .oem-sprit .oem-sprit-top h2,
body.single-post .entry-content > .oem-sprit .oem-sprit-top h2{
  margin:0 !important;
  color:#e8eef7 !important;
  font-size:22px !important;
  font-weight:800 !important;
  letter-spacing:-.3px;
  line-height:1.2;
  border-left:0 !important;
  padding-left:0 !important;
  background:transparent !important;
}
.oem-sprit .oem-sprit-top p{margin:6px 0 0;color:var(--mut);font-size:13.5px;max-width:560px}
.oem-sprit .live{display:flex;align-items:center;gap:10px;border:1px solid var(--bd);border-radius:999px;padding:7px 15px;font-size:12.5px;white-space:nowrap;color:var(--mut);flex:none}
.oem-sprit .live i{width:7px;height:7px;border-radius:50%;background:#2ec27e;box-shadow:0 0 0 4px rgba(46,194,126,.16)}
.oem-sprit .grid{display:grid;grid-template-columns:1fr;gap:16px}
.oem-sprit .card{background:var(--card);border:1px solid var(--bd);border-radius:14px;padding:18px 18px 14px;min-width:0;display:flex;flex-direction:column}
.oem-sprit .card .hd{display:flex;align-items:center;justify-content:space-between;gap:10px}
.oem-sprit .card .tt{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#a9b8c9}
.oem-sprit .badge{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;border:1px solid var(--bd2);color:var(--mut)}
.oem-sprit .badge.e5{color:var(--e5);border-color:rgba(242,201,76,.35)}
.oem-sprit .badge.di{color:var(--diesel);border-color:rgba(197,203,211,.35)}
.oem-sprit .price{margin:10px 0 4px;font-size:38px;font-weight:800;color:#fff;letter-spacing:-1.2px;line-height:1}
.oem-sprit .price small{font-size:14px;font-weight:600;color:var(--mut);margin-left:6px;letter-spacing:0}
.oem-sprit .split2{display:grid;grid-template-columns:1.15fr .85fr;gap:10px;margin:14px 0 12px}
.oem-sprit .blk{border-radius:12px;padding:12px 14px 10px;border:1px solid transparent;min-width:0}
.oem-sprit .blk.staat{background:rgba(255,107,74,.14);border-color:rgba(255,107,74,.55);box-shadow:inset 3px 0 0 var(--staat)}
.oem-sprit .blk.prod{background:rgba(91,141,239,.08);border-color:rgba(91,141,239,.28)}
.oem-sprit .blk .lab{font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;margin:0 0 6px}
.oem-sprit .blk.staat .lab{color:var(--staat2)}
.oem-sprit .blk.prod .lab{color:#9bb6e8}
.oem-sprit .blk .big{font-size:28px;font-weight:800;letter-spacing:-.8px;line-height:1;color:#fff}
.oem-sprit .blk.staat .big{color:#ffb39a}
.oem-sprit .blk .big small{font-size:13px;font-weight:700;margin-left:4px;letter-spacing:0;color:inherit;opacity:.85}
.oem-sprit .blk .sub{margin-top:6px;font-size:12.5px;color:var(--mut);line-height:1.35}
.oem-sprit .blk.staat .sub{color:#ffd0c2}
.oem-sprit .blk.staat .sub b{color:#fff;font-weight:800}
.oem-sprit .tank{margin:0 0 12px;padding:9px 12px;border-radius:10px;background:rgba(255,107,74,.08);border:1px dashed rgba(255,107,74,.4);font-size:13px;color:#ffd0c2;line-height:1.4}
.oem-sprit .tank b{color:#fff;font-weight:800}
.oem-sprit .senk-badge{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:rgba(243,181,68,.1);border:1px solid rgba(243,181,68,.45);display:flex;flex-direction:column;gap:4px}
.oem-sprit .sb-lab{font-size:11.5px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--amber)}
.oem-sprit .sb-save{font-size:12.5px;color:#e0cfa8;line-height:1.35}
.oem-sprit .sb-save b{color:#fff;font-weight:800}
.oem-sprit .cmp{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0 0 12px;font-size:12.5px;color:var(--mut)}
.oem-sprit .cmp b{color:#fff}
.oem-sprit .cmp i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.oem-sprit .cmp i.ghost{background:transparent;border:1.5px dashed var(--staat);width:9px;height:9px}
.oem-sprit .viz{display:grid;grid-template-columns:1fr;gap:6px;align-items:start;margin:4px 0 6px}
.oem-sprit .donut{height:200px;width:100%;max-width:260px;margin:0 auto;min-width:0}
.oem-sprit .grp{margin:0 0 10px}
.oem-sprit .grp:last-child{margin-bottom:0}
.oem-sprit .grp-h{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;margin:0 0 4px;padding-bottom:4px;border-bottom:1px solid #1a2a3d}
.oem-sprit .grp-h.staat{color:var(--staat2)}
.oem-sprit .grp-h.prod{color:#9bb6e8}
.oem-sprit .grp-h span:last-child{font-variant-numeric:tabular-nums;color:#fff;letter-spacing:0;text-transform:none;font-size:12px}
.oem-sprit .srow{display:grid;grid-template-columns:12px 1fr auto auto;gap:8px;align-items:center;padding:6px 0;font-size:12.5px;color:var(--mut)}
.oem-sprit .srow .dot{width:9px;height:9px;border-radius:2px}
.oem-sprit .srow .name{color:#dfe7f0;min-width:0}
.oem-sprit .srow .ct{font-variant-numeric:tabular-nums;color:#fff;font-weight:700;text-align:right;white-space:nowrap}
.oem-sprit .srow .pct{font-variant-numeric:tabular-nums;text-align:right;min-width:48px;white-space:nowrap}
.oem-sprit .spark{height:90px;margin:8px -2px 2px}
.oem-sprit .ft{display:flex;justify-content:space-between;gap:12px;margin-top:auto;padding-top:10px;border-top:1px solid #1a2a3d;font-size:11px;color:var(--mut2);line-height:1.4}
.oem-sprit .note{margin:16px 0 4px;background:rgba(74,140,255,.06);border:1px solid rgba(74,140,255,.22);border-radius:12px;padding:12px 14px;font-size:13px;color:var(--text)}
.oem-sprit .note b{color:#fff}
.oem-sprit .laden{padding:28px;text-align:center;color:var(--mut)}
.oem-sprit .err{color:#ff8a7d}
@media(max-width:860px){
  .oem-sprit{padding:16px 14px 12px;margin:1.2em 0 1.6em}
  .oem-sprit .oem-sprit-top{flex-direction:column;align-items:flex-start}
  body.single-post .entry-content .oem-sprit .oem-sprit-top h2,.oem-sprit .oem-sprit-top h2{font-size:19px !important}
  .oem-sprit .grid{grid-template-columns:1fr;gap:12px}
  .oem-sprit .price{font-size:34px}
  .oem-sprit .split2{grid-template-columns:1fr;gap:8px}
  .oem-sprit .blk .big{font-size:26px}
  .oem-sprit .donut{height:190px;max-width:240px}
  .oem-sprit .cmp{flex-direction:column;gap:4px}
  .oem-sprit .srow{font-size:12px;gap:6px}
  .oem-sprit .srow .pct{min-width:42px}
}

/* In Beiträgen: etwas breiter als der Lesetext */
body.single-post .entry-content > .oem-sprit{
  max-width: min(960px, 100%);
  width: 100%;
}
@media(min-width:900px){
  body.single-post .entry-content > .oem-sprit .grid{grid-template-columns:1fr 1fr}
}
