.tn-car-cost-page {
  --tn-car-ev-ink: #2f6f61;
  --tn-car-ev-line: #4f8d7f;
  --tn-car-ev-wash: rgba(47, 111, 97, .11);
  --tn-car-ev-fill: #3f7f70;
  --tn-car-ice-ink: #8b4a1e;
  --tn-car-ice-line: #a76430;
  --tn-car-ice-wash: rgba(139, 74, 30, .11);
  --tn-car-ice-fill: #9a5728;
}

.tn-car-cost-group[data-tn-vehicle],
.tn-car-cost-total[data-tn-vehicle] {
  position: relative;
  outline: 1px solid rgba(184, 168, 136, .34);
  outline-offset: -1px;
}

.tn-car-cost-group[data-tn-vehicle="ev"],
.tn-car-cost-total[data-tn-vehicle="ev"] {
  box-shadow: inset 3px 0 0 var(--tn-car-ev-line);
  background: linear-gradient(90deg, var(--tn-car-ev-wash), rgba(250, 246, 238, .08));
}

.tn-car-cost-group[data-tn-vehicle="ice"],
.tn-car-cost-total[data-tn-vehicle="ice"] {
  box-shadow: inset 3px 0 0 var(--tn-car-ice-line);
  background: linear-gradient(90deg, var(--tn-car-ice-wash), rgba(250, 246, 238, .08));
}

.tn-car-cost-group[data-tn-vehicle="ev"] .tn-car-cost-group-title,
.tn-car-cost-total[data-tn-vehicle="ev"] span,
.tn-car-cost-total[data-tn-vehicle="ev"] strong {
  color: var(--tn-car-ev-ink);
  -webkit-text-fill-color: var(--tn-car-ev-ink);
}

.tn-car-cost-group[data-tn-vehicle="ice"] .tn-car-cost-group-title,
.tn-car-cost-total[data-tn-vehicle="ice"] span,
.tn-car-cost-total[data-tn-vehicle="ice"] strong {
  color: var(--tn-car-ice-ink);
  -webkit-text-fill-color: var(--tn-car-ice-ink);
}

.tn-car-cost-group-title::before,
.tn-car-cost-total[data-tn-vehicle] span::before {
  content: '';
  display: inline-block;
  width: .62em;
  height: .62em;
  margin-right: .45em;
  border: 1px solid currentColor;
  background: currentColor;
  vertical-align: .02em;
}

.tn-car-cost-group[data-tn-vehicle="ev"] .tn-car-cost-input-wrap:focus-within {
  border-color: var(--tn-car-ev-line);
}

.tn-car-cost-group[data-tn-vehicle="ice"] .tn-car-cost-input-wrap:focus-within {
  border-color: var(--tn-car-ice-line);
}

.tn-car-cost-visual-row[aria-label^="전기차 "],
.tn-car-cost-visual-row[aria-label^="EV "],
.tn-car-cost-visual-row[aria-label^="Eléctrico "] {
  box-shadow: inset 3px 0 0 var(--tn-car-ev-line);
  background: linear-gradient(90deg, var(--tn-car-ev-wash), transparent 72%);
}

.tn-car-cost-visual-row[aria-label^="내연기관 "],
.tn-car-cost-visual-row[aria-label^="Gas car "],
.tn-car-cost-visual-row[aria-label^="ガソリン車 "],
.tn-car-cost-visual-row[aria-label^="Gasolina "],
.tn-car-cost-visual-row[aria-label^="Bensin "] {
  box-shadow: inset 3px 0 0 var(--tn-car-ice-line);
  background: linear-gradient(90deg, var(--tn-car-ice-wash), transparent 72%);
}

.tn-car-cost-visual-row[aria-label^="전기차 "] b,
.tn-car-cost-visual-row[aria-label^="EV "] b,
.tn-car-cost-visual-row[aria-label^="Eléctrico "] b {
  background: var(--tn-car-ev-fill);
}

.tn-car-cost-visual-row[aria-label^="내연기관 "] b,
.tn-car-cost-visual-row[aria-label^="Gas car "] b,
.tn-car-cost-visual-row[aria-label^="ガソリン車 "] b,
.tn-car-cost-visual-row[aria-label^="Gasolina "] b,
.tn-car-cost-visual-row[aria-label^="Bensin "] b {
  background: var(--tn-car-ice-fill);
}

body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-page,
body[data-scheme="auto"][data-l="dark"] .tn-car-cost-page,
body[data-scheme="auto"][data-d="dark"] .tn-car-cost-page,
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-page {
  --tn-car-ev-ink: #8ed1bf;
  --tn-car-ev-line: #5ea896;
  --tn-car-ev-wash: rgba(94, 168, 150, .18);
  --tn-car-ev-fill: #8ed1bf;
  --tn-car-ice-ink: #f0b27c;
  --tn-car-ice-line: #b97844;
  --tn-car-ice-wash: rgba(185, 120, 68, .18);
  --tn-car-ice-fill: #f0b27c;
}

body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-group[data-tn-vehicle="ev"],
body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-total[data-tn-vehicle="ev"],
body[data-scheme="auto"][data-l="dark"] .tn-car-cost-group[data-tn-vehicle="ev"],
body[data-scheme="auto"][data-l="dark"] .tn-car-cost-total[data-tn-vehicle="ev"],
body[data-scheme="auto"][data-d="dark"] .tn-car-cost-group[data-tn-vehicle="ev"],
body[data-scheme="auto"][data-d="dark"] .tn-car-cost-total[data-tn-vehicle="ev"],
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-group[data-tn-vehicle="ev"],
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-total[data-tn-vehicle="ev"] {
  background: linear-gradient(90deg, var(--tn-car-ev-wash), rgba(38, 26, 16, .12)) !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-group[data-tn-vehicle="ice"],
body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-total[data-tn-vehicle="ice"],
body[data-scheme="auto"][data-l="dark"] .tn-car-cost-group[data-tn-vehicle="ice"],
body[data-scheme="auto"][data-l="dark"] .tn-car-cost-total[data-tn-vehicle="ice"],
body[data-scheme="auto"][data-d="dark"] .tn-car-cost-group[data-tn-vehicle="ice"],
body[data-scheme="auto"][data-d="dark"] .tn-car-cost-total[data-tn-vehicle="ice"],
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-group[data-tn-vehicle="ice"],
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-total[data-tn-vehicle="ice"] {
  background: linear-gradient(90deg, var(--tn-car-ice-wash), rgba(38, 26, 16, .12)) !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-visual-row[aria-label^="전기차 "] b,
body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-visual-row[aria-label^="EV "] b,
body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-visual-row[aria-label^="Eléctrico "] b,
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="전기차 "] b,
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="EV "] b,
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="Eléctrico "] b {
  background: var(--tn-car-ev-fill);
}

body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-visual-row[aria-label^="내연기관 "] b,
body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-visual-row[aria-label^="Gas car "] b,
body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-visual-row[aria-label^="ガソリン車 "] b,
body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-visual-row[aria-label^="Gasolina "] b,
body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-car-cost-visual-row[aria-label^="Bensin "] b,
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="내연기관 "] b,
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="Gas car "] b,
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="ガソリン車 "] b,
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="Gasolina "] b,
html:is([data-scheme="dark"], [data-scheme="inverse"]) body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="Bensin "] b {
  background: var(--tn-car-ice-fill);
}

@media (prefers-color-scheme: dark) {
  body[data-scheme="auto"] .tn-car-cost-page,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-page {
    --tn-car-ev-ink: #8ed1bf;
    --tn-car-ev-line: #5ea896;
    --tn-car-ev-wash: rgba(94, 168, 150, .18);
    --tn-car-ev-fill: #8ed1bf;
    --tn-car-ice-ink: #f0b27c;
    --tn-car-ice-line: #b97844;
    --tn-car-ice-wash: rgba(185, 120, 68, .18);
    --tn-car-ice-fill: #f0b27c;
  }

  body[data-scheme="auto"] .tn-car-cost-group[data-tn-vehicle="ev"],
  body[data-scheme="auto"] .tn-car-cost-total[data-tn-vehicle="ev"],
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-group[data-tn-vehicle="ev"],
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-total[data-tn-vehicle="ev"] {
    background: linear-gradient(90deg, var(--tn-car-ev-wash), rgba(38, 26, 16, .12)) !important;
  }

  body[data-scheme="auto"] .tn-car-cost-group[data-tn-vehicle="ice"],
  body[data-scheme="auto"] .tn-car-cost-total[data-tn-vehicle="ice"],
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-group[data-tn-vehicle="ice"],
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-total[data-tn-vehicle="ice"] {
    background: linear-gradient(90deg, var(--tn-car-ice-wash), rgba(38, 26, 16, .12)) !important;
  }

  body[data-scheme="auto"] .tn-car-cost-visual-row[aria-label^="전기차 "] b,
  body[data-scheme="auto"] .tn-car-cost-visual-row[aria-label^="EV "] b,
  body[data-scheme="auto"] .tn-car-cost-visual-row[aria-label^="Eléctrico "] b,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="전기차 "] b,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="EV "] b,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="Eléctrico "] b {
    background: var(--tn-car-ev-fill);
  }

  body[data-scheme="auto"] .tn-car-cost-visual-row[aria-label^="내연기관 "] b,
  body[data-scheme="auto"] .tn-car-cost-visual-row[aria-label^="Gas car "] b,
  body[data-scheme="auto"] .tn-car-cost-visual-row[aria-label^="ガソリン車 "] b,
  body[data-scheme="auto"] .tn-car-cost-visual-row[aria-label^="Gasolina "] b,
  body[data-scheme="auto"] .tn-car-cost-visual-row[aria-label^="Bensin "] b,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="내연기관 "] b,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="Gas car "] b,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="ガソリン車 "] b,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="Gasolina "] b,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-car-cost-visual-row[aria-label^="Bensin "] b {
    background: var(--tn-car-ice-fill);
  }
}