/* Source: /assets/r162-app.css */
/* ===== r122-app.css ===== */

/* ===== assets/index-live-r45.css ===== */
:root {
  color: #fff;
  font-synthesis: none;
  --brand-red: #ff3b30;
  --control-glass: linear-gradient(145deg, #202023e0, #0a0a0ce6);
  --control-border: #45454b;
  --control-text: #f6eff0;
  --control-active: var(--brand-red);
  --control-active-border: var(--brand-red);
  background: #050505;
  font-family:
    SF Pro Display,
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    system-ui,
    sans-serif;
}

* {
  box-sizing: border-box;
}
html {
  background-color: #0b0709;
  background-image:
    linear-gradient(135deg, #16090b 0%, #250d11 34%, #09090c 72%, #17070a 100%),
    radial-gradient(at 14% 10%, rgba(116, 31, 26, 0.42) 0, transparent 29%),
    radial-gradient(at 88% 31%, rgba(88, 24, 25, 0.35) 0, transparent 31%),
    radial-gradient(at 31% 74%, rgba(63, 20, 22, 0.32) 0, transparent 28%),
    radial-gradient(at 76% 91%, rgba(93, 24, 27, 0.32) 0, transparent 30%);
  background-position:
    0 0,
    0 0,
    0 0,
    0 0;
  background-repeat: repeat, repeat, repeat, repeat;
  background-size:
    100% 100%,
    auto,
    auto,
    auto,
    auto;
  background-attachment: fixed;
  background-origin: padding-box, padding-box, padding-box, padding-box;
  background-clip: border-box, border-box, border-box, border-box;
  min-height: 100%;
}
body {
  background: transparent;
  min-width: 320px;
  min-height: 100%;
  margin: 0;
}
button,
input {
  font: inherit;
}
button {
  cursor: pointer;
}
.app-shell {
  background: 0 0;
  width: min(100%, 480px);
  min-height: 100dvh;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}
.app-content {
  z-index: 1;
  padding: calc(10px + env(safe-area-inset-top)) 20px
    calc(105px + env(safe-area-inset-bottom));
  min-height: 100dvh;
  position: relative;
}
.brand-header {
  justify-content: space-between;
  align-items: center;
  min-height: 54px;
  margin: 2px 0 18px;
  display: flex;
}
.brand-wordmark {
  letter-spacing: -1.45px;
  white-space: nowrap;
  justify-content: flex-start;
  align-items: center;
  gap: 7px;
  height: 46px;
  margin: 0;
  font-size: 29px;
  font-weight: 760;
  line-height: 1;
  display: flex;
}
.brand-wordmark img {
  object-fit: contain;
  filter: drop-shadow(0 5px 9px #0009);
  width: 42px;
  height: 42px;
  margin-right: 0;
}
.brand-wordmark span {
  color: #fff;
}
.brand-wordmark strong {
  color: #ff3b30;
  margin-left: -4px;
  position: relative;
  top: 1px;
  font-weight: bolder;
}
.round-button {
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  color: #fff;
  background: #14141661;
  border: 1px solid #343438;
  border-radius: 50%;
  place-items: center;
  width: 39px;
  height: 39px;
  padding: 10px;
  display: grid;
  box-shadow: inset 0 1px #ffffff14;
}
.round-button svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 100%;
  height: 100%;
}
.detail-close {
  font-size: 29px;
  line-height: 20px;
}
.location {
  align-items: center;
  gap: 10px;
  margin: 0 4px 17px;
  display: flex;
}
.location > span {
  font-size: 22px;
}
.location small,
.location strong {
  display: block;
}
.location small {
  color: #aaa;
  margin-bottom: 1px;
  font-size: 10px;
}
.location strong {
  font-size: 12px;
}
.price-hero {
  -webkit-backdrop-filter: blur(42px) saturate(150%);
  backdrop-filter: blur(42px) saturate(150%);
  color: #fff;
  background: linear-gradient(135deg, #30303470, #0a0a0c8c);
  border: 1px solid #45454a;
  border-radius: 27px;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 20px 18px 17px;
  display: flex;
  box-shadow:
    inset 0 1px #ffffff26,
    0 18px 43px #0008;
}
.price-hero > span {
  font-size: 14px;
  font-weight: 550;
}
.price-hero > strong {
  color: #ff3b30;
  letter-spacing: -2.8px;
  margin: 4px 0;
  font-size: 48px;
  font-weight: 800;
  line-height: 1.13;
}
.price-hero small {
  color: #bdbdc1;
  justify-content: space-between;
  align-self: stretch;
  font-size: 11px;
  display: flex;
}
.price-hero i {
  flex: 1;
}
.dashboard-section {
  margin-top: 19px;
}
.dashboard-section h2,
.detail-chart h2,
.detail-prices h2 {
  letter-spacing: -0.48px;
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}
.glass-card {
  -webkit-backdrop-filter: blur(30px) saturate(135%);
  backdrop-filter: blur(30px) saturate(135%);
  background: linear-gradient(135deg, #1e1e2080, #0a0a0bb3);
  border: 1px solid #323236;
  border-radius: 27px;
  box-shadow:
    inset 0 1px #ffffff18,
    0 16px 36px #0007;
}
.chart-block {
  padding: 18px 17px 15px;
}
.chart-range {
  background: #08080a7a;
  border: 1px solid #343438;
  border-radius: 12px;
  gap: 2px;
  margin-top: 12px;
  padding: 3px;
  display: inline-flex;
}
.chart-range button {
  color: #aaa;
  background: 0 0;
  border: 0;
  border-radius: 8px;
  min-width: 48px;
  padding: 5px 7px;
  font-size: 10px;
  font-weight: 630;
}
.fuel-chart {
  margin-top: 10px;
}
.chart-legend {
  color: #a9a9ad;
  gap: 13px;
  margin: 0 0 4px;
  font-size: 10px;
  display: flex;
}
.chart-legend span {
  align-items: center;
  gap: 5px;
  display: flex;
}
.chart-legend i {
  border-radius: 99px;
  width: 14px;
  height: 2px;
  display: block;
}
.fuel-chart svg {
  width: 100%;
  height: 112px;
  overflow: visible;
}
.chart-grid {
  fill: none;
  stroke: #29292c;
  stroke-width: 0.7px;
}
.chart-column {
  fill: #ff3b30;
  opacity: 0.13;
}
.chart-average {
  fill: none;
  stroke: #d4d4d8;
  opacity: 0.68;
  stroke-width: 1.35px;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 3 3;
}
.chart-line {
  fill: none;
  stroke: #ff3b30;
  stroke-width: 2.4px;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.chart-days {
  color: #b1b1b5;
  justify-content: space-between;
  margin-top: -2px;
  font-size: 10px;
  display: flex;
}
.comparison-card {
  padding: 18px 17px 15px;
}
.comparison-row {
  grid-template-columns: 85px 1fr 66px;
  align-items: center;
  gap: 11px;
  margin-top: 16px;
  font-size: 12px;
  display: grid;
}
.comparison-row span {
  color: #f0f0f2;
  font-weight: 520;
}
.comparison-row i {
  background: #252527;
  border-radius: 999px;
  height: 9px;
  display: block;
  overflow: hidden;
  box-shadow: inset 0 1px 2px #0008;
}
.comparison-row i b {
  background: linear-gradient(90deg, #ff3b30, #ff5148);
  border-radius: 999px;
  height: 100%;
  display: block;
  box-shadow: 0 0 12px #ff3b3055;
}
.comparison-row:last-child i b {
  box-shadow: none;
  background: #9a9a9e;
}
.comparison-row strong {
  color: #f0f0f2;
  text-align: right;
  font-size: 14px;
  font-weight: 690;
}
.comparison-row:first-of-type strong {
  color: #ff3b30;
}
.fuel-advice-card {
  padding: 18px 17px 16px;
  position: relative;
  overflow: hidden;
}
.fuel-advice-card:before {
  content: "";
  filter: blur(8px);
  pointer-events: none;
  background: radial-gradient(circle, #ff3b303b, #0000 68%);
  border-radius: 999px;
  width: 150px;
  height: 150px;
  position: absolute;
  inset: -40% -20% auto auto;
}
.fuel-advice-card small {
  color: #a8a8ad;
  margin-bottom: 7px;
  font-size: 10px;
  display: block;
  position: relative;
}
.fuel-advice-card h2 {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 700;
  position: relative;
}
.fuel-advice-card strong {
  color: var(--brand-red);
  text-shadow: 0 0 18px #ff3b3047;
  margin-bottom: 9px;
  font-size: 28px;
  font-weight: 760;
  line-height: 1.02;
  display: block;
  position: relative;
}
.fuel-advice-card p {
  color: #f1eeee;
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  position: relative;
}
.fuel-advice-card span {
  color: #aaaab0;
  margin-top: 9px;
  font-size: 10px;
  line-height: 1.35;
  display: block;
  position: relative;
}
.fuel-advice-card.is-good {
  border-color: #ff3b3075;
}
.fuel-advice-card.is-wait strong {
  color: #ff7a72;
}
.fuel-advice-card.is-neutral strong {
  color: #f0f0f2;
  text-shadow: none;
}
.favorites-block {
  padding: 0 17px 12px;
  overflow: hidden;
}
.favorites-block > header,
.detail-prices > header {
  justify-content: space-between;
  align-items: center;
  height: 53px;
  display: flex;
}
.favorites-block > header button {
  color: #ff3b30;
  background: 0 0;
  border: 0;
  padding: 0;
  font-size: 11px;
}
.favorites-block .station-card {
  background: #0808098a;
  border: 1px solid #313135;
  border-radius: 18px;
  margin: 5px 0 0;
  padding: 10px;
  box-shadow: inset 0 1px #ffffff0a;
}
.station-card {
  color: #fff;
  text-align: left;
  background: 0 0;
  border: 1px solid #0000;
  grid-template-columns: 31px 1fr auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 0;
  display: grid;
}
.result-list .station-card {
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
  background: linear-gradient(135deg, #1e1e2085, #0a0a0bad);
  border-color: #313135;
  border-radius: 18px;
  margin: 7px 0;
  padding: 12px;
  box-shadow:
    inset 0 1px #ffffff14,
    0 10px 24px #0005;
}
.station-logo {
  border-radius: 9px;
  place-items: center;
  width: 27px;
  height: 27px;
  font-size: 13px;
  font-weight: 800;
  display: grid;
}
.station-copy strong,
.station-copy small,
.station-value strong,
.station-value small {
  display: block;
}
.station-copy strong {
  font-size: 13px;
  font-weight: 670;
}
.station-copy small,
.station-value small {
  color: #aaa;
  margin-top: 2px;
  font-size: 10px;
}
.station-value {
  text-align: right;
}
.station-value strong {
  color: #ff3b30;
  font-size: 16px;
  font-weight: 760;
}
.station-value small {
  color: #bbb;
}
.fuel-tab-bar {
  left: 50%;
  bottom: calc(10px + env(safe-area-inset-bottom));
  -webkit-backdrop-filter: blur(30px) saturate(150%);
  backdrop-filter: blur(30px) saturate(150%);
  z-index: 5;
  background: #1212149c;
  border: 1px solid #38383c;
  border-radius: 29px;
  justify-content: space-between;
  gap: 7px;
  width: min(100% - 32px, 448px);
  height: 72px;
  padding: 8px 14px;
  display: flex;
  position: fixed;
  transform: translate(-50%);
  box-shadow:
    inset 0 1px #ffffff1c,
    0 18px 40px #0009;
}
.fuel-tab-bar button {
  color: #b5b5ba;
  background: 0 0;
  border: 0;
  border-radius: 19px;
  flex-direction: column;
  flex: 1;
  align-items: center;
  gap: 4px;
  min-width: 0;
  padding: 5px 6px;
  display: flex;
}
.fuel-tab-bar svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 21px;
  height: 21px;
}
.fuel-tab-bar small {
  font-size: 10px;
}
.fuel-tab-bar button.is-active {
  color: #ff3b30;
  background: linear-gradient(135deg, #43171477, #1e111233);
  box-shadow: inset 0 1px #ff8f891f;
}
.fuel-filter {
  z-index: 2;
  gap: 5px;
  display: flex;
  position: absolute;
  top: 14px;
  left: 14px;
  right: 14px;
}
.fuel-filter button {
  color: #e7e7e9;
  background: #1d1d1f;
  border: 0;
  border-radius: 13px;
  padding: 7px 11px;
  font-size: 11px;
}
.fuel-filter .is-active {
  color: #fff;
  background: #ff3b30;
}
.fuel-map {
  background: #0d0e10;
  border: 1px solid #343438;
  border-radius: 24px;
  height: 270px;
  margin-top: 14px;
  position: relative;
  overflow: hidden;
  box-shadow:
    inset 0 1px #ffffff12,
    0 14px 31px #0007;
}
.fuel-map-canvas {
  position: absolute;
  inset: 0;
}
.map-price-marker {
  color: #fff;
  background: #2d0a0be0;
  border: 1px solid #ff746d;
  border-radius: 999px;
  padding: 7px 9px;
  font-size: 11px;
  font-weight: 750;
  box-shadow:
    0 6px 18px #000a,
    0 0 16px #ff3b304d;
}
.map-price-marker.is-selected {
  background: #ff3b30;
  transform: scale(1.08);
}
.fuel-map [data-map-fallback] {
  color: #b9b9be;
  margin: 0;
  padding: 18px;
  font-size: 12px;
}
.fuel-map .leaflet-container {
  background: #0b0c0e;
  font-family: inherit;
}
.fuel-map .leaflet-tile-pane {
  filter: saturate(0.78) brightness(0.94) contrast(1.03);
}
.fuel-map .leaflet-control-attribution {
  color: #777;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  background: #050506b8;
  border-radius: 8px 0 0;
  font-size: 8px;
}
.fuel-map .leaflet-control-attribution a {
  color: #aaa;
}
.fuel-map-marker {
  background: 0 0;
  border: 0;
}
.fuel-map.is-compact {
  border-radius: 18px;
  height: 148px;
  margin: 0;
}
.fuel-map.is-compact .leaflet-control-attribution {
  display: none;
}
.search-field {
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
  color: #aaa;
  background: #19191ba3;
  border: 1px solid #343438;
  border-radius: 18px;
  align-items: center;
  gap: 9px;
  height: 48px;
  padding: 0 14px;
  display: flex;
  box-shadow: inset 0 1px #ffffff14;
}
.search-field input {
  color: #fff;
  background: 0 0;
  border: 0;
  outline: 0;
  flex: 1;
  min-width: 0;
  font-size: 14px;
}
.result-list {
  margin-top: 15px;
}
.empty-state,
.screen-lead {
  color: #aaa;
  margin: 4px 0 16px;
  font-size: 13px;
}
.menu-card {
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
  background: #141416b8;
  border: 1px solid #303034;
  border-radius: 19px;
  margin-bottom: 16px;
  padding: 0 14px;
  box-shadow: inset 0 1px #ffffff0c;
}
.menu-card button {
  color: #fff;
  text-align: left;
  background: 0 0;
  border: 0;
  border-bottom: 1px solid #292929;
  justify-content: space-between;
  width: 100%;
  padding: 16px 0;
  font-size: 14px;
  display: flex;
}
.menu-card button:last-child {
  border-bottom: 0;
}
.menu-card span {
  color: #999;
  font-size: 18px;
  line-height: 12px;
}
.menu-card em {
  color: #8c8c90;
  font-size: 11px;
  font-style: normal;
}
.menu-card.muted {
  opacity: 0.8;
}
.detail-view {
  background: 0 0;
  min-height: 100%;
}
.detail-fuel {
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  color: #fff;
  background: #18181a9e;
  border: 1px solid #323236;
  border-radius: 17px;
  justify-content: space-between;
  width: 100%;
  margin: 0 0 18px;
  padding: 14px;
  font-size: 13px;
  display: flex;
}
.detail-price {
  -webkit-backdrop-filter: blur(28px);
  backdrop-filter: blur(28px);
  background: linear-gradient(135deg, #1e1e2080, #0a0a0bb3);
  border: 1px solid #323236;
  border-radius: 22px;
  padding: 18px;
  box-shadow:
    inset 0 1px #ffffff16,
    0 14px 30px #0006;
}
.detail-price span,
.detail-price small {
  color: #aaa;
  font-size: 11px;
  display: block;
}
.detail-price strong {
  letter-spacing: -1.4px;
  margin: 5px 0;
  font-size: 31px;
  display: block;
}
.detail-price b {
  float: right;
  color: #ff3b30;
}
.detail-chart {
  -webkit-backdrop-filter: blur(28px);
  backdrop-filter: blur(28px);
  background: linear-gradient(135deg, #1e1e2080, #0a0a0bb3);
  border: 1px solid #323236;
  border-radius: 22px;
  margin: 20px 0;
  padding: 18px;
  box-shadow:
    inset 0 1px #ffffff16,
    0 14px 30px #0006;
}
.detail-prices {
  -webkit-backdrop-filter: blur(28px);
  backdrop-filter: blur(28px);
  background: linear-gradient(135deg, #1e1e2080, #0a0a0bb3);
  border: 1px solid #323236;
  border-radius: 22px;
  padding: 0 16px;
  overflow: hidden;
  box-shadow:
    inset 0 1px #ffffff16,
    0 14px 30px #0006;
}
.detail-prices header span {
  color: #aaa;
  font-size: 10px;
}
.detail-prices p {
  border-top: 1px solid #292929;
  justify-content: space-between;
  margin: 0;
  padding: 13px 0;
  font-size: 13px;
  display: flex;
}
.detail-prices p strong {
  font-size: 13px;
}
@media (width>=720px) {
  body {
    background: #060606;
  }
  .app-shell {
    box-shadow:
      0 0 0 1px #242424,
      0 28px 80px #000;
  }
  .fuel-tab-bar {
    border-radius: 16px 16px 0 0;
  }
}
.station-value .price-change {
  color: #bbb;
  font-size: 9px;
  font-weight: 620;
}
.price-change.is-lower {
  color: #30d158;
}
.detail-chart .chart-range {
  margin-top: 12px;
}
.brand-wordmark {
  color: inherit;
  text-align: left;
  background: 0 0;
  border: 0;
  padding: 0;
}
.header-actions {
  align-items: center;
  gap: 8px;
  display: flex;
}
.detail-close {
  padding: 9px;
  font-size: 0;
  line-height: 1;
}
.round-button:active,
.refresh-pill:active,
.brand-wordmark:active {
  transform: scale(0.96);
}
.location {
  justify-content: flex-start;
}
.location .refresh-pill {
  margin-left: auto;
}
.refresh-pill {
  -webkit-backdrop-filter: blur(22px) saturate(125%);
  backdrop-filter: blur(22px) saturate(125%);
  color: #c8c8cc;
  background: #0b0b0d8a;
  border: 1px solid #303034;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 7px 9px;
  font-size: 9px;
  font-weight: 620;
  display: inline-flex;
  box-shadow: inset 0 1px #ffffff0e;
}
.refresh-pill svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 13px;
  height: 13px;
}
.detail-price .refresh-pill {
  margin-top: 14px;
}
.glass-card {
  -webkit-backdrop-filter: blur(34px) saturate(125%);
  backdrop-filter: blur(34px) saturate(125%);
  background: linear-gradient(145deg, #0d0d108f, #040406b8);
  border-color: #2c2c31;
}
.price-hero {
  background: linear-gradient(145deg, #1414187a, #040406ad);
  border-color: #36363b;
}
.result-list .station-card,
.detail-price,
.detail-chart,
.detail-prices {
  background: linear-gradient(145deg, #0c0c0f87, #040406b3);
  border-color: #2c2c31;
}
.chart-layout {
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: start;
  gap: 7px;
  display: grid;
}
.chart-scale {
  color: #85858b;
  white-space: nowrap;
  text-align: right;
  flex-direction: column;
  justify-content: space-between;
  height: 112px;
  padding: 6px 0 8px;
  font-size: 8px;
  line-height: 1;
  display: flex;
}
.chart-scroll {
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
  min-width: 0;
  padding-bottom: 3px;
  overflow-x: auto;
}
.chart-scroll::-webkit-scrollbar {
  display: none;
}
.chart-canvas {
  width: var(--chart-width);
  min-width: 100%;
}
.chart-canvas svg {
  width: 100%;
  height: 112px;
  display: block;
  overflow: visible;
}
.chart-labels {
  color: #96969c;
  align-items: start;
  margin-top: 1px;
  font-size: 8px;
  line-height: 1.15;
  display: grid;
}
.chart-labels span {
  text-align: center;
  white-space: nowrap;
}
.chart-grid {
  stroke: #252529;
}
.detail-chart .fuel-chart {
  margin-top: 12px;
}
.chart-fixed {
  width: 100%;
  min-width: 0;
  padding-bottom: 3px;
  overflow: hidden;
}
.chart-fixed .chart-canvas {
  width: 100%;
  min-width: 0;
}
.fuel-chart.is-detail .chart-grid {
  stroke: #29292d;
  stroke-width: 0.55px;
}
.fuel-chart.is-detail .chart-labels {
  color: #a0a0a5;
  font-size: 8px;
}
.fuel-chart.is-detail .chart-canvas svg {
  touch-action: pan-y;
  cursor: crosshair;
  height: 188px;
}
.fuel-chart.is-detail .chart-labels {
  margin-top: 4px;
  font-size: 8px;
}
.chart-selection-line {
  stroke: #ff8b84;
  stroke-width: 1px;
  stroke-dasharray: 2 3;
}
.chart-selection-point {
  stroke: #08080a;
  stroke-width: 1.6px;
}
.chart-selection-readout {
  color: #c8c8cc;
  background: #ff3b3014;
  border: 1px solid #3a3032;
  border-radius: 12px;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0 7px;
  margin: 10px 0 5px;
  padding: 8px 10px;
  overflow: hidden;
  font-size: 8px;
  display: flex;
}
.chart-selection-readout strong {
  color: #ff6c64;
  font-size: 10px;
  white-space: nowrap;
}
.chart-selection-readout > :not(:first-child):before {
  content: "·";
  color: #777;
  margin-right: 7px;
}
.chart-selection-readout span { white-space: nowrap; }
.map-location-button {
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  color: #ececef;
  text-align: left;
  background: #0d0d1094;
  border: 1px solid #353539;
  border-radius: 15px;
  width: 100%;
  margin-top: 10px;
  padding: 11px 13px;
  font-size: 12px;
}
.map-message {
  color: #a8a8ad;
  margin: 8px 3px 0;
  font-size: 11px;
}
.result-list .station-result {
  background: linear-gradient(145deg, #0c0c0f87, #040406b3);
  border: 1px solid #313135;
  border-radius: 18px;
  margin: 8px 0;
  box-shadow:
    inset 0 1px #ffffff14,
    0 10px 24px #0005;
}
.result-list .station-result .station-card {
  box-shadow: none;
  background: 0 0;
  border: 0;
  margin: 0;
}
.station-card.is-selected {
  background: #ff3b3014;
  outline: 1px solid #ff665f;
}
.route-chooser {
  padding: 0 12px 11px;
}
.route-trigger,
.route-options a {
  color: #fff;
  background: #ffffff0f;
  border: 1px solid #3a3a3e;
  border-radius: 12px;
  padding: 9px 11px;
  font-size: 11px;
  text-decoration: none;
}
.route-trigger {
  text-align: left;
  width: 100%;
}
.route-options {
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin-top: 8px;
  display: grid;
}
.route-options span {
  color: #a7a7ac;
  grid-column: 1/-1;
  font-size: 10px;
}
.route-options a {
  text-align: center;
}
.detail-card {
  -webkit-backdrop-filter: blur(34px) saturate(125%);
  backdrop-filter: blur(34px) saturate(125%);
  background: linear-gradient(145deg, #0d0d1094, #040406bd);
  border: 1px solid #2d2d32;
  border-radius: 23px;
  margin: 0 0 16px;
  box-shadow:
    inset 0 1px #ffffff16,
    0 16px 34px #0007;
}
.station-detail-card {
  padding: 17px;
}
.station-identity {
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  display: grid;
}
.station-identity .station-logo {
  border-radius: 13px;
  width: 42px;
  height: 42px;
  font-size: 18px;
}
.station-identity small,
.detail-prices header small {
  color: #8f8f95;
  margin: 1px 0 2px;
  font-size: 9px;
  display: block;
}
.station-identity h2 {
  letter-spacing: -0.35px;
  margin: 0;
  font-size: 18px;
  line-height: 1.15;
}
.station-address {
  color: #b1b1b6;
  margin: 4px 0 0;
  font-size: 11px;
  line-height: 1.35;
}
.station-meta {
  color: #a5a5aa;
  align-items: center;
  gap: 8px;
  margin: 13px 0 14px;
  font-size: 10px;
  display: flex;
}
.station-meta span {
  align-items: center;
  gap: 5px;
  display: inline-flex;
}
.station-meta span + span:before {
  content: "";
  background: #5d5d62;
  border-radius: 50%;
  width: 3px;
  height: 3px;
}
.station-meta .is-open {
  color: #30d158;
}
.station-meta .is-open:before,
.station-meta .is-closed:before {
  content: "";
  background: #30d158;
  border-radius: 50%;
  width: 6px;
  height: 6px;
  box-shadow: 0 0 8px #30d15866;
}
.station-meta .is-closed {
  color: #ff8b84;
}
.station-meta .is-closed:before {
  background: #ff645c;
  box-shadow: 0 0 8px #ff3b3055;
}
.station-mini-map {
  margin-top: 2px;
}
.station-route {
  margin-top: 10px;
}
.station-route .route-chooser {
  padding: 0;
}
.station-route .route-trigger {
  color: #fff;
  background: linear-gradient(135deg, #ff3b302e, #50141426);
  border-color: #4a2b2c;
  justify-content: center;
  align-items: center;
  font-weight: 680;
  display: flex;
}
.detail-prices {
  padding: 16px;
  overflow: visible;
}
.detail-prices > header {
  height: auto;
  margin-bottom: 13px;
}
.detail-prices > header h2 {
  margin: 0;
  font-size: 16px;
}
.detail-prices > header > span {
  color: #89898f;
  font-size: 9px;
}
.detail-price-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  display: grid;
}
.detail-price-card {
  color: #fff;
  text-align: left;
  background: #06060880;
  border: 1px solid #303035;
  border-radius: 15px;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  min-width: 0;
  min-height: 86px;
  padding: 11px 9px;
  display: flex;
  box-shadow: inset 0 1px #ffffff0b;
}
.detail-price-card > span {
  color: #a4a4aa;
  white-space: nowrap;
  font-size: 9px;
}
.detail-price-card > strong {
  letter-spacing: -0.65px;
  white-space: nowrap;
  width: 100%;
  font-size: 17px;
  line-height: 1;
}
.detail-price-card > small {
  color: #a8a8ad;
  font-size: 8px;
}
.detail-price-card.is-selected {
  background: linear-gradient(145deg, #ff3b3024, #2d0a0b40);
  border-color: #75302e;
  box-shadow:
    inset 0 1px #ff9a941c,
    0 0 20px #ff3b3014;
}
.detail-price-card.is-selected > span,
.detail-price-card.is-selected > strong {
  color: #ff5a51;
}
.detail-price-card:active {
  transform: scale(0.97);
}
.detail-freshness {
  border-top: 1px solid #29292d;
  align-items: center;
  gap: 10px;
  margin-top: 13px;
  padding-top: 12px;
  display: flex;
}
.freshness-copy {
  color: #919197;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  font-size: 9px;
  display: flex;
}
.detail-freshness .refresh-pill {
  flex: none;
  margin: 0 0 0 auto;
}
.detail-chart {
  margin: 0;
  padding: 16px;
}
.detail-chart > header {
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  display: flex;
}
.detail-chart > header h2 {
  margin: 0;
}
.detail-chart > header > span {
  color: #8f8f95;
  font-size: 9px;
}
.detail-chart .chart-layout {
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 6px;
}
.detail-chart .chart-scale {
  font-size: 7px;
}
.detail-chart .chart-legend {
  margin-top: 9px;
}
.fuel-map .leaflet-control-attribution {
  opacity: 0.24;
  background: #03030480;
  padding: 1px 3px;
  font-size: 6px;
  line-height: 1.1;
}
.fuel-map .leaflet-control-attribution:hover {
  opacity: 0.5;
}
.station-logo {
  overflow: hidden;
}
.station-logo .brand-name {
  letter-spacing: -0.35px;
  white-space: nowrap;
  max-width: 100%;
  font-size: 7px;
  font-weight: 850;
  line-height: 1;
  display: block;
}
.station-logo.aral {
  color: #0c397b;
  background: linear-gradient(135deg, #f5f7ff, #b6c8ef);
}
.station-logo.aral .brand-name {
  letter-spacing: 0.25px;
}
.station-logo.shell {
  color: #cf1620;
  background: linear-gradient(135deg, #ffd833, #e7a90a);
}
.station-logo.total {
  color: #1b4180;
  background: linear-gradient(135deg, #f8f8f8, #d7e7ff);
}
.station-identity .station-logo .brand-name {
  font-size: 8px;
}
.chart-context {
  color: #949499;
  margin: 4px 0 0;
  font-size: 9px;
}
.chart-line {
  stroke: #ad534d;
}
.fuel-chart circle {
  fill: #ad534d;
}
.chart-selection-today {
  fill: #b95b55;
}
.fuel-preference {
  margin: 0 0 16px;
  padding: 17px;
}
.fuel-preference > small {
  color: #8f8f95;
  font-size: 9px;
}
.fuel-preference h2 {
  letter-spacing: -0.35px;
  margin: 4px 0 13px;
  font-size: 16px;
}
.fuel-preference [data-fuel-preference] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  display: grid;
}
.fuel-preference button {
  color: #b9b9be;
  background: #06060880;
  border: 1px solid #303035;
  border-radius: 13px;
  min-height: 42px;
  padding: 7px 5px;
  font-size: 10px;
}
.fuel-preference button.is-active {
  color: #ffaaa4;
  background: linear-gradient(145deg, #ad534d33, #280f1052);
  border-color: #70403e;
  box-shadow: inset 0 1px #ffb2aa1c;
}
.chart-block {
  overflow: hidden;
}
.fuel-chart svg,
.chart-canvas svg {
  height: 224px;
}
.chart-scale {
  color: #9d9093;
  height: 224px;
  padding: 12px 0 18px;
  font-size: 9px;
}
.chart-grid {
  stroke: #4b3438;
  stroke-opacity: 0.56;
}
.chart-area {
  fill: url(#fuel-chart-area);
}
.chart-line {
  stroke: #ff3342;
  stroke-width: 3.25px;
  filter: drop-shadow(0 0 7px #ff3342b8);
}
.chart-average {
  stroke: #ffb0b6;
  stroke-width: 1.9px;
  opacity: 0.94;
  stroke-dasharray: 2 6;
}
.chart-selection-readout {
  color: #f4dfe0;
  background: linear-gradient(135deg, #69141d85, #130c0eeb);
  border-color: #753137;
  box-shadow:
    0 10px 22px #0008,
    inset 0 1px #ffafb51c;
}
.fuel-chart.is-detail .chart-canvas svg {
  height: 236px;
}
.fuel-chart.is-detail .chart-scale {
  height: 236px;
  padding: 15px 0 19px;
}
.fuel-chart.is-detail .chart-line,
.fuel-chart.is-detail .chart-average {
  stroke-linecap: round;
  stroke-linejoin: round;
}
.chart-labels,
.fuel-chart.is-detail .chart-labels {
  color: #b9abaf;
  font-size: 9px;
}
.chart-range,
.refresh-pill,
.map-location-button,
.route-trigger,
.route-options a {
  color: #f5ecec;
  background: linear-gradient(145deg, #2a1d20eb, #0c0a0ce0);
  border-color: #4a3639;
  box-shadow:
    inset 0 1px #ffffff14,
    0 8px 20px #0006;
}
.chart-range button.is-active {
  color: #fff;
  background: linear-gradient(145deg, #7d1e28, #441116);
  box-shadow:
    inset 0 1px #ffbdc126,
    0 0 13px #ee243433;
}
.fuel-preference,
.nearby-radius {
  margin: 0 0 16px;
  padding: 17px;
}
.nearby-radius > small {
  color: #8f8f95;
  font-size: 9px;
}
.nearby-radius h2 {
  letter-spacing: -0.35px;
  margin: 4px 0 13px;
  font-size: 16px;
}
.nearby-radius [data-nearby-radius] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  display: grid;
}
.nearby-radius button {
  color: #c6b9bc;
  background: linear-gradient(145deg, #1b1618db, #080708c2);
  border: 1px solid #3b3033;
  border-radius: 13px;
  min-height: 42px;
  padding: 7px 5px;
  font-size: 10px;
}
.nearby-radius button.is-active {
  color: #fff;
  background: linear-gradient(145deg, #b024307a, #400e14b3);
  border-color: #a42e38;
  box-shadow:
    inset 0 1px #ffbbc020,
    0 0 14px #e9283530;
}
@media (prefers-reduced-motion: no-preference) {
  .glass-card,
  .price-hero,
  .station-result,
  .fuel-map,
  .detail-card {
    animation: 0.34s cubic-bezier(0.2, 0.8, 0.2, 1) both fueldash-rise;
  }
  .map-price-marker {
    animation: 0.28s cubic-bezier(0.2, 0.9, 0.2, 1) both fueldash-pop;
  }
  .chart-line {
    animation: 2.6s ease-in-out infinite alternate fueldash-glow;
  }
}
@keyframes fueldash-rise {
  0% {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fueldash-pop {
  0% {
    opacity: 0;
    transform: scale(0.82);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes fueldash-glow {
  0% {
    filter: drop-shadow(0 0 4px #ff334273);
  }
  to {
    filter: drop-shadow(0 0 10px #ff3342e6);
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  :before,
  :after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
.search-field svg {
  fill: none;
  stroke: #ff6a73;
  stroke-width: 2.05px;
  stroke-linecap: round;
  filter: drop-shadow(0 0 5px #ff334255);
  flex: none;
  width: 21px;
  height: 21px;
}
.map-price-marker {
  flex-direction: column;
  align-items: center;
  gap: 1px;
  min-width: 86px;
  padding: 5px 8px;
  line-height: 1.05;
  display: flex;
}
.map-price-marker-price {
  letter-spacing: -0.2px;
  font-size: 11px;
  font-weight: 800;
}
.map-price-marker-name {
  color: #ffdedf;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 76px;
  font-size: 8px;
  font-weight: 700;
  line-height: 1.05;
  overflow: hidden;
}
.fuel-map-marker .map-price-marker {
  white-space: normal;
  width: auto;
}
.round-button,
.refresh-pill,
.map-location-button,
.route-trigger,
.route-options a,
.fuel-preference button,
.nearby-radius button,
.detail-price-card {
  border-color: var(--control-border);
  background: var(--control-glass);
  color: var(--control-text);
  box-shadow:
    inset 0 1px #ffffff18,
    0 8px 20px #0007;
}
.chart-range {
  border-color: var(--control-border);
  background: var(--control-glass);
  box-shadow:
    inset 0 1px #ffffff18,
    0 8px 20px #0007;
}
.chart-range button {
  color: #d8cdd0;
}
.chart-range button.is-active,
.fuel-preference button.is-active,
.nearby-radius button.is-active,
.detail-price-card.is-selected {
  border-color: var(--control-active-border);
  background: var(--control-active);
  color: #fff;
  box-shadow:
    inset 0 1px #ffd0d330,
    0 7px 18px #e9263938;
}
.fuel-preference button.is-active > span,
.fuel-preference button.is-active > strong,
.nearby-radius button.is-active > span,
.detail-price-card.is-selected > span,
.detail-price-card.is-selected > strong {
  color: #fff;
}
.detail-price-card.is-selected > small {
  color: #ffe2e4;
}
.station-route .route-trigger {
  border-color: var(--control-border);
  background: var(--control-glass);
  color: var(--control-text);
  box-shadow:
    inset 0 1px #ffffff18,
    0 8px 20px #0007;
}
.glass-card,
.price-hero,
.station-result,
.fuel-map,
.detail-card,
.map-price-marker,
.chart-line {
  animation: none !important;
}
.map-price-marker {
  transition:
    transform 0.18s,
    background 0.18s,
    box-shadow 0.18s;
}
:where(button, .route-options a):active {
  transform: scale(0.975);
}
.route-options[hidden] {
  display: none !important;
}
.chart-line {
  stroke: var(--brand-red);
  filter: drop-shadow(0 0 7px #ff3b3099);
}
.chart-average {
  stroke: #fff;
  opacity: 0.48;
}
.legend-today {
  background: var(--brand-red);
  box-shadow: 0 0 10px #ff3b308a;
}
.legend-average {
  opacity: 0.48;
  border-radius: 0;
  background: repeating-linear-gradient(90deg, #fff 0 4px, transparent 4px 7px);
}
.fuel-chart circle,
.chart-selection-today {
  fill: var(--brand-red);
}
.chart-selection-average {
  fill: #fff;
}
.chart-selection-line {
  stroke: var(--brand-red);
}
.chart-selection-readout {
  background: #ff3b301a;
  border-color: #ff3b3073;
}
.chart-selection-readout strong {
  color: var(--brand-red);
}
.search-field svg {
  stroke: var(--brand-red);
  filter: drop-shadow(0 0 5px #ff3b3057);
}
.map-price-marker {
  background: #1e0c0ee6;
  border-color: #ff3b308c;
}
.map-price-marker.is-selected {
  background: var(--brand-red);
  border-color: var(--brand-red);
  box-shadow:
    0 8px 20px #000a,
    0 0 14px #ff3b3061;
}
.chart-range button.is-active,
.fuel-preference button.is-active,
.nearby-radius button.is-active,
.detail-price-card.is-selected {
  background: var(--brand-red);
  border-color: var(--brand-red);
  box-shadow:
    inset 0 1px #ffffff2e,
    0 7px 18px #ff3b3042;
}
.price-change.is-lower {
  color: #30d158;
  text-shadow: 0 0 8px #30d15852;
}
.price-change.is-higher {
  color: var(--brand-red);
}
.comparison-row i b {
  box-shadow: none;
  background: #66666c;
}
.comparison-row strong {
  color: #e9e4e5;
}
.comparison-row.is-lowest i b {
  background: var(--brand-red);
  box-shadow: 0 0 10px #ff3b3057;
}
.comparison-row.is-lowest strong {
  color: var(--brand-red);
}
.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
  position: absolute;
  top: 0;
  left: 0;
}
.leaflet-container {
  overflow: hidden;
}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}
.leaflet-tile::selection {
  background: 0 0;
}
.leaflet-safari .leaflet-tile {
  image-rendering: -webkit-optimize-contrast;
}
.leaflet-safari .leaflet-tile-container {
  -webkit-transform-origin: 0 0;
  width: 1600px;
  height: 1600px;
}
.leaflet-marker-icon,
.leaflet-marker-shadow {
  display: block;
}
.leaflet-container .leaflet-overlay-pane svg {
  max-width: none !important;
  max-height: none !important;
}
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
  width: auto;
  padding: 0;
  max-width: none !important;
  max-height: none !important;
}
.leaflet-container img.leaflet-tile {
  mix-blend-mode: plus-lighter;
}
.leaflet-container.leaflet-touch-zoom {
  -ms-touch-action: pan-x pan-y;
  touch-action: pan-x pan-y;
}
.leaflet-container.leaflet-touch-drag {
  -ms-touch-action: pinch-zoom;
  touch-action: none;
  touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
  -ms-touch-action: none;
  touch-action: none;
}
.leaflet-container {
  -webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
  -webkit-tap-highlight-color: #33b5e566;
}
.leaflet-tile {
  filter: inherit;
  visibility: hidden;
}
.leaflet-tile-loaded {
  visibility: inherit;
}
.leaflet-zoom-box {
  box-sizing: border-box;
  z-index: 800;
  width: 0;
  height: 0;
}
.leaflet-overlay-pane svg {
  -moz-user-select: none;
}
.leaflet-pane {
  z-index: 400;
}
.leaflet-tile-pane {
  z-index: 200;
}
.leaflet-overlay-pane {
  z-index: 400;
}
.leaflet-shadow-pane {
  z-index: 500;
}
.leaflet-marker-pane {
  z-index: 600;
}
.leaflet-tooltip-pane {
  z-index: 650;
}
.leaflet-popup-pane {
  z-index: 700;
}
.leaflet-map-pane canvas {
  z-index: 100;
}
.leaflet-map-pane svg {
  z-index: 200;
}
.leaflet-vml-shape {
  width: 1px;
  height: 1px;
}
.lvml {
  behavior: url(#default#VML);
  display: inline-block;
  position: absolute;
}
.leaflet-control {
  z-index: 800;
  pointer-events: visiblePainted;
  pointer-events: auto;
  position: relative;
}
.leaflet-top,
.leaflet-bottom {
  z-index: 1000;
  pointer-events: none;
  position: absolute;
}
.leaflet-top {
  top: 0;
}
.leaflet-right {
  right: 0;
}
.leaflet-bottom {
  bottom: 0;
}
.leaflet-left {
  left: 0;
}
.leaflet-control {
  float: left;
  clear: both;
}
.leaflet-right .leaflet-control {
  float: right;
}
.leaflet-top .leaflet-control {
  margin-top: 10px;
}
.leaflet-bottom .leaflet-control {
  margin-bottom: 10px;
}
.leaflet-left .leaflet-control {
  margin-left: 10px;
}
.leaflet-right .leaflet-control {
  margin-right: 10px;
}
.leaflet-fade-anim .leaflet-popup {
  opacity: 0;
  transition: opacity 0.2s linear;
}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
  opacity: 1;
}
.leaflet-zoom-animated {
  transform-origin: 0 0;
}
svg.leaflet-zoom-animated {
  will-change: transform;
}
.leaflet-zoom-anim .leaflet-zoom-animated {
  -webkit-transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.25, 1);
  -moz-transition: -moz-transform 0.25s cubic-bezier(0, 0, 0.25, 1);
  transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1);
}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
  transition: none;
}
.leaflet-zoom-anim .leaflet-zoom-hide {
  visibility: hidden;
}
.leaflet-interactive {
  cursor: pointer;
}
.leaflet-grab {
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: grab;
}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
  cursor: crosshair;
}
.leaflet-popup-pane,
.leaflet-control {
  cursor: auto;
}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
  cursor: move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: grabbing;
}
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
  pointer-events: none;
}
.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
  pointer-events: visiblePainted;
  pointer-events: auto;
}
.leaflet-container {
  outline-offset: 1px;
  background: #ddd;
}
.leaflet-container a {
  color: #0078a8;
}
.leaflet-zoom-box {
  background: #ffffff80;
  border: 2px dotted #38f;
}
.leaflet-container {
  font-family:
    Helvetica Neue,
    Arial,
    Helvetica,
    sans-serif;
  font-size: 0.75rem;
  line-height: 1.5;
}
.leaflet-bar {
  border-radius: 4px;
  box-shadow: 0 1px 5px #000000a6;
}
.leaflet-bar a {
  text-align: center;
  color: #000;
  background-color: #fff;
  border-bottom: 1px solid #ccc;
  width: 26px;
  height: 26px;
  line-height: 26px;
  text-decoration: none;
  display: block;
}
.leaflet-bar a,
.leaflet-control-layers-toggle {
  background-position: 50%;
  background-repeat: no-repeat;
  display: block;
}
.leaflet-bar a:hover,
.leaflet-bar a:focus {
  background-color: #f4f4f4;
}
.leaflet-bar a:first-child {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.leaflet-bar a:last-child {
  border-bottom: none;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}
.leaflet-bar a.leaflet-disabled {
  cursor: default;
  color: #bbb;
  background-color: #f4f4f4;
}
.leaflet-touch .leaflet-bar a {
  width: 30px;
  height: 30px;
  line-height: 30px;
}
.leaflet-touch .leaflet-bar a:first-child {
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
}
.leaflet-touch .leaflet-bar a:last-child {
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
}
.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
  text-indent: 1px;
  font:
    700 18px Lucida Console,
    Monaco,
    monospace;
}
.leaflet-touch .leaflet-control-zoom-in,
.leaflet-touch .leaflet-control-zoom-out {
  font-size: 22px;
}
.leaflet-control-layers {
  background: #fff;
  border-radius: 5px;
  box-shadow: 0 1px 5px #0006;
}
.leaflet-control-layers-toggle {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAACf0lEQVR4AY1UM3gkARTePdvdoTxXKc+qTl3aU5U6b2Kbkz3Gtq3Zw6ziLGNPzrYx7946Tr6/ee/XeCQ4D3ykPtL5tHno4n0d/h3+xfuWHGLX81cn7r0iTNzjr7LrlxCqPtkbTQEHeqOrTy4Yyt3VCi/IOB0v7rVC7q45Q3Gr5K6jt+3Gl5nCoDD4MtO+j96Wu8atmhGqcNGHObuf8OM/x3AMx38+4Z2sPqzCxRFK2aF2e5Jol56XTLyggAMTL56XOMoS1W4pOyjUcGGQdZxU6qRh7B9Zp+PfpOFlqt0zyDZckPi1ttmIp03jX8gyJ8a/PG2yutpS/Vol7peZIbZcKBAEEheEIAgFbDkz5H6Zrkm2hVWGiXKiF4Ycw0RWKdtC16Q7qe3X4iOMxruonzegJzWaXFrU9utOSsLUmrc0YjeWYjCW4PDMADElpJSSQ0vQvA1Tm6/JlKnqFs1EGyZiFCqnRZTEJJJiKRYzVYzJck2Rm6P4iH+cmSY0YzimYa8l0EtTODFWhcMIMVqdsI2uiTvKmTisIDHJ3od5GILVhBCarCfVRmo4uTjkhrhzkiBV7SsaqS+TzrzM1qpGGUFt28pIySQHR6h7F6KSwGWm97ay+Z+ZqMcEjEWebE7wxCSQwpkhJqoZA5ivCdZDjJepuJ9IQjGGUmuXJdBFUygxVqVsxFsLMbDe8ZbDYVCGKxs+W080max1hFCarCfV+C1KATwcnvE9gRRuMP2prdbWGowm1KB1y+zwMMENkM755cJ2yPDtqhTI6ED1M/82yIDtC/4j4BijjeObflpO9I9MwXTCsSX8jWAFeHr05WoLTJ5G8IQVS/7vwR6ohirYM7f6HzYpogfS3R2OAAAAAElFTkSuQmCC);
  width: 36px;
  height: 36px;
}
.leaflet-retina .leaflet-control-layers-toggle {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAAA0CAQAAABvcdNgAAAEsklEQVR4AWL4TydIhpZK1kpWOlg0w3ZXP6D2soBtG42jeI6ZmQTHzAxiTbSJsYLjO9HhP+WOmcuhciVnmHVQcJnp7DFvScowZorad/+V/fVzMdMT2g9Cv9guXGv/7pYOrXh2U+RRR3dSd9JRx6bIFc/ekqHI29JC6pJ5ZEh1yWkhkbcFeSjxgx3L2m1cb1C7bceyxA+CNjT/Ifff+/kDk2u/w/33/IeCMOSaWZ4glosqT3DNnNZQ7Cs58/3Ce5HL78iZH/vKVIaYlqzfdLu8Vi7dnvUbEza5Idt36tquZFldl6N5Z/POLof0XLK61mZCmJSWjVF9tEjUluu74IUXvgttuVIHE7YxSkaYhJZam7yiM9Pv82JYfl9nptxZaxMJE4YSPty+vF0+Y2up9d3wwijfjZbabqm/3bZ9ecKHsiGmRflnn1MW4pjHf9oLufyn2z3y1D6n8g8TZhxyzipLNPnAUpsOiuWimg52psrTZYnOWYNDTMuWBWa0tJb4rgq1UvmutpaYEbZlwU3CLJm/ayYjHW5/h7xWLn9Hh1vepDkyf7dE7MtT5LR4e7yYpHrkhOUpEfssBLq2pPhAqoSWKUkk7EDqkmK6RrCEzqDjhNDWNE+XSMvkJRDWlZTmCW0l0PHQGRZY5t1L83kT0Y3l2SItk5JAWHl2dCOBm+fPu3fo5/3v61RMCO9Jx2EEYYhb0rmNQMX/vm7gqOEJLcXTGw3CAuRNeyaPWwjR8PRqKQ1PDA/dpv+on9Shox52WFnx0KY8onHayrJzm87i5h9xGw/tfkev0jGsQizqezUKjk12hBMKJ4kbCqGPVNXudyyrShovGw5CgxsRICxF6aRmSjlBnHRzg7Gx8fKqEubI2rahQYdR1YgDIRQO7JvQyD52hoIQx0mxa0ODtW2Iozn1le2iIRdzwWewedyZzewidueOGqlsn1MvcnQpuVwLGG3/IR1hIKxCjelIDZ8ldqWz25jWAsnldEnK0Zxro19TGVb2ffIZEsIO89EIEDvKMPrzmBOQcKQ+rroye6NgRRxqR4U8EAkz0CL6uSGOm6KQCdWjvjRiSP1BPalCRS5iQYiEIvxuBMJEWgzSoHADcVMuN7IuqqTeyUPq22qFimFtxDyBBJEwNyt6TM88blFHao/6tWWhuuOM4SAK4EI4QmFHA+SEyWlp4EQoJ13cYGzMu7yszEIBOm2rVmHUNqwAIQabISNMRstmdhNWcFLsSm+0tjJH1MdRxO5Nx0WDMhCtgD6OKgZeljJqJKc9po8juskR9XN0Y1lZ3mWjLR9JCO1jRDMd0fpYC2VnvjBSEFg7wBENc0R9HFlb0xvF1+TBEpF68d+DHR6IOWVv2BECtxo46hOFUBd/APU57WIoEwJhIi2CdpyZX0m93BZicktMj1AS9dClteUFAUNUIEygRZCtik5zSxI9MubTBH1GOiHsiLJ3OCoSZkILa9PxiN0EbvhsAo8tdAf9Seepd36lGWHmtNANTv5Jd0z4QYyeo/UEJqxKRpg5LZx6btLPsOaEmdMyxYdlc8LMaJnikDlhclqmPiQnTEpLUIZEwkRagjYkEibQErwhkTAKCLQEbUgkzJQWc/0PstHHcfEdQ+UAAAAASUVORK5CYII=);
  background-size: 26px 26px;
}
.leaflet-touch .leaflet-control-layers-toggle {
  width: 44px;
  height: 44px;
}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
  display: none;
}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
  display: block;
  position: relative;
}
.leaflet-control-layers-expanded {
  color: #333;
  background: #fff;
  padding: 6px 10px 6px 6px;
}
.leaflet-control-layers-scrollbar {
  padding-right: 5px;
  overflow: hidden scroll;
}
.leaflet-control-layers-selector {
  margin-top: 2px;
  position: relative;
  top: 1px;
}
.leaflet-control-layers label {
  font-size: 1.08333em;
  display: block;
}
.leaflet-control-layers-separator {
  border-top: 1px solid #ddd;
  height: 0;
  margin: 5px -10px 5px -6px;
}
.leaflet-default-icon-path {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAApCAYAAADAk4LOAAAFgUlEQVR4Aa1XA5BjWRTN2oW17d3YaZtr2962HUzbDNpjszW24mRt28p47v7zq/bXZtrp/lWnXr337j3nPCe85NcypgSFdugCpW5YoDAMRaIMqRi6aKq5E3YqDQO3qAwjVWrD8Ncq/RBpykd8oZUb/kaJutow8r1aP9II0WmLKLIsJyv1w/kqw9Ch2MYdB++12Onxee/QMwvf4/Dk/Lfp/i4nxTXtOoQ4pW5Aj7wpici1A9erdAN2OH64x8OSP9j3Ft3b7aWkTg/Fm91siTra0f9on5sQr9INejH6CUUUpavjFNq1B+Oadhxmnfa8RfEmN8VNAsQhPqF55xHkMzz3jSmChWU6f7/XZKNH+9+hBLOHYozuKQPxyMPUKkrX/K0uWnfFaJGS1QPRtZsOPtr3NsW0uyh6NNCOkU3Yz+bXbT3I8G3xE5EXLXtCXbbqwCO9zPQYPRTZ5vIDXD7U+w7rFDEoUUf7ibHIR4y6bLVPXrz8JVZEql13trxwue/uDivd3fkWRbS6/IA2bID4uk0UpF1N8qLlbBlXs4Ee7HLTfV1j54APvODnSfOWBqtKVvjgLKzF5YdEk5ewRkGlK0i33Eofffc7HT56jD7/6U+qH3Cx7SBLNntH5YIPvODnyfIXZYRVDPqgHtLs5ABHD3YzLuespb7t79FY34DjMwrVrcTuwlT55YMPvOBnRrJ4VXTdNnYug5ucHLBjEpt30701A3Ts+HEa73u6dT3FNWwflY86eMHPk+Yu+i6pzUpRrW7SNDg5JHR4KapmM5Wv2E8Tfcb1HoqqHMHU+uWDD7zg54mz5/2BSnizi9T1Dg4QQXLToGNCkb6tb1NU+QAlGr1++eADrzhn/u8Q2YZhQVlZ5+CAOtqfbhmaUCS1ezNFVm2imDbPmPng5wmz+gwh+oHDce0eUtQ6OGDIyR0uUhUsoO3vfDmmgOezH0mZN59x7MBi++WDL1g/eEiU3avlidO671bkLfwbw5XV2P8Pzo0ydy4t2/0eu33xYSOMOD8hTf4CrBtGMSoXfPLchX+J0ruSePw3LZeK0juPJbYzrhkH0io7B3k164hiGvawhOKMLkrQLyVpZg8rHFW7E2uHOL888IBPlNZ1FPzstSJM694fWr6RwpvcJK60+0HCILTBzZLFNdtAzJaohze60T8qBzyh5ZuOg5e7uwQppofEmf2++DYvmySqGBuKaicF1blQjhuHdvCIMvp8whTTfZzI7RldpwtSzL+F1+wkdZ2TBOW2gIF88PBTzD/gpeREAMEbxnJcaJHNHrpzji0gQCS6hdkEeYt9DF/2qPcEC8RM28Hwmr3sdNyht00byAut2k3gufWNtgtOEOFGUwcXWNDbdNbpgBGxEvKkOQsxivJx33iow0Vw5S6SVTrpVq11ysA2Rp7gTfPfktc6zhtXBBC+adRLshf6sG2RfHPZ5EAc4sVZ83yCN00Fk/4kggu40ZTvIEm5g24qtU4KjBrx/BTTH8ifVASAG7gKrnWxJDcU7x8X6Ecczhm3o6YicvsLXWfh3Ch1W0k8x0nXF+0fFxgt4phz8QvypiwCCFKMqXCnqXExjq10beH+UUA7+nG6mdG/Pu0f3LgFcGrl2s0kNNjpmoJ9o4B29CMO8dMT4Q5ox8uitF6fqsrJOr8qnwNbRzv6hSnG5wP+64C7h9lp30hKNtKdWjtdkbuPA19nJ7Tz3zR/ibgARbhb4AlhavcBebmTHcFl2fvYEnW0ox9xMxKBS8btJ+KiEbq9zA4RthQXDhPa0T9TEe69gWupwc6uBUphquXgf+/FrIjweHQS4/pduMe5ERUMHUd9xv8ZR98CxkS4F2n3EUrUZ10EYNw7BWm9x1GiPssi3GgiGRDKWRYZfXlON+dfNbM+GgIwYdwAAAAASUVORK5CYII=);
}
.leaflet-container .leaflet-control-attribution {
  background: #fffc;
  margin: 0;
}
.leaflet-control-attribution,
.leaflet-control-scale-line {
  color: #333;
  padding: 0 5px;
  line-height: 1.4;
}
.leaflet-control-attribution a {
  text-decoration: none;
}
.leaflet-control-attribution a:hover,
.leaflet-control-attribution a:focus {
  text-decoration: underline;
}
.leaflet-attribution-flag {
  width: 1em;
  height: 0.6669em;
  vertical-align: baseline !important;
  display: inline !important;
}
.leaflet-left .leaflet-control-scale {
  margin-left: 5px;
}
.leaflet-bottom .leaflet-control-scale {
  margin-bottom: 5px;
}
.leaflet-control-scale-line {
  white-space: nowrap;
  box-sizing: border-box;
  text-shadow: 1px 1px #fff;
  background: #fffc;
  border: 2px solid #777;
  border-top: none;
  padding: 2px 5px 1px;
  line-height: 1.1;
}
.leaflet-control-scale-line:not(:first-child) {
  border-top: 2px solid #777;
  border-bottom: none;
  margin-top: -2px;
}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
  border-bottom: 2px solid #777;
}
.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
  box-shadow: none;
}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
  background-clip: padding-box;
  border: 2px solid #0003;
}
.leaflet-popup {
  text-align: center;
  margin-bottom: 20px;
  position: absolute;
}
.leaflet-popup-content-wrapper {
  text-align: left;
  border-radius: 12px;
  padding: 1px;
}
.leaflet-popup-content {
  min-height: 1px;
  margin: 13px 24px 13px 20px;
  font-size: 1.08333em;
  line-height: 1.3;
}
.leaflet-popup-content p {
  margin: 1.3em 0;
}
.leaflet-popup-tip-container {
  pointer-events: none;
  width: 40px;
  height: 20px;
  margin-top: -1px;
  margin-left: -20px;
  position: absolute;
  left: 50%;
  overflow: hidden;
}
.leaflet-popup-tip {
  pointer-events: auto;
  width: 17px;
  height: 17px;
  margin: -10px auto 0;
  padding: 1px;
  transform: rotate(45deg);
}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  color: #333;
  background: #fff;
  box-shadow: 0 3px 14px #0006;
}
.leaflet-container a.leaflet-popup-close-button {
  text-align: center;
  color: #757575;
  background: 0 0;
  border: none;
  width: 24px;
  height: 24px;
  font:
    16px/24px Tahoma,
    Verdana,
    sans-serif;
  text-decoration: none;
  position: absolute;
  top: 0;
  right: 0;
}
.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
  color: #585858;
}
.leaflet-popup-scrolled {
  overflow: auto;
}
.leaflet-oldie .leaflet-popup-content-wrapper {
  -ms-zoom: 1;
}
.leaflet-oldie .leaflet-popup-tip {
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
  width: 24px;
  filter: progid:DXImageTransform.Microsoft.Matrix(M11=.707107, M12=.707107, M21=-.707107, M22=.707107);
  margin: 0 auto;
}
.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
  border: 1px solid #999;
}
.leaflet-div-icon {
  background: #fff;
  border: 1px solid #666;
}
.leaflet-tooltip {
  color: #222;
  white-space: nowrap;
  -webkit-user-select: none;
  user-select: none;
  pointer-events: none;
  background-color: #fff;
  border: 1px solid #fff;
  border-radius: 3px;
  padding: 6px;
  position: absolute;
  box-shadow: 0 1px 3px #0006;
}
.leaflet-tooltip.leaflet-interactive {
  cursor: pointer;
  pointer-events: auto;
}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
  pointer-events: none;
  content: "";
  background: 0 0;
  border: 6px solid #0000;
  position: absolute;
}
.leaflet-tooltip-bottom {
  margin-top: 6px;
}
.leaflet-tooltip-top {
  margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
  margin-left: -6px;
  left: 50%;
}
.leaflet-tooltip-top:before {
  border-top-color: #fff;
  margin-bottom: -12px;
  bottom: 0;
}
.leaflet-tooltip-bottom:before {
  border-bottom-color: #fff;
  margin-top: -12px;
  margin-left: -6px;
  top: 0;
}
.leaflet-tooltip-left {
  margin-left: -6px;
}
.leaflet-tooltip-right {
  margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
  margin-top: -6px;
  top: 50%;
}
.leaflet-tooltip-left:before {
  border-left-color: #fff;
  margin-right: -12px;
  right: 0;
}
.leaflet-tooltip-right:before {
  border-right-color: #fff;
  margin-left: -12px;
  left: 0;
}
@media print {
  .leaflet-control {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* FuelDash r15: favorites, locations and freshness */
.location > div {
  min-width: 0;
}
.location em {
  color: #d0d0d4;
  font-size: 10px;
  font-style: normal;
  display: block;
  max-width: 46vw;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.location > div > small:last-child {
  color: #85858b;
  margin-top: 2px;
}
.price-hero > b {
  font-size: 15px;
  line-height: 1.2;
  margin: 0 0 3px;
}
.price-hero > small:first-of-type {
  display: block;
  text-align: center;
  align-self: center;
  max-width: 90%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 8px;
}
.favorites-location {
  color: #96969d;
  font-size: 11px;
  margin: 4px 0 8px;
}
.station-card {
  position: relative;
  grid-template-columns: 31px minmax(0, 1fr) auto 34px;
  cursor: pointer;
}
.station-copy {
  min-width: 0;
}
.station-copy .station-location {
  color: #b6b6bc;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  margin: 2px 0;
}
.favorite-toggle {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid #3b3b40;
  background: #111115cc;
  color: #b8b8be;
  font-size: 21px;
  line-height: 1;
  display: grid;
  place-items: center;
  padding: 0;
  z-index: 2;
}
.favorite-toggle.is-favorite {
  color: #ff453a;
  border-color: #ff453a66;
  background: #ff453a14;
}
.detail-favorite {
  margin-left: auto;
  flex: 0 0 auto;
}
.station-identity {
  display: flex;
  align-items: center;
  gap: 12px;
}
.freshness-copy span:first-child {
  color: #9b9ba1;
}
.empty-state {
  color: #9b9ba1;
  font-size: 12px;
  line-height: 1.45;
  padding: 12px 2px;
}
.station-value {
  min-width: 72px;
}
@media (max-width: 390px) {
  .station-card {
    grid-template-columns: 28px minmax(0, 1fr) auto 30px;
    gap: 8px;
  }
  .favorite-toggle {
    width: 30px;
    height: 30px;
  }
  .station-value small {
    font-size: 9px;
  }
  .location em {
    max-width: 40vw;
  }
}

/* FuelDash r27 – reliable hero map visibility, no map chrome and search stability */
.fuel-map .leaflet-control-attribution {
  display: none !important;
}
.search-field input {
  font-size: 16px !important;
  line-height: 1.2;
}
.hero-map-layer {
  z-index: 1 !important;
  opacity: 0.66 !important;
  background-color: #1b1215;
  background-image:
    linear-gradient(
      24deg,
      transparent 46%,
      rgba(255, 255, 255, 0.13) 47%,
      transparent 49%
    ),
    linear-gradient(
      138deg,
      transparent 43%,
      rgba(255, 255, 255, 0.1) 44%,
      transparent 46%
    ),
    repeating-linear-gradient(
      12deg,
      transparent 0 19px,
      rgba(255, 102, 94, 0.08) 20px 21px,
      transparent 22px 38px
    ),
    repeating-linear-gradient(
      102deg,
      transparent 0 26px,
      rgba(255, 255, 255, 0.055) 27px 28px,
      transparent 29px 54px
    );
  background-size:
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%;
}
.hero-map-layer .fuel-map {
  opacity: 0.82;
}
.hero-map-layer::after {
  z-index: 500;
  background:
    radial-gradient(
      circle at 50% 52%,
      transparent 0,
      rgba(5, 5, 6, 0.03) 46%,
      rgba(5, 5, 6, 0.25) 100%
    ),
    linear-gradient(180deg, rgba(5, 5, 6, 0.04), rgba(5, 5, 6, 0.24));
}
.price-hero {
  z-index: 2 !important;
  background: linear-gradient(
    145deg,
    rgba(31, 31, 34, 0.18),
    rgba(5, 5, 7, 0.34)
  ) !important;
  backdrop-filter: blur(16px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(135%) !important;
}

/* FuelDash r26 – background reach, visible hero map and restrained controls */
.hero-map-layer {
  opacity: 0.46 !important;
  filter: saturate(0.78) brightness(1.18) contrast(0.96) !important;
}
.hero-map-layer::after {
  background:
    radial-gradient(
      circle at 50% 52%,
      transparent 0,
      rgba(5, 5, 6, 0.12) 46%,
      rgba(5, 5, 6, 0.42) 100%
    ),
    linear-gradient(180deg, rgba(5, 5, 6, 0.16), rgba(5, 5, 6, 0.42));
}
.price-hero {
  justify-content: center !important;
  padding: 40px 22px 54px !important;
  background: linear-gradient(
    145deg,
    rgba(31, 31, 34, 0.38),
    rgba(5, 5, 7, 0.52)
  ) !important;
}
.price-hero .hero-label {
  margin-bottom: 12px !important;
}
.price-hero .hero-price {
  margin-bottom: 7px !important;
}
.price-hero .hero-footer {
  position: absolute !important;
  right: 22px;
  bottom: 16px;
  left: 22px;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fuel-advice-card::before,
.fuel-advice-card.is-now::before,
.fuel-advice-card.is-soon::before,
.fuel-advice-card.is-later::before {
  display: none !important;
}
.fuel-advice-card.is-now strong,
.fuel-advice-card.is-soon strong,
.fuel-advice-card.is-later strong {
  text-shadow: none !important;
}
.map-location-control {
  width: 37px;
  height: 37px;
  padding: 9px;
  opacity: 0.76;
  color: #ddd6d7;
  background: linear-gradient(
    145deg,
    rgba(34, 30, 32, 0.62),
    rgba(10, 10, 12, 0.58)
  );
  border-color: rgba(255, 255, 255, 0.09);
  box-shadow:
    inset 0 1px rgba(255, 255, 255, 0.08),
    0 6px 16px rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}
.map-location-control svg {
  fill: rgba(255, 100, 94, 0.07);
  stroke: #e68b85;
  stroke-width: 1.55;
}
@media (max-width: 390px) {
  .price-hero {
    padding: 36px 18px 51px !important;
  }
  .price-hero .hero-footer {
    right: 18px;
    bottom: 14px;
    left: 18px;
  }
}

/* FuelDash r27 final cascade */
.fuel-map .leaflet-control-attribution {
  display: none !important;
}
.search-field input {
  font-size: 16px !important;
  line-height: 1.2;
}
.hero-map-layer {
  z-index: 1 !important;
  opacity: 0.66 !important;
  background-color: #1b1215;
  background-image:
    linear-gradient(
      24deg,
      transparent 46%,
      rgba(255, 255, 255, 0.13) 47%,
      transparent 49%
    ),
    linear-gradient(
      138deg,
      transparent 43%,
      rgba(255, 255, 255, 0.1) 44%,
      transparent 46%
    ),
    repeating-linear-gradient(
      12deg,
      transparent 0 19px,
      rgba(255, 102, 94, 0.08) 20px 21px,
      transparent 22px 38px
    ),
    repeating-linear-gradient(
      102deg,
      transparent 0 26px,
      rgba(255, 255, 255, 0.055) 27px 28px,
      transparent 29px 54px
    );
}
.hero-map-layer .fuel-map {
  opacity: 0.82;
}
.hero-map-layer::after {
  z-index: 500;
  background:
    radial-gradient(
      circle at 50% 52%,
      transparent 0,
      rgba(5, 5, 6, 0.03) 46%,
      rgba(5, 5, 6, 0.25) 100%
    ),
    linear-gradient(180deg, rgba(5, 5, 6, 0.04), rgba(5, 5, 6, 0.24));
}
.price-hero {
  z-index: 2 !important;
  background: linear-gradient(
    145deg,
    rgba(31, 31, 34, 0.18),
    rgba(5, 5, 7, 0.34)
  ) !important;
  backdrop-filter: blur(16px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(135%) !important;
}

/* FuelDash r27 final cascade */
.fuel-map .leaflet-control-attribution {
  display: none !important;
}
.search-field input {
  font-size: 16px !important;
  line-height: 1.2;
}
.hero-map-layer {
  z-index: 1 !important;
  opacity: 0.66 !important;
  background-color: #1b1215;
  background-image:
    linear-gradient(
      24deg,
      transparent 46%,
      rgba(255, 255, 255, 0.13) 47%,
      transparent 49%
    ),
    linear-gradient(
      138deg,
      transparent 43%,
      rgba(255, 255, 255, 0.1) 44%,
      transparent 46%
    ),
    repeating-linear-gradient(
      12deg,
      transparent 0 19px,
      rgba(255, 102, 94, 0.08) 20px 21px,
      transparent 22px 38px
    ),
    repeating-linear-gradient(
      102deg,
      transparent 0 26px,
      rgba(255, 255, 255, 0.055) 27px 28px,
      transparent 29px 54px
    );
}
.hero-map-layer .fuel-map {
  opacity: 0.82;
}
.hero-map-layer::after {
  z-index: 500;
  background:
    radial-gradient(
      circle at 50% 52%,
      transparent 0,
      rgba(5, 5, 6, 0.03) 46%,
      rgba(5, 5, 6, 0.25) 100%
    ),
    linear-gradient(180deg, rgba(5, 5, 6, 0.04), rgba(5, 5, 6, 0.24));
}
.price-hero {
  z-index: 2 !important;
  background: linear-gradient(
    145deg,
    rgba(31, 31, 34, 0.18),
    rgba(5, 5, 7, 0.34)
  ) !important;
  backdrop-filter: blur(16px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(135%) !important;
}

/* FuelDash r16 live cleanup */
.station-logo {
  position: relative;
  background: #f4f4f6;
  border: 1px solid #ffffff1f;
  overflow: hidden;
}
.station-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  padding: 4px;
  box-sizing: border-box;
}
.station-logo .brand-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 8px;
  font-weight: 800;
  color: #17171a;
  z-index: -1;
}
.favorite-toggle {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  border: 1px solid #3b3b40;
  background: linear-gradient(145deg, #1c1c20, #0d0d10);
  color: #aaaab2;
  box-shadow: inset 0 1px #ffffff14;
  display: grid;
  place-items: center;
  padding: 0;
}
.favorite-toggle svg {
  width: 20px;
  height: 20px;
  fill: transparent;
  stroke: currentColor;
  stroke-width: 1.8;
  transition:
    transform 0.18s ease,
    fill 0.18s ease,
    color 0.18s ease;
}
.favorite-toggle:active svg {
  transform: scale(0.88);
}
.favorite-toggle.is-favorite {
  color: #ff453a;
  border-color: #ff453a66;
  background: #ff453a12;
}
.favorite-toggle.is-favorite svg {
  fill: #ff453a;
  stroke: #ff453a;
}
.detail-favorite {
  width: 42px;
  height: 42px;
  border-radius: 14px;
}
.detail-favorite svg {
  width: 23px;
  height: 23px;
}
.price-hero > b {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0;
  font-size: 16px;
}
.price-hero .hero-place {
  color: #aaaab1;
  font-size: 13px;
  font-weight: 500;
}
.location em,
.favorites-location {
  display: none !important;
}
.live-error {
  margin-top: 12px;
  padding: 22px;
}

.user-location-marker {
  background: transparent !important;
  border: 0 !important;
}
.user-location-dot {
  display: block;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #2f8cff;
  border: 4px solid #fff;
  box-shadow:
    0 0 0 5px rgba(47, 140, 255, 0.22),
    0 4px 16px rgba(0, 0, 0, 0.45);
}
.user-location-dot i {
  display: none;
}

/* FuelDash r19 refinements */
.price-hero {
  padding: 28px 30px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 16px !important;
  text-align: left !important;
}
.price-hero .hero-label {
  font-size: 1rem !important;
  color: #f4f4f6 !important;
  font-weight: 700 !important;
  text-align: center !important;
}
.price-hero .hero-main {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 22px !important;
}
.price-hero .hero-main b {
  font-size: 1.35rem !important;
  line-height: 1.25 !important;
  overflow-wrap: anywhere !important;
}
.price-hero .hero-main strong {
  font-size: 3rem !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
.price-hero > small {
  display: block !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #aaa !important;
  line-height: 1.45 !important;
}
.dashboard-section {
  margin-top: 24px !important;
}
.favorites-block {
  margin-top: 26px !important;
}
.fuel-advice-card {
  margin-top: 24px !important;
}
.chart-block {
  margin-top: 24px !important;
}
.price-change.is-neutral {
  color: #999 !important;
}
.detail-opening {
  display: grid;
  gap: 18px;
}
.detail-opening header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.detail-opening .opening-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 18px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.detail-opening .opening-status strong.is-open {
  color: #30d158;
}
.detail-opening .opening-status strong.is-closed {
  color: #ff4450;
}
.detail-opening p {
  margin: 0;
  color: #8e8e93;
  line-height: 1.45;
}
@media (max-width: 520px) {
  .price-hero {
    padding: 24px 22px !important;
    gap: 14px !important;
  }
  .price-hero .hero-main {
    gap: 14px !important;
  }
  .price-hero .hero-main b {
    font-size: 1.2rem !important;
  }
  .price-hero .hero-main strong {
    font-size: 2.55rem !important;
  }
}

/* FuelDash r20 layout, request-cache and readability fixes */
.location {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: 12px !important;
  margin: 2px 4px 19px !important;
}
.location > span {
  font-size: 22px !important;
}
.location-copy {
  min-width: 0 !important;
}
.location-copy > small {
  color: #9b9ba1 !important;
  margin: 0 0 3px !important;
  font-size: 10px !important;
}
.location-line {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}
.location-line strong {
  font-size: 15px !important;
  line-height: 1.15 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.location-line span {
  color: #8d8d93 !important;
  font-size: 10px !important;
  flex: 0 0 auto !important;
}
.location .refresh-pill {
  flex: 0 0 auto !important;
}
.price-hero {
  padding: 24px 20px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
  text-align: center !important;
}
.price-hero .hero-label {
  font-size: 14px !important;
  color: #f4f4f6 !important;
  font-weight: 650 !important;
  text-align: center !important;
}
.price-hero > strong {
  display: block !important;
  color: #ff3b30 !important;
  letter-spacing: -2.8px !important;
  margin: 7px 0 4px !important;
  font-size: 48px !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  white-space: nowrap !important;
}
.price-hero > b {
  display: block !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  margin: 0 0 11px !important;
  text-align: center !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.price-hero > small {
  display: flex !important;
  padding-top: 0 !important;
  border-top: 0 !important;
  color: #bdbdc1 !important;
  justify-content: space-between !important;
  align-self: stretch !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}
.price-hero > small i {
  flex: 1 !important;
}
.fuel-advice-card:before {
  display: none !important;
}
.fuel-advice-card,
.fuel-advice-card.is-good {
  border-color: #323236 !important;
  box-shadow:
    inset 0 1px #ffffff18,
    0 16px 36px #0007 !important;
  background: linear-gradient(135deg, #1e1e2080, #0a0a0bb3) !important;
}
.fuel-advice-card strong {
  text-shadow: none !important;
}
.dashboard-favorite-card,
.favorites-screen-card {
  grid-template-columns: 42px minmax(0, 1fr) 40px !important;
  grid-template-areas: "logo copy favorite" "logo value value" !important;
  column-gap: 12px !important;
  row-gap: 7px !important;
  align-items: center !important;
  padding: 14px !important;
}
.dashboard-favorite-card .station-logo,
.favorites-screen-card .station-logo {
  grid-area: logo !important;
  width: 42px !important;
  height: 42px !important;
}
.dashboard-favorite-card .station-copy,
.favorites-screen-card .station-copy {
  grid-area: copy !important;
  min-width: 0 !important;
}
.dashboard-favorite-card .station-copy strong,
.favorites-screen-card .station-copy strong {
  font-size: 15px !important;
  line-height: 1.2 !important;
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.dashboard-favorite-card .station-location,
.favorites-screen-card .station-location {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin: 3px 0 !important;
}
.dashboard-favorite-card .station-copy > small:last-child,
.favorites-screen-card .station-copy > small:last-child {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
}
.dashboard-favorite-card .station-value,
.favorites-screen-card .station-value {
  grid-area: value !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
  text-align: left !important;
}
.dashboard-favorite-card .station-value strong,
.favorites-screen-card .station-value strong {
  font-size: 20px !important;
  white-space: nowrap !important;
}
.dashboard-favorite-card .station-value small,
.favorites-screen-card .station-value small {
  font-size: 9px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: right !important;
}
.dashboard-favorite-card .favorite-toggle,
.favorites-screen-card .favorite-toggle {
  grid-area: favorite !important;
  width: 38px !important;
  height: 38px !important;
}
@media (max-width: 390px) {
  .location {
    column-gap: 8px !important;
  }
  .location-line {
    gap: 6px !important;
  }
  .location-line strong {
    font-size: 14px !important;
  }
  .location-line span {
    font-size: 9px !important;
  }
  .price-hero {
    padding: 22px 18px 19px !important;
  }
  .price-hero > strong {
    font-size: 44px !important;
  }
  .dashboard-favorite-card,
  .favorites-screen-card {
    grid-template-columns: 38px minmax(0, 1fr) 36px !important;
    padding: 12px !important;
    column-gap: 9px !important;
  }
  .dashboard-favorite-card .station-logo,
  .favorites-screen-card .station-logo {
    width: 38px !important;
    height: 38px !important;
  }
  .dashboard-favorite-card .favorite-toggle,
  .favorites-screen-card .favorite-toggle {
    width: 34px !important;
    height: 34px !important;
  }
}

/* FuelDash r21 search, sorting and map interaction */
.fuel-map .leaflet-tile-pane {
  filter: saturate(0.82) brightness(1.28) contrast(0.96) !important;
}
.user-location-dot {
  background: #ff3b30 !important;
  box-shadow:
    0 0 0 5px rgba(255, 59, 48, 0.22),
    0 4px 16px rgba(0, 0, 0, 0.45) !important;
}
.station-sort {
  display: flex;
  gap: 7px;
  margin: 13px 0 4px;
  padding: 4px;
  border: 1px solid #35353a;
  border-radius: 15px;
  background: #111114cc;
  box-shadow: inset 0 1px #ffffff12;
}
.station-sort button {
  flex: 1;
  min-width: 0;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #aaaab1;
  padding: 8px 6px;
  font-size: 11px;
  font-weight: 650;
}
.station-sort button.is-active {
  background: #ff3b30;
  color: #fff;
  box-shadow: 0 5px 14px rgba(255, 59, 48, 0.2);
}
.result-list .station-card.is-selected {
  border-color: #ff4a40 !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 59, 48, 0.35),
    0 12px 28px rgba(0, 0, 0, 0.55) !important;
  background: linear-gradient(
    135deg,
    rgba(49, 22, 23, 0.78),
    rgba(10, 10, 11, 0.82)
  ) !important;
}
.station-detail-link {
  display: inline-flex !important;
  align-items: center;
  border: 0;
  background: transparent;
  color: #ff554b !important;
  padding: 0;
  margin: 4px 0 1px;
  font-size: 10px !important;
  font-weight: 650;
  line-height: 1.2;
}
.result-list .station-card {
  grid-template-columns: 38px minmax(0, 1fr) auto 36px !important;
  gap: 10px !important;
  padding: 13px !important;
}
.result-list .station-logo {
  width: 38px !important;
  height: 38px !important;
}
.result-list .station-copy > small:last-child {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.result-list .station-value {
  min-width: 64px;
}
.result-list .station-value .price-change {
  margin-top: 4px;
  font-size: 9px;
  white-space: nowrap;
}
.map-price-marker {
  background: rgba(63, 20, 21, 0.94) !important;
  border-color: #ff746d !important;
}
.map-price-marker.is-selected {
  background: #ff3b30 !important;
  transform: scale(1.12) !important;
  box-shadow:
    0 8px 22px #000b,
    0 0 20px rgba(255, 59, 48, 0.45) !important;
}
@media (max-width: 390px) {
  .station-sort button {
    font-size: 10px;
    padding: 8px 4px;
  }
  .result-list .station-card {
    grid-template-columns: 34px minmax(0, 1fr) auto 32px !important;
    gap: 8px !important;
    padding: 11px !important;
  }
  .result-list .station-logo {
    width: 34px !important;
    height: 34px !important;
  }
}

/* FuelDash r22 – focused card polish */
.price-hero {
  min-height: 250px !important;
  padding: 26px 26px 22px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: center !important;
  gap: 0 !important;
}
.price-hero .hero-label {
  width: 100% !important;
  text-align: center !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #f4f4f6 !important;
  margin: 0 0 28px !important;
}
.price-hero .hero-station {
  width: 100% !important;
  text-align: center !important;
  font-size: 19px !important;
  line-height: 1.25 !important;
  font-weight: 750 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin: 0 0 10px !important;
}
.price-hero .hero-price {
  display: block !important;
  text-align: center !important;
  font-size: 48px !important;
  line-height: 1 !important;
  color: #ff453a !important;
  white-space: nowrap !important;
  margin: 0 !important;
}
.price-hero .hero-footer {
  width: 100% !important;
  margin-top: auto !important;
  padding-top: 24px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  color: #aaaab0 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  letter-spacing: 0.01em !important;
}
.price-hero .hero-footer span:first-child {
  text-align: left !important;
}
.price-hero .hero-footer span:last-child {
  text-align: right !important;
}

/* Cards sit slightly farther back and respond like native iOS surfaces. */
.price-hero,
.dashboard-section.glass-card,
.station-card,
.map-card,
.search-card {
  transform: scale(0.985);
  transform-origin: center;
  transition:
    transform 0.18s cubic-bezier(0.2, 0.75, 0.25, 1),
    box-shadow 0.18s ease,
    border-color 0.18s ease;
}
.price-hero:active,
.dashboard-section.glass-card:active,
.station-card:active,
.map-card:active,
.search-card:active {
  transform: scale(1.02);
}
@media (hover: hover) {
  .price-hero:hover,
  .dashboard-section.glass-card:hover,
  .station-card:hover,
  .map-card:hover,
  .search-card:hover {
    transform: scale(1.005);
  }
}
@media (max-width: 390px) {
  .price-hero {
    min-height: 236px !important;
    padding: 23px 21px 19px !important;
  }
  .price-hero .hero-label {
    margin-bottom: 24px !important;
  }
  .price-hero .hero-station {
    font-size: 17px !important;
  }
  .price-hero .hero-price {
    font-size: 44px !important;
  }
  .price-hero .hero-footer {
    padding-top: 20px !important;
  }
}

/* FuelDash r24 – compact "Günstigste Tankstelle" card only */
.price-hero {
  min-height: 198px !important;
  padding: 20px 22px 17px !important;
}
.price-hero .hero-label {
  margin-bottom: 17px !important;
}
.price-hero .hero-station {
  font-size: 17px !important;
  margin-bottom: 7px !important;
}
.price-hero .hero-price {
  font-size: 44px !important;
}
.price-hero .hero-footer {
  padding-top: 16px !important;
}
@media (max-width: 390px) {
  .price-hero {
    min-height: 188px !important;
    padding: 18px 18px 15px !important;
  }
  .price-hero .hero-label {
    margin-bottom: 14px !important;
  }
  .price-hero .hero-price {
    font-size: 41px !important;
  }
  .price-hero .hero-footer {
    padding-top: 13px !important;
  }
}

/* FuelDash r25 – hero map, unified station rows, map search and ambient light */
.hero-card-wrap {
  position: relative;
  min-height: 198px;
  border-radius: 27px;
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 18px 43px #0008;
}
.hero-map-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 0.2;
  filter: saturate(0.65) contrast(0.92);
  pointer-events: none;
}
.hero-map-layer::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 500;
  background:
    radial-gradient(
      circle at 50% 52%,
      transparent 0,
      rgba(5, 5, 6, 0.28) 46%,
      rgba(5, 5, 6, 0.72) 100%
    ),
    linear-gradient(180deg, rgba(5, 5, 6, 0.4), rgba(5, 5, 6, 0.72));
}
.hero-map-layer .fuel-map {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.hero-map-layer .map-price-marker {
  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
  padding: 0 !important;
  border: 3px solid rgba(255, 255, 255, 0.78) !important;
  border-radius: 50% !important;
  background: #ff453a !important;
  box-shadow:
    0 0 0 7px rgba(255, 69, 58, 0.16),
    0 0 20px rgba(255, 69, 58, 0.52) !important;
}
.hero-map-layer .map-price-marker span {
  display: none !important;
}
.price-hero {
  position: relative !important;
  z-index: 2 !important;
  min-height: 198px !important;
  background: linear-gradient(
    145deg,
    rgba(31, 31, 34, 0.6),
    rgba(5, 5, 7, 0.72)
  ) !important;
  box-shadow:
    inset 0 1px rgba(255, 255, 255, 0.17),
    inset 0 -1px rgba(255, 255, 255, 0.035) !important;
}
.price-hero .hero-label {
  margin: 0 0 12px !important;
}
.price-hero .hero-price {
  order: 2;
  margin: 0 0 7px !important;
  text-shadow: 0 0 24px rgba(255, 69, 58, 0.2);
}
.price-hero .hero-station {
  order: 3;
  color: #a7a7ae !important;
  font-size: 13px !important;
  font-weight: 560 !important;
  margin: 0 !important;
}
.price-hero .hero-footer {
  order: 4;
  padding-top: 14px !important;
}
.price-hero .hero-chevron {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 27px;
  height: 27px;
  padding: 7px;
  color: #b8b8bd;
  background: rgba(13, 13, 15, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.dashboard-favorite-card,
.favorites-screen-card {
  grid-template-columns: 38px minmax(0, 1fr) auto 36px !important;
  grid-template-areas: none !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 13px !important;
}
.dashboard-favorite-card .station-logo,
.dashboard-favorite-card .station-copy,
.dashboard-favorite-card .station-value,
.dashboard-favorite-card .favorite-toggle,
.favorites-screen-card .station-logo,
.favorites-screen-card .station-copy,
.favorites-screen-card .station-value,
.favorites-screen-card .favorite-toggle {
  grid-area: auto !important;
}
.dashboard-favorite-card .station-logo,
.favorites-screen-card .station-logo {
  width: 38px !important;
  height: 38px !important;
}
.dashboard-favorite-card .station-value,
.favorites-screen-card .station-value {
  display: block !important;
  min-width: 64px !important;
  text-align: right !important;
}
.dashboard-favorite-card .station-value strong,
.favorites-screen-card .station-value strong {
  color: #ff453a !important;
  font-size: 19px !important;
}
.dashboard-favorite-card .station-value small,
.favorites-screen-card .station-value small {
  margin-top: 4px !important;
  text-align: right !important;
}
.dashboard-favorite-card .favorite-toggle,
.favorites-screen-card .favorite-toggle {
  width: 36px !important;
  height: 36px !important;
}

.map-location-control {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 900;
  display: grid;
  place-items: center;
  width: 39px;
  height: 39px;
  padding: 10px;
  color: #f7f2f2;
  background: linear-gradient(
    145deg,
    rgba(34, 28, 30, 0.94),
    rgba(10, 9, 11, 0.94)
  );
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 13px;
  box-shadow:
    inset 0 1px rgba(255, 255, 255, 0.12),
    0 8px 20px rgba(0, 0, 0, 0.55),
    0 0 14px rgba(255, 59, 48, 0.12);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.map-location-control svg {
  width: 100%;
  height: 100%;
  fill: rgba(255, 59, 48, 0.14);
  stroke: #ff6a62;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fuel-advice-card::before {
  display: block !important;
  width: 180px;
  height: 180px;
  inset: -55% -22% auto auto;
  opacity: 0.8;
}
.fuel-advice-card.is-now {
  border-color: rgba(48, 209, 88, 0.32) !important;
}
.fuel-advice-card.is-now::before {
  background: radial-gradient(
    circle,
    rgba(48, 209, 88, 0.25),
    transparent 68%
  );
}
.fuel-advice-card.is-now strong {
  color: #30d158 !important;
  text-shadow: 0 0 20px rgba(48, 209, 88, 0.22) !important;
}
.fuel-advice-card.is-soon {
  border-color: rgba(255, 173, 74, 0.3) !important;
}
.fuel-advice-card.is-soon::before {
  background: radial-gradient(
    circle,
    rgba(255, 173, 74, 0.23),
    transparent 68%
  );
}
.fuel-advice-card.is-soon strong {
  color: #ffad4a !important;
  text-shadow: 0 0 20px rgba(255, 173, 74, 0.2) !important;
}
.fuel-advice-card.is-later {
  border-color: rgba(255, 95, 87, 0.3) !important;
}
.fuel-advice-card.is-later::before {
  background: radial-gradient(circle, rgba(255, 95, 87, 0.24), transparent 68%);
}
.fuel-advice-card.is-later strong {
  color: #ff5f57 !important;
  text-shadow: 0 0 20px rgba(255, 95, 87, 0.22) !important;
}

@media (max-width: 390px) {
  .hero-card-wrap,
  .price-hero {
    min-height: 188px !important;
  }
  .price-hero .hero-price {
    font-size: 41px !important;
  }
  .price-hero .hero-chevron {
    top: 13px;
    right: 13px;
    width: 25px;
    height: 25px;
  }
  .dashboard-favorite-card,
  .favorites-screen-card {
    grid-template-columns: 34px minmax(0, 1fr) auto 32px !important;
    gap: 8px !important;
    padding: 11px !important;
  }
  .dashboard-favorite-card .station-logo,
  .favorites-screen-card .station-logo {
    width: 34px !important;
    height: 34px !important;
  }
  .dashboard-favorite-card .favorite-toggle,
  .favorites-screen-card .favorite-toggle {
    width: 32px !important;
    height: 32px !important;
  }
}

/* FuelDash r26 final cascade overrides */
.hero-map-layer {
  opacity: 0.46 !important;
  filter: saturate(0.78) brightness(1.18) contrast(0.96) !important;
}
.hero-map-layer::after {
  background:
    radial-gradient(
      circle at 50% 52%,
      transparent 0,
      rgba(5, 5, 6, 0.12) 46%,
      rgba(5, 5, 6, 0.42) 100%
    ),
    linear-gradient(180deg, rgba(5, 5, 6, 0.16), rgba(5, 5, 6, 0.42));
}
.price-hero {
  justify-content: center !important;
  padding: 40px 22px 54px !important;
  background: linear-gradient(
    145deg,
    rgba(31, 31, 34, 0.38),
    rgba(5, 5, 7, 0.52)
  ) !important;
}
.price-hero .hero-footer {
  position: absolute !important;
  right: 22px;
  bottom: 16px;
  left: 22px;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fuel-advice-card::before,
.fuel-advice-card.is-now::before,
.fuel-advice-card.is-soon::before,
.fuel-advice-card.is-later::before {
  display: none !important;
}
.fuel-advice-card.is-now strong,
.fuel-advice-card.is-soon strong,
.fuel-advice-card.is-later strong {
  text-shadow: none !important;
}
.map-location-control {
  width: 37px;
  height: 37px;
  padding: 9px;
  opacity: 0.76;
  color: #ddd6d7;
  background: linear-gradient(
    145deg,
    rgba(34, 30, 32, 0.62),
    rgba(10, 10, 12, 0.58)
  );
  border-color: rgba(255, 255, 255, 0.09);
  box-shadow:
    inset 0 1px rgba(255, 255, 255, 0.08),
    0 6px 16px rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}
.map-location-control svg {
  fill: rgba(255, 100, 94, 0.07);
  stroke: #e68b85;
  stroke-width: 1.55;
}
@media (max-width: 390px) {
  .price-hero {
    padding: 36px 18px 51px !important;
  }
  .price-hero .hero-footer {
    right: 18px;
    bottom: 14px;
    left: 18px;
  }
}

/* ===== assets/r48-overrides.css ===== */
/* FuelDash r35 final cascade */
html {
  min-height: 100%;
  background: linear-gradient(165deg, #070708 0%, #12090b 52%, #080708 100%);
}

/* R43: chart interaction stays stable on touch devices. */
#app .chart-block.dashboard-section.glass-card,
#app .chart-block.dashboard-section.glass-card:active {
  transform: scale(0.985) !important;
}

#app .fuel-chart svg,
#app .fuel-chart.is-detail .chart-canvas svg {
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

/* The hero price uses the same red as every other price in FuelDash. */
#app .fd-best__price {
  color: #ff3b30 !important;
}

/* Radius choices mirror the centered, single-line fuel choice controls. */
#app .nearby-radius [data-nearby-radius] {
  align-items: stretch;
}

#app .nearby-radius [data-nearby-radius] button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding-inline: 4px;
  text-align: center;
  white-space: nowrap;
}

body {
  min-height: 100%;
  background: transparent !important;
}

.fuel-map .leaflet-control-attribution {
  display: none !important;
}

.search-field input {
  font-size: 16px !important;
  line-height: 1.2;
}

/* Completely isolated best-price component. No legacy Hero selector applies. */
#app .fd-best {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 56%) minmax(0, 44%);
  align-items: center;
  width: 100%;
  min-height: 304px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.17);
  border-radius: 27px;
  background: #09090b;
  box-shadow:
    inset 0 1px rgba(255, 255, 255, 0.12),
    0 18px 43px rgba(0, 0, 0, 0.52);
  clip-path: inset(0 round 27px);
  contain: paint;
}

#app .fd-best__map {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  border-radius: inherit;
  background: #100d0f;
  opacity: 0.46;
}

#app .fd-best__map .fuel-map,
#app .fd-best__map .fuel-map-canvas,
#app .fd-best__map .leaflet-container {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: inherit !important;
}

#app .fd-best__map .leaflet-marker-pane,
#app .fd-best__map .leaflet-shadow-pane,
#app .fd-best__map .map-price-marker,
#app .fd-best__map .user-location-marker {
  display: none !important;
}

#app .fd-best::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  background:
    linear-gradient(
      90deg,
      rgba(7, 7, 9, 0.94) 0%,
      rgba(7, 7, 9, 0.78) 48%,
      rgba(7, 7, 9, 0.22) 100%
    ),
    linear-gradient(180deg, rgba(5, 5, 7, 0.05), rgba(5, 5, 7, 0.38));
  content: "";
  pointer-events: none;
}

#app .fd-best__tap {
  position: absolute;
  inset: 0;
  z-index: 4;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: inherit;
  background: transparent;
  box-shadow: none;
  appearance: none;
}

#app .fd-best__copy {
  position: relative;
  z-index: 3;
  grid-column: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: center;
  min-width: 0;
  padding: 27px 8px 27px 22px;
  text-align: left;
  pointer-events: none;
}

#app .fd-best__label,
#app .fd-best__station {
  display: block;
  max-width: 100%;
  margin: 0;
  overflow: hidden;
  font-family: inherit;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app .fd-best__label {
  color: rgba(255, 255, 255, 0.78);
}

#app .fd-best__trend {
  display: flex;
  align-items: baseline;
  align-self: flex-start;
  gap: 8px;
  margin-top: 13px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  text-align: left;
}

#app .fd-best__trend.is-lower {
  color: #30d158;
}

#app .fd-best__trend.is-higher {
  color: #ff3442;
}

#app .fd-best__trend.is-steady {
  color: rgba(255, 255, 255, 0.58);
}

#app .fd-best__trend i {
  color: rgba(255, 255, 255, 0.52);
  font-style: normal;
  font-weight: 500;
}

#app .fd-best__price {
  display: block;
  align-self: flex-start;
  margin: 5px 0 0;
  color: #ff2d3b;
  font-size: clamp(48px, 13.5vw, 62px);
  font-weight: 760;
  letter-spacing: -0.055em;
  line-height: 0.96;
  text-align: left;
  white-space: nowrap;
}

#app .fd-best__station {
  align-self: flex-start;
  width: 100%;
  margin-top: 44px;
  color: rgba(255, 255, 255, 0.92);
}

#app .fd-best__meta {
  display: block;
  align-self: flex-start;
  justify-self: start;
  margin-top: 9px;
  padding: 0;
  color: rgba(255, 255, 255, 0.52);
  font-size: 12px;
  font-weight: 560;
  line-height: 1.25;
  text-align: left;
  white-space: nowrap;
}

#app .fd-best__chevron {
  position: absolute;
  top: 15px;
  right: 14px;
  z-index: 5;
  width: 18px;
  height: 18px;
  fill: none;
  stroke: rgba(255, 255, 255, 0.62);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
  pointer-events: none;
}

.search-suggestion-panel {
  position: relative;
  z-index: 800;
  display: grid;
  margin: 10px 4px 14px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 12px;
  background: linear-gradient(
    145deg,
    rgba(31, 31, 34, 0.78),
    rgba(8, 8, 10, 0.88)
  );
  box-shadow:
    inset 0 1px rgba(255, 255, 255, 0.12),
    0 13px 28px rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(22px) saturate(135%);
  -webkit-backdrop-filter: blur(22px) saturate(135%);
}

.search-suggestion-heading {
  padding: 9px 12px 7px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  color: rgba(255, 255, 255, 0.42);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.09em;
  line-height: 1;
  text-transform: uppercase;
}

.search-suggestion-section-label {
  display: flex;
  align-items: center;
  min-height: 27px;
  padding: 7px 12px 5px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.55);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.07em;
  line-height: 1;
  text-transform: uppercase;
}

.search-suggestion-section-label.is-global {
  margin-top: 4px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  color: rgba(255, 107, 99, 0.9);
}

.search-suggestion-section-label.is-address {
  border-left: 2px solid rgba(255, 59, 69, 0.72);
  padding-left: 10px;
  color: rgba(255, 255, 255, 0.78);
}

.search-suggestion-panel[hidden] {
  display: none;
}

.search-suggestion-panel button {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-height: 44px;
  padding: 7px 11px;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  color: #fff;
  text-align: left;
  background: transparent;
}

.search-suggestion-panel button:last-child {
  border-bottom: 0;
}

.search-suggestion-panel button.is-global {
  width: calc(100% - 16px);
  min-height: 48px;
  margin: 8px;
  border: 1px solid rgba(255, 59, 69, 0.28);
  border-radius: 11px;
  background: rgba(255, 59, 69, 0.08);
}

.search-suggestion-panel button.is-global strong {
  color: #fff;
}

.search-suggestion-panel button.is-global small {
  color: rgba(255, 188, 184, 0.82);
}

.search-suggestion-panel svg {
  width: 16px;
  fill: none;
  stroke: #ff3b45;
  stroke-width: 1.8;
}

.search-suggestion-panel span,
.search-suggestion-panel strong,
.search-suggestion-panel small {
  display: block;
  min-width: 0;
}

.search-suggestion-panel strong {
  overflow: hidden;
  font-size: 12.5px;
  font-weight: 630;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-suggestion-panel small {
  margin-top: 1px;
  color: rgba(255, 255, 255, 0.48);
  font-size: 9.5px;
}

/* R60: searching must acknowledge work immediately without hiding the input. */
#app .search-suggestion-status,
#app .search-results-loading {
  display: flex;
  align-items: center;
  gap: 9px;
  color: rgba(255, 255, 255, 0.58);
  font-size: 11px;
  line-height: 1.35;
}

#app .search-suggestion-status {
  min-height: 38px;
  padding: 9px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

#app .search-suggestion-status.is-error {
  color: rgba(255, 202, 138, 0.82);
}

#app .search-suggestion-status .search-loading-spinner,
#app .search-results-loading .search-loading-spinner {
  width: 14px;
  height: 14px;
  border-width: 1.8px;
}

#app .search-results-loading {
  margin: 10px 4px 14px;
  padding: 11px 12px;
  background: rgba(255, 59, 69, 0.07);
  border: 1px solid rgba(255, 59, 69, 0.18);
  border-radius: 13px;
}

.map-location-control {
  border-color: rgba(255, 255, 255, 0.12) !important;
  background: rgba(25, 25, 28, 0.7) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.map-location-control svg {
  opacity: 0.78;
}

.dashboard-favorite-card,
.favorites-screen-card {
  grid-template-areas: none !important;
}

.fuel-advice-card::before,
.fuel-advice-card::after {
  display: none !important;
}

.about-build {
  align-items: center !important;
}

.about-build > em {
  display: flex !important;
  flex-direction: column;
  align-items: flex-end;
  color: #8c8c90 !important;
  font-size: 11px !important;
  font-style: normal;
  line-height: 1.25;
}

.about-build small {
  margin-top: 2px;
  color: rgba(255, 255, 255, 0.4);
  font-size: 10px;
}

@media (max-width: 370px) {
  #app .fd-best {
    grid-template-columns: minmax(0, 58%) minmax(0, 42%);
    min-height: 296px;
  }

  #app .fd-best__copy {
    padding-left: 19px;
  }

  #app .fd-best__label,
  #app .fd-best__station {
    font-size: 16px;
  }

  #app .fd-best__station {
    margin-top: 40px;
  }

  #app .fd-best__price {
    font-size: 47px;
  }
}

/* R40: the recommendation keeps its semantic text color, not its own surface. */
#app .fuel-advice-card,
#app .fuel-advice-card.is-now,
#app .fuel-advice-card.is-soon,
#app .fuel-advice-card.is-later,
#app .fuel-advice-card.is-good,
#app .fuel-advice-card.is-wait,
#app .fuel-advice-card.is-neutral {
  background: linear-gradient(145deg, #0d0d108f, #040406b8) !important;
  border-color: #2c2c31 !important;
  box-shadow:
    inset 0 1px #ffffff18,
    0 16px 36px #0007 !important;
}

#app .fuel-advice-card::before,
#app .fuel-advice-card::after {
  display: none !important;
}

#app .fuel-advice-card.is-now strong,
#app .fuel-advice-card.is-soon strong,
#app .fuel-advice-card.is-later strong,
#app .fuel-advice-card.is-good strong,
#app .fuel-advice-card.is-wait strong,
#app .fuel-advice-card.is-neutral strong {
  text-shadow: none !important;
}

#app .fuel-advice-card.is-now strong {
  color: #30d158 !important;
}

#app .fuel-advice-card.is-soon strong,
#app .fuel-advice-card.is-wait strong {
  color: #ffad4a !important;
}

#app .fuel-advice-card.is-later strong {
  color: #ff5f57 !important;
}

/* R35: compact, calm best-price card — final cascade over the earlier isolated variant. */
#app .location {
  margin-bottom: 14px !important;
}

#app .fd-best {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 228px;
  place-items: center;
}

#app .fd-best__map {
  opacity: 0.64;
}

#app .fd-best::after {
  background:
    linear-gradient(180deg, rgba(5, 5, 7, 0.26), rgba(5, 5, 7, 0.38)),
    radial-gradient(circle at 50% 50%, rgba(5, 5, 7, 0.56) 0%, rgba(5, 5, 7, 0.29) 58%, rgba(5, 5, 7, 0.1) 100%);
}

#app .fd-best__copy {
  grid-column: 1;
  align-items: center;
  justify-content: center;
  align-self: center;
  gap: 8px;
  width: 100%;
  padding: 20px 22px;
  text-align: center;
}

#app .fd-best__label,
#app .fd-best__station {
  width: auto;
  max-width: 100%;
  margin: 0;
  overflow: visible;
  color: rgba(255, 255, 255, 0.88);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-overflow: clip;
  white-space: normal;
}

#app .fd-best__trend {
  align-self: center;
  margin: 0;
  font-size: 12px;
  text-align: center;
}

#app .fd-best__price {
  align-self: center;
  margin: 0;
  color: #ff2d3b;
  font-size: clamp(48px, 13.5vw, 60px);
  text-align: center;
}

#app .fd-best__station {
  align-self: center;
  margin: 0;
}

#app .fd-best__meta {
  align-self: center;
  justify-self: center;
  margin: 0;
  text-align: center;
}

#app .fd-best + .dashboard-section {
  margin-top: 16px !important;
}

@media (max-width: 370px) {
  #app .fd-best {
    grid-template-columns: 1fr;
    min-height: 220px;
  }

  #app .fd-best__copy {
    padding: 18px;
  }

  #app .fd-best__label,
  #app .fd-best__station {
    font-size: 16px;
  }

  #app .fd-best__price {
    font-size: 47px;
  }
}

/* R45 performance: off-screen station rows do not participate in paint work. */
#app .result-list {
  contain: layout style;
}

#app .station-result {
  content-visibility: auto;
  contain-intrinsic-size: 96px;
}

#app .header-background-status {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  gap: 7px;
  color: rgba(255, 255, 255, .62);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .02em;
}

#app .header-background-status b { font: inherit; }

#app .header-background-status i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #ff3b30;
  box-shadow: 0 0 0 0 rgba(255, 59, 48, 0.48);
  animation: fd-r61-pulse 1.15s ease-out infinite;
}

#app .search-loading-spinner {
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  border: 2px solid rgba(255, 77, 87, 0.22);
  border-top-color: #ff4b57;
  border-radius: 50%;
  animation: fd-r60-spin .72s linear infinite;
}

@keyframes fd-r60-spin {
  to { transform: rotate(360deg); }
}

@keyframes fd-r61-pulse {
  70% { box-shadow: 0 0 0 7px rgba(255, 68, 80, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 68, 80, 0); }
}

@media (prefers-reduced-motion: reduce) {
  #app .search-loading-spinner { animation-duration: 2s; }
  #app .header-background-status i { animation-duration: 2s; }
}

#app .search-field,
#app .search-suggestion-panel {
  touch-action: manipulation;
}

/* R84.11: clear/submit search controls and station opening state */
#app .search-field { gap: 8px; }
#app .search-field input { align-self: stretch; }
#app .search-field-action { width: 21px; height: 21px; min-width: 21px; margin: 0; padding: 0 0 2px; border-radius: 50%; display: grid; place-items: center; align-self: center; flex: 0 0 21px; line-height: 1; transform: none; }
#app .search-field-action[hidden] { display: none !important; }
#app .search-field-action:active { transform: scale(.94); }
#app .search-field-clear { border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.045); color: #b5b5bb; font-size: 15px; font-weight: 500; }
#app .station-opening-row { display: block; clear: both; min-height: 15px; margin: 5px 0 5px; }
#app .station-opening-row + small { display: block; margin-top: 4px; }
#app .station-opening { display: inline-flex; align-items: center; gap: 5px; margin: 0; color: #a8a8ae; font-size: 10px; line-height: 1.15; }
#app .station-opening i { width: 7px; height: 7px; border-radius: 50%; background: #85858c; box-shadow: 0 0 7px rgba(133,133,140,.45); }
#app .station-opening.is-open { color: #30d158; }
#app .station-opening.is-open i { background: #30d158; box-shadow: 0 0 8px rgba(48,209,88,.55); }
#app .station-opening.is-closing { color: #f0b46a; }
#app .station-opening.is-closing i { background: #f2a64a; box-shadow: 0 0 8px rgba(242,166,74,.55); }
#app .station-opening.is-closed { color: #ff5f57; }
#app .station-opening.is-closed i { background: #ff5f57; box-shadow: 0 0 8px rgba(255,95,87,.55); }
#app .location-request { cursor: pointer; border-radius: 12px; outline: none; }
#app .location-request:focus-visible { box-shadow: 0 0 0 2px rgba(255,107,99,.7); }
#app .station-opening-hours { display: block; margin: -9px 0 13px; color: #a5a5aa; font-size: 10px; line-height: 1.35; }
#app .station-opening-hours > span { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: baseline; }
#app .station-opening-hours b { color: #e3e3e7; font-weight: 650; }
#app .station-opening-hours em { color: #d4d4d8; font-style: normal; font-variant-numeric: tabular-nums; }
#app .station-meta .is-open { color: #30d158; }
#app .station-meta .is-open:before { background: #30d158; box-shadow: 0 0 8px rgba(48,209,88,.4); }
#app .station-meta .is-closed { color: #ff5f57; }
#app .station-meta .is-closed:before { background: #ff5f57; box-shadow: 0 0 8px rgba(255,95,87,.4); }
#app .station-meta .is-closing { color: #f0b46a; }
#app .station-meta .is-closing:before { background: #f2a64a; box-shadow: 0 0 8px rgba(242,166,74,.4); }
#app .station-detail-link { display: inline-flex; margin-top: 3px; }
#app .station-detail-link + .station-opening-row { margin-top: 2px; }

/* R65: the primary-station decision is colored by its live recommendation. */
#app .primary-station-card.is-now {
  border-color: rgba(48, 209, 88, .38);
}

#app .primary-station-card.is-now .primary-station-card__copy small,
#app .primary-station-card.is-now .primary-station-card__price,
#app .primary-station-card.is-now .primary-station-card__insights > div:first-child > strong {
  color: #30d158 !important;
}

#app .primary-station-card.is-wait,
#app .primary-station-card.is-good,
#app .primary-station-card.is-soon {
  border-color: rgba(255, 173, 74, .4);
}

#app .primary-station-card.is-wait .primary-station-card__copy small,
#app .primary-station-card.is-wait .primary-station-card__price,
#app .primary-station-card.is-wait .primary-station-card__insights > div:first-child > strong,
#app .primary-station-card.is-good .primary-station-card__copy small,
#app .primary-station-card.is-good .primary-station-card__price,
#app .primary-station-card.is-good .primary-station-card__insights > div:first-child > strong,
#app .primary-station-card.is-soon .primary-station-card__copy small,
#app .primary-station-card.is-soon .primary-station-card__price,
#app .primary-station-card.is-soon .primary-station-card__insights > div:first-child > strong {
  color: #ffad4a !important;
}

#app .primary-station-card.is-later {
  border-color: rgba(255, 95, 87, .42);
}

#app .primary-station-card.is-later .primary-station-card__copy small,
#app .primary-station-card.is-later .primary-station-card__price,
#app .primary-station-card.is-later .primary-station-card__insights > div:first-child > strong {
  color: #ff5f57 !important;
}

#app .primary-station-card.is-neutral {
  border-color: rgba(240, 240, 242, .26);
}

#app .primary-station-card.is-neutral .primary-station-card__insights > div:first-child > strong {
  color: #f0f0f2 !important;
}

#app .tab-loading {
  display: grid;
  min-height: 42dvh;
  place-items: center;
}

#app .tab-loading-spinner {
  width: 24px;
  height: 24px;
  border: 3px solid rgba(255, 59, 48, .2);
  border-top-color: #ff3b30;
  border-radius: 50%;
  animation: fd-r60-spin .72s linear infinite;
}

/* R47: compact, non-duplicated primary station on the dashboard. */
#app .primary-station-card {
  margin: 14px 0 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 59, 69, 0.22);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(29, 25, 27, 0.82), rgba(10, 10, 11, 0.9));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.07), 0 12px 28px rgba(0, 0, 0, 0.24);
}

#app .primary-station-card > button {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto 16px;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: 76px;
  padding: 12px 14px;
  color: #fff;
  text-align: left;
  background: transparent;
  border: 0;
  font: inherit;
}

#app .primary-station-card .station-logo {
  width: 34px;
  height: 34px;
  border-radius: 10px;
}

#app .primary-station-card__copy {
  min-width: 0;
}

#app .primary-station-card__copy small,
#app .primary-station-card__copy strong,
#app .primary-station-card__copy > span {
  display: block;
}

#app .primary-station-card__copy small {
  margin-bottom: 2px;
  color: #ff535d;
  font-size: 9px;
  font-weight: 720;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#app .primary-station-card__copy strong {
  overflow: hidden;
  font-size: 14px;
  font-weight: 690;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app .primary-station-card__copy > span {
  margin-top: 3px;
  color: rgba(255, 255, 255, 0.5);
  font-size: 10px;
}

#app .primary-station-card__price {
  color: #ff3b45;
  font-size: 18px;
  font-weight: 760;
  white-space: nowrap;
}

#app .primary-station-card > button > svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: rgba(255, 255, 255, 0.42);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#app .primary-station-badge {
  display: inline-flex !important;
  width: fit-content;
  margin: 0 0 4px;
  padding: 3px 7px;
  color: #ff5a64;
  font-size: 8px !important;
  font-weight: 730;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: rgba(255, 59, 69, 0.1);
  border: 1px solid rgba(255, 59, 69, 0.24);
  border-radius: 999px;
}

#app .favorites-screen-card.is-primary-station {
  border-color: rgba(255, 59, 69, 0.3) !important;
}

#app .primary-station-action {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: -2px 0 14px;
  padding: 10px 12px;
  color: rgba(255, 255, 255, 0.88);
  text-align: left;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px;
  font: inherit;
}

#app .primary-station-action.is-active {
  color: #fff;
  background: rgba(255, 59, 69, 0.09);
  border-color: rgba(255, 59, 69, 0.28);
}

#app .primary-station-action > svg {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  fill: none;
  stroke: #ff4a54;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#app .primary-station-action > span,
#app .primary-station-action strong,
#app .primary-station-action small {
  display: block;
}

#app .primary-station-action strong {
  font-size: 11px;
  font-weight: 680;
}

#app .primary-station-action small {
  margin-top: 2px;
  color: rgba(255, 255, 255, 0.43);
  font-size: 9px;
}

@media (hover: hover) {
  #app .primary-station-card > button:hover,
  #app .primary-station-action:hover {
    background-color: rgba(255, 255, 255, 0.045);
  }
}

/* R78: archive backfill stays local to the chart and never blocks details. */
#app .detail-history-status {
  min-height: 34px;
  margin-top: 12px;
  border: 1px solid rgba(255, 59, 48, .2);
  border-radius: 13px;
  background: rgba(255, 59, 48, .06);
  color: rgba(255, 255, 255, .72);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 7px 10px;
  font-size: 10px;
  font-weight: 700;
}

#app .detail-history-status.is-error {
  justify-content: space-between;
}

#app .detail-history-status button {
  border: 0;
  border-radius: 10px;
  background: rgba(255, 59, 48, .14);
  color: #ff5a51;
  padding: 7px 9px;
  font: inherit;
}

#app .detail-history-spinner {
  width: 14px;
  height: 14px;
  box-sizing: border-box;
  border: 2px solid rgba(255, 59, 48, .22);
  border-top-color: #ff3b30;
  border-radius: 50%;
  animation: detail-history-spin .72s linear infinite;
}

#app .detail-history-attribution {
  margin: 12px 2px 0;
  color: rgba(255, 255, 255, .42);
  font-size: 7px;
  line-height: 1.45;
  text-align: center;
}

#app .detail-history-attribution a {
  color: rgba(255, 90, 81, .78);
  text-decoration: none;
}

@keyframes detail-history-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  #app .detail-history-spinner { animation-duration: 1.8s; }
}

/* R77: optional previous/next controls replace gesture navigation. */
#app .tab-stepper {
  position: fixed;
  left: 50%;
  bottom: calc(90px + env(safe-area-inset-bottom));
  z-index: 6;
  width: min(100% - 32px, 448px);
  height: 0;
  transform: translateX(-50%);
}

#app .tab-stepper__controls {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  height: 58px;
  overflow: hidden;
  background: rgba(18, 18, 20, .61);
  border: 1px solid #38383c;
  border-radius: 27px;
  box-shadow: inset 0 1px rgba(255, 255, 255, .1), 0 16px 34px rgba(0, 0, 0, .72);
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity .15s ease, transform .15s cubic-bezier(.22, .72, .25, 1);
  -webkit-backdrop-filter: blur(30px) saturate(150%);
  backdrop-filter: blur(30px) saturate(150%);
}

#app .tab-stepper.is-open .tab-stepper__controls {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

#app .tab-stepper__controls button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 0;
  padding: 0 18px;
  color: var(--brand-red);
  background: transparent;
  border: 0;
  font-size: 13px;
  font-weight: 650;
}

#app .tab-stepper__controls button + button {
  border-left: 1px solid rgba(255, 255, 255, .08);
}

#app .tab-stepper__controls button:disabled {
  color: rgba(255, 255, 255, .28);
  cursor: default;
}

#app .tab-stepper__controls svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#app .tab-stepper__toggle {
  position: absolute;
  bottom: -7px;
  left: 50%;
  display: grid;
  place-items: center;
  width: 64px;
  height: 24px;
  padding: 0;
  background: transparent;
  border: 0;
  transform: translateX(-50%) !important;
  transition: bottom .15s cubic-bezier(.22, .72, .25, 1);
}

#app .tab-stepper__toggle > span {
  width: 28px;
  height: 3px;
  background: var(--brand-red);
  border-radius: 999px;
  box-shadow: 0 0 9px rgba(255, 59, 48, .35);
}

#app .tab-stepper.is-open .tab-stepper__toggle {
  bottom: 49px;
}

@media (prefers-reduced-motion: reduce) {
  #app .tab-stepper__controls,
  #app .tab-stepper__toggle {
    transition-duration: .01ms;
  }
}

/* R48: expanded primary station decision card. */
#app .primary-station-card {
  border-color: color-mix(in srgb, var(--brand-red) 30%, transparent);
}

#app .primary-station-card__head {
  border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
}

#app .primary-station-card__copy small,
#app .primary-station-card__price,
#app .primary-station-badge,
#app .primary-station-action > svg {
  color: var(--brand-red) !important;
  stroke: var(--brand-red) !important;
}

#app .primary-station-card__insights {
  display: grid;
  gap: 13px;
  padding: 16px;
}

#app .primary-station-card__insights > div:first-child > small,
#app .primary-station-card__insights > div:first-child > strong,
#app .primary-station-card__insights > div:first-child > span {
  display: block;
}

#app .primary-station-card__insights > div:first-child > small {
  color: rgba(255, 255, 255, 0.43);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}

#app .primary-station-card__insights > div:first-child > strong {
  margin-top: 7px;
  color: var(--brand-red);
  font-size: 22px;
  line-height: 1.2;
}

#app .primary-station-card__insights > div:first-child > span {
  margin-top: 6px;
  color: rgba(255, 255, 255, .66);
  font-size: 12px;
  line-height: 1.42;
}

#app .primary-station-card__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

#app .primary-station-card__facts > span {
  min-width: 0;
  min-height: 72px;
  padding: 9px;
  background: rgba(255, 255, 255, .035);
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 15px;
  display: flex;
  flex-direction: column;
}

#app .primary-station-card__facts small,
#app .primary-station-card__facts b {
  display: block;
}

#app .primary-station-card__facts small {
  min-height: 0;
  color: rgba(255, 255, 255, .4);
  font-size: 9px;
  line-height: 1.25;
}

#app .primary-station-card__facts b {
  margin-top: auto;
  overflow: hidden;
  color: rgba(255, 255, 255, .88);
  font-size: 11px;
  letter-spacing: -.025em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 370px) {
  #app .primary-station-card__facts {
    grid-template-columns: 1fr;
  }
  #app .primary-station-card__facts small { min-height: 0; }
}

/* R84.7: the detail recommendation uses the same 16px card rhythm as the rest of the detail view. */
#app .detail-view > .detail-advice-card {
  box-sizing: border-box;
  margin: 14px 0 16px !important;
  padding: 0 !important;
}

#app .detail-view > .detail-advice-card + .detail-chart {
  margin-top: 0 !important;
}

#app .primary-station-card .primary-station-card__insights > div:first-child > h2 {
  margin: 0;
  color: #fff;
  letter-spacing: -0.48px;
  font-size: 16px;
  font-weight: 700;
}

/* R84.30: recommendation card uses the detail-price dark surface while status remains semantic. */
#app .primary-station-card.is-now,
#app .primary-station-card.is-wait,
#app .primary-station-card.is-good,
#app .primary-station-card.is-soon,
#app .primary-station-card.is-later,
#app .primary-station-card.is-neutral {
  background: #06060880;
  box-shadow:
    inset 0 1px #ffffff0b,
    0 12px 28px rgba(0, 0, 0, .24);
}

#app .primary-station-card__facts > span {
  min-height: 60px;
  padding: 8px 9px;
  background: #06060880;
  border-color: #303035;
  box-shadow: inset 0 1px #ffffff0b;
}

/* R84.36: canonical station labels, balanced availability filter and quiet view transitions. */
#app .primary-station-card__facts > span {
  background: var(--control-glass);
  border-color: var(--control-border);
  box-shadow:
    inset 0 1px #ffffff18,
    0 8px 20px #0007;
  backdrop-filter: blur(14px) saturate(125%);
  -webkit-backdrop-filter: blur(14px) saturate(125%);
}

#app .search-availability-filter {
  display: flex;
  margin: 4px;
  padding: 0;
}

#app [data-search-availability-filter] + .result-list {
  margin-top: 0 !important;
}

#app [data-search-availability-filter] + .result-list > .station-result:first-child {
  margin-top: 4px;
}

#app .search-availability-filter button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 26px;
  padding: 3px 0;
  color: #a8a8ae;
  font: inherit;
  font-size: 10.5px;
  font-weight: 600;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#app .search-availability-filter__box {
  position: relative;
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 4px;
  background: rgba(255, 255, 255, .025);
}

#app .search-availability-filter button.is-active {
  color: rgba(255, 255, 255, .82);
}

#app .search-availability-filter button.is-active .search-availability-filter__box {
  border-color: #ff786f;
  background: #ff3b30;
  box-shadow: 0 0 8px rgba(255, 59, 48, .28);
}

#app .search-availability-filter button.is-active .search-availability-filter__box::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4px;
  height: 7px;
  border: solid #fff;
  border-width: 0 1.5px 1.5px 0;
  content: "";
  transform: translate(-55%, -62%) rotate(45deg);
}

@keyframes fd-r84-view-in {
  from { opacity: .01; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fd-r84-pop-in {
  from { opacity: .01; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: no-preference) {
  #app .app-content.is-view-enter > :not(.brand-header) {
    animation: fd-r84-view-in .18s cubic-bezier(.22, .72, .25, 1) both;
  }

  #app .route-options:not([hidden]),
  #app .search-suggestion-panel:not([hidden]) {
    animation: fd-r84-pop-in .14s ease-out both;
  }

  #app :where(.round-button, .refresh-pill, .route-trigger, .route-options a, .station-detail-link, .favorite-toggle, .detail-price-card, .search-field-action, .search-availability-filter button, .station-sort button, .fuel-tab-bar button):active {
    transform: translateY(1px) !important;
    filter: brightness(.94);
  }
}

@media (prefers-reduced-motion: reduce) {
  #app .app-content.is-view-enter > :not(.brand-header),
  #app .route-options:not([hidden]),
  #app .search-suggestion-panel:not([hidden]) {
    animation: none;
  }
}
.chart-range button.is-disabled,
.chart-range button:disabled {
  color: #746d70;
  background: transparent;
  box-shadow: none;
  cursor: default;
  opacity: 0.58;
  pointer-events: none;
}

/* R75: stable touch feedback without zooming surfaces. */
#app :where(button, .route-options a):active,
#app :where(.round-button, .refresh-pill, .brand-wordmark):active {
  transform: none !important;
}

#app :where(.price-hero, .dashboard-section.glass-card, .station-card, .map-card, .search-card),
#app :where(.price-hero, .dashboard-section.glass-card, .station-card, .map-card, .search-card):active,
#app .chart-block.dashboard-section.glass-card,
#app .chart-block.dashboard-section.glass-card:active {
  transform: none !important;
}

#app .favorite-toggle:active svg {
  transform: none !important;
}

#app .detail-price-card:active {
  transform: none !important;
}

/* R84.38: the supplied Hoyer wordmark has its own red edge-to-edge field. */
#app .station-logo.station-logo--hoyer img {
  padding: 0;
}

/* R76: unavailable fuel copy fits the same compact detail price tile. */
#app .detail-price-card.is-unavailable > strong {
  font-size: 10px !important;
  line-height: 1.15;
  letter-spacing: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}

@media (hover: hover) {
  #app :where(.price-hero, .dashboard-section.glass-card, .station-card, .map-card, .search-card):hover,
  #app .chart-block.dashboard-section.glass-card:hover {
    transform: none !important;
  }
}

/* ===== assets/r87-price-alerts.css ===== */
.fd-alert-open{overflow:hidden}.fd-alert-modal{position:fixed;inset:0;z-index:2147483000;background:#09090b;display:block;overflow:auto;-webkit-overflow-scrolling:touch;padding:max(14px,env(safe-area-inset-top)) 14px calc(28px + env(safe-area-inset-bottom));pointer-events:auto;touch-action:manipulation}.fd-alert-sheet{width:min(100%,560px);margin:0 auto;background:transparent;border:0;border-radius:0;padding:0;color:#fff;box-shadow:none;overflow:visible;pointer-events:auto}.fd-alert-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 2px 16px;position:sticky;top:0;z-index:4;background:linear-gradient(#09090b 76%,rgba(9,9,11,0))}.fd-alert-kicker{display:block;margin-bottom:5px;color:#ff453a;font-size:10px;font-weight:800;letter-spacing:.18em}.fd-alert-head h2{margin:0;font-size:25px;line-height:1.1;letter-spacing:-.025em}.fd-alert-close{display:grid;place-items:center;flex:0 0 auto;border:1px solid rgba(255,255,255,.09);background:rgba(28,28,30,.92);color:#fff;width:38px;height:38px;border-radius:50%;padding:0;font-size:25px;line-height:1;pointer-events:auto;touch-action:manipulation}.fd-alert-status{padding:13px 14px;border:1px solid rgba(255,255,255,.075);border-radius:16px;background:rgba(20,20,22,.88);margin-bottom:12px;font-size:13px;line-height:1.4;color:#b8b8bd}.fd-alert-status[data-type=working]{color:#fff;border-color:rgba(255,255,255,.12)}.fd-alert-status[data-type=success]{color:#30d158;border-color:rgba(48,209,88,.28);background:rgba(48,209,88,.10)}.fd-alert-status[data-type=error]{color:#ffd9d6;border-color:rgba(255,69,58,.32);background:rgba(46,18,17,.9)}.fd-alert-status[data-type=install]{color:#d1d1d6;border-color:rgba(255,255,255,.12);background:rgba(24,24,27,.94)}.fd-alert-grid{display:grid;gap:9px}.fd-alert-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px;background:rgba(20,20,22,.9);border:1px solid rgba(255,255,255,.07);border-radius:16px;box-shadow:inset 0 1px rgba(255,255,255,.035);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.fd-alert-row span{font-size:15px;font-weight:540;min-width:0}.fd-alert-row small{display:block;color:#8f8f95;margin-top:4px;font-size:11px;line-height:1.35;font-weight:400}.fd-alert-row input,.fd-alert-row select{pointer-events:auto;touch-action:manipulation}.fd-alert-row input[type=checkbox]{flex:0 0 auto;width:23px;height:23px;accent-color:#ff3b30}.fd-alert-row select,.fd-alert-row input[type=time],.fd-alert-row input[type=number]{background:#2a2a2e;color:#fff;border:1px solid rgba(255,255,255,.075);border-radius:11px;padding:9px 10px;max-width:138px;min-height:38px;font:inherit}.fd-alert-actions{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:10px;margin-top:15px}.fd-alert-actions button{position:relative;z-index:10;border:1px solid rgba(255,255,255,.09);border-radius:15px;padding:14px 12px;min-height:50px;font-weight:750;font-size:13px;line-height:1.2;pointer-events:auto!important;touch-action:manipulation;cursor:pointer;-webkit-tap-highlight-color:transparent}.fd-alert-actions button:active{transform:scale(.985)}.fd-alert-actions button:disabled{opacity:.62;cursor:default;transform:none}.fd-alert-enable{background:#ff3b30;color:#fff;box-shadow:none}.fd-alert-test{background:#242428;color:#fff;box-shadow:none}.fd-alert-note{font-size:12px;line-height:1.5;color:#8e8e93;margin:15px 2px 0}.menu-card button[data-fd-price-alerts]{opacity:1!important;pointer-events:auto!important}.menu-card button[data-fd-price-alerts] em{color:#ff453a!important}@media (min-width:700px){.fd-alert-modal{padding:28px}.fd-alert-head{top:-1px}}
/* R88: fixed header, native tap behavior, and iOS install guidance */
.fd-alert-modal{padding:0 14px calc(28px + env(safe-area-inset-bottom));}
.fd-alert-sheet{padding-top:calc(78px + env(safe-area-inset-top));}
.fd-alert-head{position:fixed;top:0;left:50%;transform:translateX(-50%);width:min(calc(100% - 28px),560px);height:calc(66px + env(safe-area-inset-top));box-sizing:border-box;padding:calc(8px + env(safe-area-inset-top)) 2px 12px;z-index:2147483002;background:#09090b;border-bottom:1px solid rgba(255,255,255,.055);}
.fd-alert-actions{position:relative;z-index:2147483001;padding-bottom:2px;}
.fd-alert-actions button{touch-action:manipulation!important;-webkit-user-select:none;user-select:none;}
/* R88: per-favorite station selection */
.fd-alert-station-section{margin-top:18px}.fd-alert-station-section>header{display:flex;align-items:end;justify-content:space-between;padding:0 2px 9px}.fd-alert-station-section h3{margin:0;font-size:17px;letter-spacing:-.015em}.fd-alert-station-section header small{display:block;color:#8e8e93;font-size:11px;margin-top:3px}.fd-alert-all{margin-bottom:9px}.fd-alert-stations{display:grid;gap:7px;transition:opacity .18s ease}.fd-alert-stations.is-disabled{opacity:.58}.fd-alert-station{display:flex;align-items:center;gap:12px;min-height:62px;padding:10px 13px;background:rgba(20,20,22,.9);border:1px solid rgba(255,255,255,.07);border-radius:15px}.fd-alert-station input{order:3;margin-left:auto;flex:0 0 auto;width:23px;height:23px;accent-color:#ff3b30}.fd-alert-station img{width:38px;height:38px;object-fit:contain;flex:0 0 38px}.fd-alert-station span{min-width:0}.fd-alert-station strong{display:block;font-size:14px;line-height:1.2;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fd-alert-station small{display:block;margin-top:4px;color:#8e8e93;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fd-alert-empty{margin:0;padding:14px;border:1px solid rgba(255,255,255,.07);border-radius:15px;background:rgba(20,20,22,.9);color:#8e8e93;font-size:12px;line-height:1.45}

/* ===== assets/r95-theme-tankbook.css ===== */
/* FuelDash R90 – isolated appearance and tankbook extension */

:root {
  --fd-r90-red: #ff3b30;
  --fd-r90-green: #30d158;
  --fd-r90-dark-bg: #050505;
  --fd-r90-dark-surface: rgba(18, 18, 21, 0.88);
  --fd-r90-dark-border: rgba(255, 255, 255, 0.1);
  --fd-r90-light-bg: #f2f2f5;
  --fd-r90-light-surface: rgba(255, 255, 255, 0.8);
  --fd-r90-light-surface-strong: rgba(245, 245, 248, 0.94);
  --fd-r90-light-border: rgba(42, 42, 47, 0.14);
  --fd-r90-light-text: #141416;
  --fd-r90-light-muted: #626268;
}

#app button,
.fd-feature-page button,
.fd-feature-page input,
.fd-feature-page select,
.fd-feature-page textarea,
.fd-alert-modal button,
.fd-alert-modal input,
.fd-alert-modal select {
  -webkit-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}

body.fd-feature-open {
  overflow: hidden;
  overscroll-behavior: none;
}

.menu-card.fd-menu-ready {
  opacity: 1;
}

.menu-card button[data-fd-appearance],
.menu-card button[data-fd-tankbook] {
  opacity: 1;
  pointer-events: auto;
}

.menu-card button[data-fd-appearance] em,
.menu-card button[data-fd-tankbook] em {
  color: var(--fd-r90-red);
  font-weight: 650;
}

/* Feature page foundation – matches FuelDash dark glass styling. */
.fd-feature-page {
  position: fixed;
  inset: 0;
  z-index: 2147482500;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  background:
    radial-gradient(circle at 12% 2%, rgba(124, 28, 25, 0.24), transparent 30%),
    radial-gradient(circle at 92% 68%, rgba(89, 20, 22, 0.18), transparent 34%),
    #050505;
  color: #fff;
  opacity: 0;
  transform: translate3d(0, 10px, 0);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.fd-feature-page.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.fd-feature-shell {
  width: min(100%, 480px);
  min-height: 100dvh;
  margin: 0 auto;
  padding-bottom: calc(28px + env(safe-area-inset-bottom));
}

.fd-feature-header {
  position: sticky;
  top: 0;
  z-index: 10;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: start;
  gap: 13px;
  padding: calc(14px + env(safe-area-inset-top)) 20px 15px;
  background: linear-gradient(180deg, rgba(5, 5, 5, 0.98) 76%, rgba(5, 5, 5, 0));
  -webkit-backdrop-filter: blur(22px) saturate(130%);
  backdrop-filter: blur(22px) saturate(130%);
}

.fd-feature-back {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin-top: 2px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 50%;
  background: rgba(24, 24, 27, 0.82);
  color: #fff;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.07);
}

.fd-feature-back svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fd-feature-heading {
  min-width: 0;
}

.fd-feature-heading > small,
.fd-feature-card > small,
.fd-feature-card__head small,
.fd-tank-history__head small {
  display: block;
  margin-bottom: 4px;
  color: var(--fd-r90-red);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.17em;
}

.fd-feature-heading h1 {
  margin: 0;
  font-size: 27px;
  line-height: 1.05;
  letter-spacing: -0.85px;
}

.fd-feature-heading p {
  margin: 6px 0 0;
  color: #99999f;
  font-size: 11px;
  line-height: 1.35;
}

.fd-feature-content {
  padding: 10px 20px 0;
}

.fd-feature-card,
.fd-theme-choice,
.fd-tank-summary article,
.fd-tank-entry {
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: linear-gradient(145deg, rgba(25, 25, 29, 0.86), rgba(8, 8, 10, 0.92));
  -webkit-backdrop-filter: blur(28px) saturate(130%);
  backdrop-filter: blur(28px) saturate(130%);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.055), 0 18px 42px rgba(0, 0, 0, 0.27);
}

.fd-feature-card {
  border-radius: 24px;
  padding: 18px;
}

.fd-feature-card h2,
.fd-tank-history__head h2 {
  margin: 0;
  font-size: 17px;
  line-height: 1.18;
  letter-spacing: -0.38px;
}

.fd-feature-card > p {
  margin: 9px 0 0;
  color: #a4a4aa;
  font-size: 12px;
  line-height: 1.5;
}

.fd-theme-options {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.fd-theme-choice {
  position: relative;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) 22px;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 13px;
  border-radius: 22px;
  color: #fff;
  text-align: left;
}

.fd-theme-choice.is-selected {
  border-color: rgba(255, 59, 48, 0.66);
  box-shadow: inset 0 0 0 1px rgba(255, 59, 48, 0.18), 0 14px 34px rgba(0, 0, 0, 0.22);
}

.fd-theme-choice__copy {
  min-width: 0;
}

.fd-theme-choice__copy strong,
.fd-theme-choice__copy small {
  display: block;
}

.fd-theme-choice__copy strong {
  font-size: 15px;
  letter-spacing: -0.2px;
}

.fd-theme-choice__copy small {
  margin-top: 5px;
  color: #96969c;
  font-size: 10px;
  line-height: 1.35;
}

.fd-theme-choice__check {
  display: grid;
  place-items: center;
  width: 21px;
  height: 21px;
  border: 1px solid #55555b;
  border-radius: 50%;
}

.fd-theme-choice.is-selected .fd-theme-choice__check {
  border-color: var(--fd-r90-red);
  background: var(--fd-r90-red);
}

.fd-theme-choice.is-selected .fd-theme-choice__check::after {
  width: 8px;
  height: 4px;
  border-bottom: 2px solid #fff;
  border-left: 2px solid #fff;
  content: '';
  transform: translateY(-1px) rotate(-45deg);
}

.fd-theme-preview {
  position: relative;
  display: block;
  width: 92px;
  height: 104px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 16px;
  background: #08080a;
  color: #fff;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
}

.fd-theme-preview.is-light {
  border-color: rgba(0, 0, 0, 0.13);
  background: #ededf1;
  color: #151517;
}

.fd-theme-preview__top {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 9px 7px 5px;
  font-size: 7px;
}

.fd-theme-preview__top > i {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  background: var(--fd-r90-red);
}

.fd-theme-preview__top b {
  font-weight: 760;
}

.fd-theme-preview__top strong {
  color: var(--fd-r90-red);
}

.fd-theme-preview__card {
  display: grid;
  gap: 5px;
  margin: 4px 7px;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(40, 40, 44, 0.86), rgba(13, 13, 15, 0.94));
}

.fd-theme-preview.is-light .fd-theme-preview__card {
  border-color: rgba(0, 0, 0, 0.12);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(220, 221, 226, 0.92));
}

.fd-theme-preview__card i {
  display: block;
  width: 72%;
  height: 4px;
  border-radius: 99px;
  background: currentColor;
  opacity: 0.26;
}

.fd-theme-preview__card i:nth-child(2) {
  width: 46%;
}

.fd-theme-preview__card em {
  width: 34%;
  height: 9px;
  margin-top: 3px;
  border-radius: 5px;
  background: var(--fd-r90-red);
}

.fd-theme-preview__nav {
  position: absolute;
  right: 7px;
  bottom: 7px;
  left: 7px;
  display: flex;
  justify-content: space-around;
  padding: 5px 4px;
  border-radius: 8px;
  background: rgba(28, 28, 31, 0.92);
}

.fd-theme-preview.is-light .fd-theme-preview__nav {
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.1);
}

.fd-theme-preview__nav i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.36;
}

.fd-theme-preview__nav i:first-child {
  background: var(--fd-r90-red);
  opacity: 1;
}

.fd-theme-preview__label {
  position: absolute;
  top: 7px;
  right: 6px;
  color: #8d8d93;
  font-size: 6px;
  font-weight: 700;
  text-transform: uppercase;
}

.fd-feature-note {
  margin: 13px 3px 0;
  color: #8e8e94;
  font-size: 11px;
  text-align: center;
}

/* Tankbook */
.fd-tank-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.fd-tank-summary article {
  min-width: 0;
  border-radius: 19px;
  padding: 14px;
}

.fd-tank-summary small,
.fd-tank-summary strong {
  display: block;
}

.fd-tank-summary small {
  color: #8f8f95;
  font-size: 9px;
}

.fd-tank-summary strong {
  margin-top: 6px;
  color: #fff;
  font-size: 18px;
  line-height: 1.05;
  letter-spacing: -0.45px;
}

.fd-tank-summary article:last-child strong {
  color: var(--fd-r90-red);
}

.fd-feature-card__head,
.fd-tank-history__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.fd-feature-card__head > span,
.fd-tank-history__head > span {
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 999px;
  padding: 6px 8px;
  color: #8f8f95;
  background: rgba(255, 255, 255, 0.035);
  font-size: 8px;
}

.fd-tank-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
  margin-top: 16px;
}

.fd-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.fd-field-wide {
  grid-column: 1 / -1;
}

.fd-field > span:first-child {
  color: #99999f;
  font-size: 9px;
  font-weight: 620;
}

.fd-field input,
.fd-field select,
.fd-field textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 13px;
  outline: none;
  background: rgba(7, 7, 9, 0.68);
  color: #fff;
  font: inherit;
  font-size: 13px;
  line-height: 1.2;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.025);
}

.fd-field input,
.fd-field select {
  height: 44px;
  padding: 0 11px;
}

.fd-field textarea {
  min-height: 78px;
  padding: 11px;
  resize: vertical;
}

.fd-field input::placeholder,
.fd-field textarea::placeholder {
  color: #68686e;
}

.fd-field input:focus,
.fd-field select:focus,
.fd-field textarea:focus {
  border-color: rgba(255, 59, 48, 0.7);
  box-shadow: 0 0 0 3px rgba(255, 59, 48, 0.12);
}

.fd-field input[aria-invalid='true'],
.fd-field select[aria-invalid='true'],
.fd-field textarea[aria-invalid='true'] {
  border-color: var(--fd-r90-red);
}

.fd-field-affix {
  position: relative;
  display: block;
}

.fd-field-affix input {
  padding-right: 35px;
}

.fd-field-affix b {
  position: absolute;
  top: 50%;
  right: 11px;
  color: #7f7f85;
  font-size: 10px;
  font-weight: 600;
  transform: translateY(-50%);
}

.fd-form-status {
  grid-column: 1 / -1;
  min-height: 16px;
  margin: 0;
  color: #8f8f95;
  font-size: 10px;
  line-height: 1.35;
}

.fd-form-status[data-type='success'] {
  color: #30d158;
}

.fd-form-status[data-type='error'] {
  color: #ff7770;
}

.fd-tank-submit {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  border: 1px solid var(--fd-r90-red);
  border-radius: 15px;
  background: var(--fd-r90-red);
  color: #fff;
  font-size: 13px;
  font-weight: 760;
  box-shadow: 0 12px 25px rgba(255, 59, 48, 0.19);
}

.fd-tank-submit svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fd-tank-history {
  margin-top: 22px;
}

.fd-tank-history__head {
  padding: 0 2px 10px;
}

.fd-tank-list {
  display: grid;
  gap: 11px;
}

.fd-tank-entry {
  position: relative;
  border-radius: 22px;
  padding: 15px;
}

.fd-tank-entry__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-right: 2px;
}

.fd-tank-entry__head small {
  display: block;
  color: #8f8f95;
  font-size: 9px;
}

.fd-tank-entry__head h3 {
  margin: 4px 0 0;
  font-size: 14px;
  line-height: 1.2;
  letter-spacing: -0.18px;
}

.fd-tank-entry__head > span {
  flex: 0 0 auto;
  border: 1px solid rgba(255, 59, 48, 0.32);
  border-radius: 999px;
  padding: 5px 8px;
  background: rgba(255, 59, 48, 0.1);
  color: #ff6b62;
  font-size: 9px;
  font-weight: 700;
}

.fd-tank-entry__values {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-top: 13px;
}

.fd-tank-entry__values > span {
  min-width: 0;
  border: 1px solid rgba(255, 255, 255, 0.065);
  border-radius: 13px;
  padding: 9px;
  background: rgba(255, 255, 255, 0.025);
}

.fd-tank-entry__values small,
.fd-tank-entry__values strong {
  display: block;
}

.fd-tank-entry__values small {
  color: #85858b;
  font-size: 8px;
}

.fd-tank-entry__values strong {
  margin-top: 4px;
  color: #fff;
  font-size: 12px;
  line-height: 1.15;
}

.fd-tank-entry__values > span:last-child strong {
  color: var(--fd-r90-red);
}

.fd-tank-entry > p {
  margin: 10px 0 0;
  color: #8f8f95;
  font-size: 10px;
  line-height: 1.4;
}

.fd-tank-delete {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 11px;
  padding: 5px 0;
  border: 0;
  background: transparent;
  color: #8f8f95;
  font-size: 9px;
}

.fd-tank-delete svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fd-tank-empty {
  display: grid;
  justify-items: center;
  padding: 34px 24px;
  border: 1px dashed rgba(255, 255, 255, 0.12);
  border-radius: 22px;
  color: #8f8f95;
  text-align: center;
}

.fd-tank-empty > span {
  font-size: 29px;
  filter: grayscale(0.3);
}

.fd-tank-empty strong {
  margin-top: 10px;
  color: #d8d8dc;
  font-size: 13px;
}

.fd-tank-empty p {
  max-width: 260px;
  margin: 6px 0 0;
  font-size: 10px;
  line-height: 1.45;
}

/* Complete Lightmode surface layer. Dark remains untouched unless light is explicit. */
html[data-fd-theme="light"] {
  color: var(--fd-r90-light-text);
  background-color: var(--fd-r90-light-bg);
  background-image:
    radial-gradient(circle at 10% 3%, rgba(255, 59, 48, 0.13), transparent 31%),
    radial-gradient(circle at 91% 42%, rgba(136, 136, 148, 0.13), transparent 34%),
    linear-gradient(145deg, #f8f8fa 0%, #ededf1 54%, #f5f5f7 100%);
}

html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
body[data-fd-theme="light"] {
  background-color: var(--fd-r90-light-bg);
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] body {
  background: transparent;
}

html[data-fd-theme="light"] .fd-fast-shell {
  background: transparent;
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] .brand-wordmark span {
  color: #111113;
}

html[data-fd-theme="light"] .brand-wordmark strong {
  color: var(--fd-r90-red);
}

html[data-fd-theme="light"] .fd-fast-kicker,
html[data-fd-theme="light"] .fd-fast-title,
html[data-fd-theme="light"] .fd-fast-line {
  background: rgba(35, 35, 40, 0.13);
}

html[data-fd-theme="light"] .fd-fast-line.is-price {
  background: rgba(255, 59, 48, 0.24);
}

html[data-fd-theme="light"] .fd-fast-card,
html[data-fd-theme="light"] .fd-fast-nav {
  border-color: var(--fd-r90-light-border);
  background: rgba(255, 255, 255, 0.76);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.9), 0 12px 28px rgba(60, 60, 67, 0.1);
}

html[data-fd-theme="light"] .fd-fast-nav span {
  color: #65656b;
}

html[data-fd-theme="light"] .fd-fast-nav span:first-child {
  color: var(--fd-r90-red);
}

html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] #app .app-shell,
html[data-fd-theme="light"] #app .app-content,
html[data-fd-theme="light"] #app .detail-view {
  color: var(--fd-r90-light-text);
  background: transparent;
}

html[data-fd-theme="light"] #app .brand-wordmark,
html[data-fd-theme="light"] #app .brand-wordmark span {
  color: #111113;
}

html[data-fd-theme="light"] #app .brand-wordmark strong {
  color: var(--fd-r90-red);
}

html[data-fd-theme="light"] #app .brand-wordmark img {
  filter: drop-shadow(0 4px 8px rgba(80, 20, 17, 0.18));
}

html[data-fd-theme="light"] #app :where(
  .location strong,
  .location-line strong,
  .dashboard-section h2,
  .detail-chart h2,
  .detail-prices h2,
  .station-copy strong,
  .station-identity h2,
  .primary-station-card__copy strong,
  .primary-station-card__facts b,
  .search-suggestion-panel strong,
  .route-options a,
  .detail-price-card > strong,
  .station-opening-hours b
) {
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] #app :where(
  .location small,
  .location em,
  .screen-lead,
  .empty-state,
  .station-copy small,
  .station-value small,
  .station-location,
  .detail-prices header small,
  .station-identity small,
  .station-address,
  .detail-prices > header > span,
  .detail-chart > header > span,
  .freshness-copy,
  .primary-station-card__copy > span,
  .primary-station-card__facts small,
  .primary-station-action small,
  .detail-history-attribution,
  .search-suggestion-panel small,
  .station-opening-hours em,
  .chart-context
) {
  color: var(--fd-r90-light-muted);
}

html[data-fd-theme="light"] #app :where(
  .glass-card,
  .price-hero,
  .station-card,
  .result-list .station-card,
  .detail-card,
  .detail-price,
  .detail-chart,
  .detail-prices,
  .menu-card,
  .fuel-map,
  .search-field,
  .primary-station-card,
  .route-chooser,
  .search-suggestion-panel,
  .detail-history-status,
  .tab-stepper__controls
) {
  border-color: var(--fd-r90-light-border) !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.86), rgba(226, 227, 232, 0.78)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.94), 0 15px 34px rgba(55, 55, 62, 0.11) !important;
}

html[data-fd-theme="light"] #app .price-hero {
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] #app .price-hero :where(.hero-label, .hero-place, small, b) {
  color: var(--fd-r90-light-muted);
}

html[data-fd-theme="light"] #app .price-hero > strong,
html[data-fd-theme="light"] #app .price-hero .hero-price,
html[data-fd-theme="light"] #app .price-hero .hero-main strong {
  color: var(--fd-r90-red);
}

html[data-fd-theme="light"] #app .round-button,
html[data-fd-theme="light"] #app .refresh-pill,
html[data-fd-theme="light"] #app .map-location-button,
html[data-fd-theme="light"] #app .route-trigger,
html[data-fd-theme="light"] #app .route-options a,
html[data-fd-theme="light"] #app .search-field-action,
html[data-fd-theme="light"] #app .station-detail-link,
html[data-fd-theme="light"] #app .primary-station-action,
html[data-fd-theme="light"] #app .tab-stepper__toggle,
html[data-fd-theme="light"] #app .tab-stepper__controls button {
  border-color: rgba(35, 35, 40, 0.14);
  background: rgba(241, 241, 244, 0.86);
  color: #242428;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.95);
}

html[data-fd-theme="light"] #app .refresh-pill,
html[data-fd-theme="light"] #app .route-trigger,
html[data-fd-theme="light"] #app .station-detail-link {
  color: #4e4e54;
}

html[data-fd-theme="light"] #app .fuel-tab-bar {
  border-color: rgba(30, 30, 35, 0.16);
  background: rgba(248, 248, 250, 0.86);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.98), 0 18px 38px rgba(55, 55, 62, 0.16);
}

html[data-fd-theme="light"] #app .fuel-tab-bar button {
  border: 0;
  background: transparent;
  color: #606066;
  box-shadow: none;
}

html[data-fd-theme="light"] #app .fuel-tab-bar button.is-active {
  background: rgba(255, 59, 48, 0.1);
  color: var(--fd-r90-red);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.74);
}

html[data-fd-theme="light"] #app .menu-card {
  opacity: 1;
}

html[data-fd-theme="light"] #app .menu-card button {
  border: 0;
  border-bottom: 1px solid rgba(38, 38, 43, 0.1);
  background: transparent;
  color: var(--fd-r90-light-text);
  box-shadow: none;
}

html[data-fd-theme="light"] #app .menu-card button:last-child {
  border-bottom: 0;
}

html[data-fd-theme="light"] #app .menu-card button :where(span, em) {
  color: #68686e;
}

html[data-fd-theme="light"] #app .menu-card button[data-fd-price-alerts] em,
html[data-fd-theme="light"] #app .menu-card button[data-fd-appearance] em,
html[data-fd-theme="light"] #app .menu-card button[data-fd-tankbook] em {
  color: var(--fd-r90-red) !important;
}

html[data-fd-theme="light"] #app .fuel-preference button,
html[data-fd-theme="light"] #app .nearby-radius button,
html[data-fd-theme="light"] #app .chart-range button,
html[data-fd-theme="light"] #app .fuel-filter button,
html[data-fd-theme="light"] #app .station-sort button,
html[data-fd-theme="light"] #app .search-availability-filter button,
html[data-fd-theme="light"] #app .detail-price-card {
  border-color: rgba(35, 35, 40, 0.13);
  background: rgba(226, 226, 231, 0.76);
  color: #202024;
  box-shadow: none;
}

html[data-fd-theme="light"] #app .chart-range,
html[data-fd-theme="light"] #app .fuel-filter,
html[data-fd-theme="light"] #app .station-sort,
html[data-fd-theme="light"] #app .search-availability-filter {
  border-color: rgba(35, 35, 40, 0.12);
  background: rgba(225, 225, 230, 0.68);
}

html[data-fd-theme="light"] #app :where(
  .fuel-preference button.is-active,
  .nearby-radius button.is-active,
  .chart-range button.is-active,
  .fuel-filter button.is-active,
  .station-sort button.is-active,
  .search-availability-filter button.is-active,
  .detail-price-card.is-selected
) {
  border-color: rgba(255, 59, 48, 0.72);
  background: rgba(255, 59, 48, 0.13);
  color: #171719;
  box-shadow: inset 0 0 0 1px rgba(255, 59, 48, 0.08);
}

html[data-fd-theme="light"] #app :where(
  .fuel-preference button.is-active > span,
  .fuel-preference button.is-active > strong,
  .nearby-radius button.is-active > span,
  .detail-price-card.is-selected > span,
  .detail-price-card.is-selected > strong,
  .detail-price-card.is-selected > small
) {
  color: #171719;
}

html[data-fd-theme="light"] #app .search-field input {
  color: #171719;
}

html[data-fd-theme="light"] #app .search-field input::placeholder {
  color: #77777d;
}

html[data-fd-theme="light"] #app .search-suggestion-panel,
html[data-fd-theme="light"] #app .route-options {
  border-color: var(--fd-r90-light-border);
  background: rgba(250, 250, 252, 0.97);
  color: var(--fd-r90-light-text);
  box-shadow: 0 18px 35px rgba(45, 45, 52, 0.17);
}

html[data-fd-theme="light"] #app .search-suggestion-panel button,
html[data-fd-theme="light"] #app .route-options a {
  color: var(--fd-r90-light-text);
  background: transparent;
}

html[data-fd-theme="light"] #app .station-card.is-selected,
html[data-fd-theme="light"] #app .favorites-screen-card.is-primary-station {
  border-color: rgba(255, 59, 48, 0.46) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 59, 48, 0.11), 0 14px 30px rgba(55, 55, 62, 0.1) !important;
}

html[data-fd-theme="light"] #app .favorite-toggle {
  border-color: rgba(35, 35, 40, 0.12);
  background: rgba(232, 232, 236, 0.82);
  color: #67676d;
}

html[data-fd-theme="light"] #app .favorite-toggle.is-favorite,
html[data-fd-theme="light"] #app .detail-favorite.is-favorite {
  color: var(--fd-r90-red);
}

html[data-fd-theme="light"] #app .detail-price-card > span,
html[data-fd-theme="light"] #app .detail-price-card > small,
html[data-fd-theme="light"] #app .station-value .price-change,
html[data-fd-theme="light"] #app .detail-freshness,
html[data-fd-theme="light"] #app .station-meta span + span {
  color: var(--fd-r90-light-muted);
}

html[data-fd-theme="light"] #app .detail-price-card > strong,
html[data-fd-theme="light"] #app .station-value > strong,
html[data-fd-theme="light"] #app .fd-best__price {
  color: var(--fd-r90-red);
}

html[data-fd-theme="light"] #app .primary-station-card__facts > span,
html[data-fd-theme="light"] #app .station-opening-hours > span,
html[data-fd-theme="light"] #app .chart-selection-readout,
html[data-fd-theme="light"] #app .detail-history-status {
  border-color: rgba(35, 35, 40, 0.1);
  background: rgba(225, 225, 230, 0.62);
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] #app .chart-scale,
html[data-fd-theme="light"] #app .chart-labels,
html[data-fd-theme="light"] #app .chart-selection-readout span,
html[data-fd-theme="light"] #app .chart-legend {
  color: #696970;
}

html[data-fd-theme="light"] #app .chart-grid {
  stroke: #c7c7cd;
}

html[data-fd-theme="light"] #app .chart-average,
html[data-fd-theme="light"] #app .chart-selection-average {
  stroke: #77777f;
}

html[data-fd-theme="light"] #app .chart-selection-line {
  stroke: #57575d;
}

html[data-fd-theme="light"] #app .fuel-map .leaflet-tile-pane {
  filter: invert(0.93) hue-rotate(180deg) saturate(0.7) brightness(1.07) contrast(0.91);
}

html[data-fd-theme="light"] #app .fuel-map .leaflet-container {
  background: #e6e6ea;
}

html[data-fd-theme="light"] #app .fuel-map .leaflet-control-attribution,
html[data-fd-theme="light"] #app .fuel-map .leaflet-control-attribution a {
  background: rgba(255, 255, 255, 0.82);
  color: #59595f;
}

html[data-fd-theme="light"] #app .map-price-marker {
  border-color: rgba(30, 30, 35, 0.18);
  background: rgba(255, 255, 255, 0.94);
  color: #161618;
  box-shadow: 0 7px 19px rgba(40, 40, 46, 0.18);
}

html[data-fd-theme="light"] #app .map-price-marker-price {
  color: var(--fd-r90-red);
}

html[data-fd-theme="light"] #app .map-price-marker-name {
  color: #55555b;
}

html[data-fd-theme="light"] #app .search-availability-filter__box {
  border-color: #77777e;
  background: rgba(255, 255, 255, 0.56);
}

html[data-fd-theme="light"] #app .search-availability-filter button.is-active .search-availability-filter__box {
  border-color: var(--fd-r90-red);
  background: var(--fd-r90-red);
}

html[data-fd-theme="light"] #app .detail-history-attribution a {
  color: #55555c;
}

html[data-fd-theme="light"] #app .detail-history-status.is-error {
  border-color: rgba(255, 59, 48, 0.26);
  background: rgba(255, 59, 48, 0.08);
}

html[data-fd-theme="light"] #app .detail-history-status button {
  color: #18181b;
  background: transparent;
}

/* Price alerts are outside #app and need their own light overrides. */
html[data-fd-theme="light"] .fd-alert-modal {
  background: var(--fd-r90-light-bg);
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] .fd-alert-sheet {
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] .fd-alert-head {
  background: linear-gradient(var(--fd-r90-light-bg) 78%, rgba(242, 242, 245, 0));
}

html[data-fd-theme="light"] .fd-alert-head h2,
html[data-fd-theme="light"] .fd-alert-row span,
html[data-fd-theme="light"] .fd-alert-station strong,
html[data-fd-theme="light"] .fd-alert-station-section h3 {
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] .fd-alert-close,
html[data-fd-theme="light"] .fd-alert-row,
html[data-fd-theme="light"] .fd-alert-status,
html[data-fd-theme="light"] .fd-alert-station-section,
html[data-fd-theme="light"] .fd-alert-all,
html[data-fd-theme="light"] .fd-alert-station,
html[data-fd-theme="light"] .fd-alert-test {
  border-color: var(--fd-r90-light-border);
  background: rgba(255, 255, 255, 0.8);
  color: var(--fd-r90-light-text);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.94);
}

html[data-fd-theme="light"] .fd-alert-row small,
html[data-fd-theme="light"] .fd-alert-note,
html[data-fd-theme="light"] .fd-alert-station small,
html[data-fd-theme="light"] .fd-alert-station-section header small {
  color: var(--fd-r90-light-muted);
}

html[data-fd-theme="light"] .fd-alert-row select,
html[data-fd-theme="light"] .fd-alert-row input[type='time'],
html[data-fd-theme="light"] .fd-alert-row input[type='number'] {
  border-color: rgba(35, 35, 40, 0.13);
  background: #e5e5e9;
  color: #171719;
}

html[data-fd-theme="light"] .fd-alert-status[data-type='working'],
html[data-fd-theme="light"] .fd-alert-status[data-type='install'] {
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] .fd-alert-status[data-type='success'] {
  border-color: rgba(48, 209, 88, 0.28);
  background: rgba(48, 209, 88, 0.1);
  color: #30d158;
}

html[data-fd-theme="light"] .fd-alert-status[data-type='error'] {
  border-color: rgba(255, 59, 48, 0.28);
  background: rgba(255, 59, 48, 0.09);
  color: #a51e18;
}

html[data-fd-theme="light"] .fd-alert-enable {
  background: var(--fd-r90-red);
  color: #fff;
}

/* Feature pages in Lightmode. */
html[data-fd-theme="light"] .fd-feature-page {
  background:
    radial-gradient(circle at 10% 1%, rgba(255, 59, 48, 0.13), transparent 31%),
    radial-gradient(circle at 92% 62%, rgba(135, 135, 145, 0.13), transparent 34%),
    var(--fd-r90-light-bg);
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] .fd-feature-header {
  background: linear-gradient(180deg, rgba(242, 242, 245, 0.98) 76%, rgba(242, 242, 245, 0));
}

html[data-fd-theme="light"] .fd-feature-back {
  border-color: var(--fd-r90-light-border);
  background: rgba(255, 255, 255, 0.82);
  color: #202024;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.96), 0 7px 18px rgba(55, 55, 62, 0.1);
}

html[data-fd-theme="light"] .fd-feature-heading p,
html[data-fd-theme="light"] .fd-feature-card > p,
html[data-fd-theme="light"] .fd-theme-choice__copy small,
html[data-fd-theme="light"] .fd-feature-note,
html[data-fd-theme="light"] .fd-field > span:first-child,
html[data-fd-theme="light"] .fd-tank-entry__head small,
html[data-fd-theme="light"] .fd-tank-entry > p,
html[data-fd-theme="light"] .fd-tank-empty,
html[data-fd-theme="light"] .fd-form-status {
  color: var(--fd-r90-light-muted);
}

html[data-fd-theme="light"] .fd-feature-card,
html[data-fd-theme="light"] .fd-theme-choice,
html[data-fd-theme="light"] .fd-tank-summary article,
html[data-fd-theme="light"] .fd-tank-entry {
  border-color: var(--fd-r90-light-border);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(226, 227, 232, 0.8));
  color: var(--fd-r90-light-text);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.96), 0 17px 38px rgba(55, 55, 62, 0.11);
}

html[data-fd-theme="light"] .fd-theme-choice {
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] .fd-theme-choice__check {
  border-color: #77777d;
}

html[data-fd-theme="light"] .fd-theme-choice.is-selected .fd-theme-choice__check {
  border-color: var(--fd-r90-red);
}

html[data-fd-theme="light"] .fd-tank-summary small,
html[data-fd-theme="light"] .fd-tank-entry__values small,
html[data-fd-theme="light"] .fd-feature-card__head > span,
html[data-fd-theme="light"] .fd-tank-history__head > span {
  color: var(--fd-r90-light-muted);
}

html[data-fd-theme="light"] .fd-tank-summary strong,
html[data-fd-theme="light"] .fd-tank-entry__head h3,
html[data-fd-theme="light"] .fd-tank-entry__values strong,
html[data-fd-theme="light"] .fd-tank-empty strong {
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] .fd-tank-summary article:last-child strong,
html[data-fd-theme="light"] .fd-tank-entry__values > span:last-child strong {
  color: var(--fd-r90-red);
}

html[data-fd-theme="light"] .fd-feature-card__head > span,
html[data-fd-theme="light"] .fd-tank-history__head > span,
html[data-fd-theme="light"] .fd-tank-entry__values > span {
  border-color: rgba(35, 35, 40, 0.1);
  background: rgba(221, 221, 226, 0.56);
}

html[data-fd-theme="light"] .fd-field input,
html[data-fd-theme="light"] .fd-field select,
html[data-fd-theme="light"] .fd-field textarea {
  border-color: rgba(35, 35, 40, 0.13);
  background: rgba(238, 238, 242, 0.92);
  color: #171719;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.72);
}

html[data-fd-theme="light"] .fd-field input::placeholder,
html[data-fd-theme="light"] .fd-field textarea::placeholder {
  color: #85858b;
}

html[data-fd-theme="light"] .fd-field-affix b {
  color: #69696f;
}

html[data-fd-theme="light"] .fd-tank-delete {
  border: 0;
  background: transparent;
  color: #66666c;
  box-shadow: none;
}

html[data-fd-theme="light"] .fd-tank-empty {
  border-color: rgba(35, 35, 40, 0.14);
}

@media (min-width: 720px) {
  html[data-fd-theme="light"] body {
    background: var(--fd-r90-light-bg);
  }

  html[data-fd-theme="light"] #app .app-shell,
  html[data-fd-theme="light"] .fd-feature-shell {
    box-shadow: 0 0 0 1px rgba(35, 35, 40, 0.1), 0 28px 80px rgba(45, 45, 52, 0.16);
  }
}

@media (max-width: 370px) {
  .fd-feature-content,
  .fd-feature-header {
    padding-right: 15px;
    padding-left: 15px;
  }

  .fd-theme-choice {
    grid-template-columns: 78px minmax(0, 1fr) 20px;
    gap: 10px;
  }

  .fd-theme-preview {
    width: 78px;
  }

  .fd-tank-form {
    grid-template-columns: 1fr;
  }

  .fd-field-wide,
  .fd-form-status,
  .fd-tank-submit {
    grid-column: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fd-feature-page {
    transition: none;
  }
}

/* R90 light-mode completeness pass for late legacy cascades. */
html[data-fd-theme="light"] #app .fd-best {
  border-color: var(--fd-r90-light-border);
  background: #f7f7f9;
  color: var(--fd-r90-light-text);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.96), 0 18px 42px rgba(55, 55, 62, 0.14);
}

html[data-fd-theme="light"] #app .fd-best__map {
  background: #e4e4e8;
  opacity: 0.34;
}

html[data-fd-theme="light"] #app .fd-best::after {
  background:
    linear-gradient(90deg, rgba(250, 250, 252, 0.98) 0%, rgba(246, 246, 249, 0.88) 49%, rgba(246, 246, 249, 0.32) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(230, 230, 235, 0.2));
}

html[data-fd-theme="light"] #app .fd-best__label,
html[data-fd-theme="light"] #app .fd-best__station {
  color: #1a1a1d;
}

html[data-fd-theme="light"] #app .fd-best__meta,
html[data-fd-theme="light"] #app .fd-best__trend.is-steady,
html[data-fd-theme="light"] #app .fd-best__trend i {
  color: #66666d;
}

html[data-fd-theme="light"] #app .fd-best__chevron {
  stroke: #5f5f66;
}

html[data-fd-theme="light"] #app :where(
  .station-card,
  .detail-fuel,
  .detail-price-card,
  .search-suggestion-panel button,
  .primary-station-card > button,
  .primary-station-action,
  .primary-station-action.is-active,
  .map-location-control
) {
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] #app .detail-fuel,
html[data-fd-theme="light"] #app .map-location-control {
  border-color: var(--fd-r90-light-border);
  background: rgba(245, 245, 248, 0.86);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.95);
}

html[data-fd-theme="light"] #app .primary-station-card > button > svg {
  stroke: #65656c;
}

html[data-fd-theme="light"] #app .primary-station-card__insights > div:first-child > small,
html[data-fd-theme="light"] #app .primary-station-card__insights > div:first-child > span,
html[data-fd-theme="light"] #app .primary-station-action small,
html[data-fd-theme="light"] #app .header-background-status,
html[data-fd-theme="light"] #app .search-suggestion-heading,
html[data-fd-theme="light"] #app .search-suggestion-status,
html[data-fd-theme="light"] #app .search-results-loading,
html[data-fd-theme="light"] #app .about-build small {
  color: var(--fd-r90-light-muted);
}

html[data-fd-theme="light"] #app .primary-station-card .primary-station-card__insights > div:first-child > h2 {
  color: var(--fd-r90-light-text);
}

html[data-fd-theme="light"] #app .primary-station-card.is-neutral .primary-station-card__insights > div:first-child > strong {
  color: #4d4d53 !important;
}

html[data-fd-theme="light"] #app .tab-stepper__controls button:disabled {
  color: #9a9aa0;
}

html[data-fd-theme="light"] #app .leaflet-tooltip {
  border-color: rgba(35, 35, 40, 0.14);
  background: rgba(255, 255, 255, 0.95);
  color: #1b1b1e;
  box-shadow: 0 8px 18px rgba(50, 50, 57, 0.13);
}

/* FuelDash R91 – light counterpart, fixed feature header, backups, statistics and cloud auth. */
:root {
  --fd-r91-light-bg: #f4f4f6;
  --fd-r91-light-surface: rgba(255, 255, 255, 0.84);
  --fd-r91-light-surface-strong: #ffffff;
  --fd-r91-light-border: rgba(28, 28, 31, 0.14);
  --fd-r91-light-text: #151517;
  --fd-r91-light-muted: #68686f;
}

/* Keep feature headers physically fixed. Only the content area scrolls. */
.fd-feature-page {
  overflow: hidden;
}

.fd-feature-shell {
  display: flex;
  flex-direction: column;
  height: 100dvh;
  min-height: 0;
}

.fd-feature-header {
  position: relative;
  top: auto;
  flex: 0 0 auto;
}

.fd-feature-content {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
  padding-bottom: calc(30px + env(safe-area-inset-bottom));
}

/* R91 removes the translucent rectangle and glow around the small red stepper handle. */
#app .tab-stepper__toggle,
html[data-fd-theme="light"] #app .tab-stepper__toggle {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

#app .tab-stepper__toggle > span,
html[data-fd-theme="light"] #app .tab-stepper__toggle > span {
  box-shadow: none !important;
}

/* New tankbook blocks. */
.fd-month-card,
.fd-cloud-card,
.fd-backup-card {
  margin-bottom: 14px;
}

.fd-month-head {
  align-items: center;
}

.fd-month-picker {
  flex: 0 0 auto;
}

.fd-month-picker input {
  width: 116px;
  min-height: 34px;
  padding: 0 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 11px;
  outline: none;
  background: rgba(7, 7, 9, 0.64);
  color: #fff;
  font: inherit;
  font-size: 10px;
}

.fd-month-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-top: 15px;
}

.fd-month-grid article {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.025);
}

.fd-month-grid__wide {
  grid-column: 1 / -1;
}

.fd-month-grid small,
.fd-month-grid strong {
  display: block;
}

.fd-month-grid small {
  color: #89898f;
  font-size: 8px;
}

.fd-month-grid strong {
  margin-top: 5px;
  color: #fff;
  font-size: 15px;
  line-height: 1.1;
  letter-spacing: -0.3px;
}

.fd-month-grid article:nth-child(3) strong,
.fd-month-grid article:nth-child(4) strong {
  color: var(--fd-r90-red);
}

.fd-cloud-card > p,
.fd-backup-card > p {
  margin: 10px 0 0;
  color: #9b9ba1;
  font-size: 11px;
  line-height: 1.48;
}

.fd-auth-actions,
.fd-cloud-actions,
.fd-backup-actions {
  display: grid;
  gap: 9px;
  margin-top: 15px;
}

.fd-auth-button,
.fd-cloud-actions button,
.fd-backup-actions button {
  display: flex;
  align-items: center;
  min-height: 46px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 14px;
  font: inherit;
}

.fd-auth-button {
  justify-content: center;
  gap: 9px;
  padding: 0 14px;
  font-size: 12px;
}

.fd-auth-button.is-apple {
  border-color: #fff;
  background: #fff;
  color: #050505;
}

.fd-auth-button.is-google {
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
}

.fd-auth-icon {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  font-size: 12px;
  font-weight: 800;
}

.fd-cloud-footnote {
  display: block;
  margin-top: 10px;
  color: #7f7f85;
  font-size: 8px;
  line-height: 1.45;
}

.fd-cloud-account {
  font-weight: 650;
  word-break: break-word;
}

.fd-cloud-message {
  min-height: 15px;
}

.fd-cloud-message.is-success,
.fd-cloud-badge.is-success {
  color: #30d158 !important;
}

.fd-cloud-message.is-working,
.fd-cloud-badge.is-working {
  color: #d8b868 !important;
}

.fd-cloud-message.is-error,
.fd-cloud-badge.is-error {
  color: #ff7770 !important;
}

.fd-cloud-actions {
  grid-template-columns: minmax(0, 1fr) auto;
}

.fd-cloud-actions button {
  justify-content: center;
  padding: 0 13px;
  background: rgba(255, 255, 255, 0.045);
  color: #fff;
  font-size: 10px;
  font-weight: 680;
}

.fd-cloud-actions button:first-child {
  border-color: rgba(255, 59, 48, 0.48);
  color: #ff6b62;
}

.fd-backup-actions {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.fd-backup-actions button {
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  min-width: 0;
  padding: 9px 6px;
  background: rgba(255, 255, 255, 0.035);
  color: #fff;
  text-align: center;
}

.fd-backup-actions button > span {
  color: var(--fd-r90-red);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.06em;
}

.fd-backup-actions button > strong {
  font-size: 8px;
  line-height: 1.25;
}

.fd-backup-input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

.fd-backup-status {
  min-height: 14px;
  margin: 9px 0 0;
  color: #8f8f95;
  font-size: 9px;
  line-height: 1.4;
}

.fd-backup-status[data-type="success"] {
  color: #30d158;
}

.fd-backup-status[data-type="error"] {
  color: #ff7770;
}

/* The light theme is intentionally flat and endless: no red haze, glow or gradient. */
html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
body[data-fd-theme="light"] {
  min-height: 100%;
  background-color: var(--fd-r91-light-bg) !important;
  background-image: none !important;
  background-attachment: scroll !important;
  color: var(--fd-r91-light-text);
}

html[data-fd-theme="light"] body {
  background: var(--fd-r91-light-bg) !important;
}

html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] #app .app-shell,
html[data-fd-theme="light"] #app .app-content,
html[data-fd-theme="light"] #app .detail-view,
html[data-fd-theme="light"] .fd-fast-shell {
  background-color: var(--fd-r91-light-bg) !important;
  background-image: none !important;
}

html[data-fd-theme="light"] .fd-feature-page,
html[data-fd-theme="light"] .fd-feature-shell,
html[data-fd-theme="light"] .fd-feature-content {
  background: var(--fd-r91-light-bg) !important;
  color: var(--fd-r91-light-text);
}

html[data-fd-theme="light"] .fd-feature-header {
  border-bottom: 1px solid rgba(28, 28, 31, 0.08);
  background: var(--fd-r91-light-bg) !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* Selected fuel and radius choices mirror the dark theme's strong red state. */
html[data-fd-theme="light"] #app :where(
  .fuel-preference button.is-active,
  .nearby-radius button.is-active
) {
  border-color: var(--fd-r90-red) !important;
  background: var(--fd-r90-red) !important;
  color: #fff !important;
  box-shadow: none !important;
}

html[data-fd-theme="light"] #app :where(
  .fuel-preference button.is-active > span,
  .fuel-preference button.is-active > strong,
  .nearby-radius button.is-active > span,
  .nearby-radius button.is-active > strong
) {
  color: #fff !important;
}

/* Remaining choice groups retain a restrained tint to preserve their existing hierarchy. */
html[data-fd-theme="light"] #app :where(
  .chart-range button.is-active,
  .fuel-filter button.is-active,
  .station-sort button.is-active,
  .search-availability-filter button.is-active,
  .detail-price-card.is-selected
) {
  border-color: rgba(255, 59, 48, 0.66);
  background: rgba(255, 59, 48, 0.12);
  color: var(--fd-r91-light-text);
}

html[data-fd-theme="light"] .fd-feature-card,
html[data-fd-theme="light"] .fd-theme-choice,
html[data-fd-theme="light"] .fd-tank-summary article,
html[data-fd-theme="light"] .fd-tank-entry {
  border-color: var(--fd-r91-light-border);
  background: var(--fd-r91-light-surface) !important;
  color: var(--fd-r91-light-text);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.96), 0 12px 30px rgba(45, 45, 52, 0.09);
}

html[data-fd-theme="light"] #app :where(
  .glass-card,
  .price-hero,
  .station-card,
  .result-list .station-card,
  .detail-card,
  .detail-price,
  .detail-chart,
  .detail-prices,
  .menu-card,
  .fuel-map,
  .search-field,
  .primary-station-card,
  .route-chooser,
  .search-suggestion-panel,
  .detail-history-status,
  .tab-stepper__controls
) {
  border-color: var(--fd-r91-light-border) !important;
  background: var(--fd-r91-light-surface) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.96), 0 12px 30px rgba(45, 45, 52, 0.09) !important;
}

html[data-fd-theme="light"] .fd-month-picker input,
html[data-fd-theme="light"] .fd-field input,
html[data-fd-theme="light"] .fd-field select,
html[data-fd-theme="light"] .fd-field textarea {
  border-color: rgba(28, 28, 31, 0.14);
  background: #eeeef1;
  color: var(--fd-r91-light-text);
}

html[data-fd-theme="light"] .fd-month-grid article,
html[data-fd-theme="light"] .fd-feature-card__head > span,
html[data-fd-theme="light"] .fd-tank-history__head > span,
html[data-fd-theme="light"] .fd-tank-entry__values > span {
  border-color: rgba(28, 28, 31, 0.1);
  background: rgba(228, 228, 232, 0.72);
}

html[data-fd-theme="light"] .fd-month-grid strong,
html[data-fd-theme="light"] .fd-cloud-actions button,
html[data-fd-theme="light"] .fd-backup-actions button {
  color: var(--fd-r91-light-text);
}

html[data-fd-theme="light"] .fd-month-grid small,
html[data-fd-theme="light"] .fd-cloud-card > p,
html[data-fd-theme="light"] .fd-backup-card > p,
html[data-fd-theme="light"] .fd-cloud-footnote,
html[data-fd-theme="light"] .fd-backup-status {
  color: var(--fd-r91-light-muted);
}

html[data-fd-theme="light"] .fd-auth-button.is-apple {
  border-color: #151517;
  background: #151517;
  color: #fff;
}

html[data-fd-theme="light"] .fd-auth-button.is-google,
html[data-fd-theme="light"] .fd-cloud-actions button,
html[data-fd-theme="light"] .fd-backup-actions button {
  border-color: rgba(28, 28, 31, 0.14);
  background: rgba(235, 235, 239, 0.92);
  box-shadow: none;
}

html[data-fd-theme="light"] .fd-cloud-actions button:first-child {
  border-color: rgba(255, 59, 48, 0.55);
  color: #c52b23;
}

html[data-fd-theme="light"] .fd-backup-actions button > span {
  color: var(--fd-r90-red);
}

html[data-fd-theme="light"] .fd-cloud-message.is-success,
html[data-fd-theme="light"] .fd-cloud-badge.is-success,
html[data-fd-theme="light"] .fd-backup-status[data-type="success"] {
  color: #30d158 !important;
}

html[data-fd-theme="light"] .fd-cloud-message.is-working,
html[data-fd-theme="light"] .fd-cloud-badge.is-working {
  color: #8b650b !important;
}

html[data-fd-theme="light"] .fd-cloud-message.is-error,
html[data-fd-theme="light"] .fd-cloud-badge.is-error,
html[data-fd-theme="light"] .fd-backup-status[data-type="error"] {
  color: #aa211b !important;
}

html[data-fd-theme="light"] #app .fuel-tab-bar {
  background: rgba(255, 255, 255, 0.9) !important;
}

html[data-fd-theme="light"] #app .tab-stepper__controls {
  background: rgba(255, 255, 255, 0.94) !important;
}

@media (max-width: 370px) {
  .fd-backup-actions {
    grid-template-columns: 1fr;
  }

  .fd-cloud-actions {
    grid-template-columns: 1fr;
  }

  .fd-month-picker input {
    width: 108px;
  }
}

/* FuelDash R92 – username/password account UI. */
.fd-auth-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin-top: 15px;
  padding: 4px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.035);
}

.fd-auth-switch button {
  min-height: 38px;
  padding: 0 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #8f8f95;
  font: inherit;
  font-size: 10px;
  font-weight: 720;
}

.fd-auth-switch button.is-active {
  background: var(--fd-r90-red);
  color: #fff;
  box-shadow: 0 7px 18px rgba(255, 59, 48, 0.18);
}

.fd-auth-form {
  display: grid;
  gap: 11px;
  margin-top: 15px;
}

.fd-auth-form > label {
  display: grid;
  gap: 6px;
}

.fd-auth-form > label > span {
  color: #a4a4aa;
  font-size: 9px;
  font-weight: 650;
}

.fd-auth-form > label > small {
  color: #74747b;
  font-size: 8px;
  line-height: 1.4;
}

.fd-auth-form input {
  width: 100%;
  min-height: 44px;
  box-sizing: border-box;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 13px;
  outline: none;
  background: rgba(7, 7, 9, 0.64);
  color: #fff;
  font: inherit;
  font-size: 12px;
}

.fd-auth-form input:focus {
  border-color: rgba(255, 59, 48, 0.72);
  box-shadow: 0 0 0 3px rgba(255, 59, 48, 0.12);
}

.fd-auth-form input[aria-invalid='true'] {
  border-color: rgba(255, 89, 81, 0.9);
}

.fd-auth-form-status {
  min-height: 15px;
  margin: 0;
  color: #85858c;
  font-size: 9px;
  line-height: 1.45;
}

.fd-auth-form-status[data-type='success'] {
  color: #30d158;
}

.fd-auth-form-status[data-type='working'] {
  color: #d8b868;
}

.fd-auth-form-status[data-type='error'] {
  color: #ff7770;
}

.fd-auth-primary {
  min-height: 46px;
  padding: 0 14px;
  border: 1px solid var(--fd-r90-red);
  border-radius: 14px;
  background: var(--fd-r90-red);
  color: #fff;
  font: inherit;
  font-size: 11px;
  font-weight: 760;
  box-shadow: 0 10px 22px rgba(255, 59, 48, 0.18);
}

.fd-auth-link {
  justify-self: center;
  min-height: 32px;
  padding: 4px 8px;
  border: 0;
  background: transparent;
  color: #ff6b62;
  font: inherit;
  font-size: 9px;
  font-weight: 680;
}

.fd-auth-explanation {
  margin: 0;
  color: #96969d;
  font-size: 10px;
  line-height: 1.5;
}

html[data-fd-theme='light'] .fd-auth-switch {
  border-color: rgba(28, 28, 31, 0.12);
  background: rgba(228, 228, 232, 0.76);
}

html[data-fd-theme='light'] .fd-auth-switch button {
  color: #66666d;
}

html[data-fd-theme='light'] .fd-auth-switch button.is-active {
  background: var(--fd-r90-red);
  color: #fff;
}

html[data-fd-theme='light'] .fd-auth-form > label > span {
  color: #4f4f55;
}

html[data-fd-theme='light'] .fd-auth-form > label > small,
html[data-fd-theme='light'] .fd-auth-explanation {
  color: var(--fd-r91-light-muted);
}

html[data-fd-theme='light'] .fd-auth-form input {
  border-color: rgba(28, 28, 31, 0.14);
  background: #eeeef1;
  color: var(--fd-r91-light-text);
}

html[data-fd-theme='light'] .fd-auth-form-status[data-type='success'] {
  color: #30d158;
}

html[data-fd-theme='light'] .fd-auth-form-status[data-type='working'] {
  color: #8b650b;
}

html[data-fd-theme='light'] .fd-auth-form-status[data-type='error'] {
  color: #aa211b;
}

html[data-fd-theme='light'] .fd-auth-link {
  color: #c52b23;
}

/* FuelDash R94: narrowly scoped stabilization layer. No global typography/control overrides. */
:root {
  --fd-r94-light-bg: #f5f5f7;
  --fd-r94-surface: rgba(255,255,255,.94);
  --fd-r94-surface-soft: rgba(255,255,255,.78);
  --fd-r94-border: rgba(28,28,32,.12);
  --fd-r94-border-strong: rgba(28,28,32,.18);
  --fd-r94-text: #151517;
  --fd-r94-muted: #66666d;
  --fd-r94-red: #ff3b30;
}

html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] #app .app-shell,
html[data-fd-theme="light"] #app .app-content,
html[data-fd-theme="light"] #app .detail-view,
html[data-fd-theme="light"] .fd-feature-page {
  background-color: var(--fd-r94-light-bg) !important;
  background-image: none !important;
}

html[data-fd-theme="light"] body::before,
html[data-fd-theme="light"] body::after,
html[data-fd-theme="light"] #app::before,
html[data-fd-theme="light"] #app::after,
html[data-fd-theme="light"] #app .app-shell::before,
html[data-fd-theme="light"] #app .app-shell::after,
html[data-fd-theme="light"] #app .app-content::before,
html[data-fd-theme="light"] #app .app-content::after,
html[data-fd-theme="light"] .fd-feature-page::before,
html[data-fd-theme="light"] .fd-feature-page::after {
  content: none !important;
  display: none !important;
}

/* Preserve component typography; only set copy where a component was explicitly dark-themed. */
html[data-fd-theme="light"] #app .brand-wordmark span,
html[data-fd-theme="light"] #app .screen-title,
html[data-fd-theme="light"] #app .station-name,
html[data-fd-theme="light"] #app .station-copy strong,
html[data-fd-theme="light"] #app .detail-title,
html[data-fd-theme="light"] #app .menu-card button span {
  color: var(--fd-r94-text) !important;
  text-shadow: none !important;
}
html[data-fd-theme="light"] #app .brand-wordmark strong { color: var(--fd-r94-red) !important; }
html[data-fd-theme="light"] #app .screen-lead,
html[data-fd-theme="light"] #app .station-location,
html[data-fd-theme="light"] #app .station-copy small,
html[data-fd-theme="light"] #app .detail-subtitle {
  color: var(--fd-r94-muted) !important;
}

/* Consistent light glass surfaces. */
html[data-fd-theme="light"] #app :where(
  .glass-card,.price-hero,.station-card,.station-result,.dashboard-favorite-card,
  .favorites-screen-card,.menu-card,.fuel-preference,.nearby-radius,.detail-card,
  .detail-price-card,.route-options,.search-suggestion-panel,.primary-station-card,
  .recommendation-card,.history-card,.chart-block
) {
  background: var(--fd-r94-surface) !important;
  background-image: none !important;
  border-color: var(--fd-r94-border) !important;
  box-shadow: 0 10px 28px rgba(18,18,22,.055), inset 0 1px rgba(255,255,255,.9) !important;
}

/* Search/results: no text shimmer, no dark outline. */
html[data-fd-theme="light"] #app .search-field,
html[data-fd-theme="light"] #app .result-list :where(.station-card,.station-result) {
  background: var(--fd-r94-surface) !important;
  background-image: none !important;
  border: 1px solid var(--fd-r94-border) !important;
  box-shadow: 0 8px 24px rgba(18,18,22,.05) !important;
}
html[data-fd-theme="light"] #app .search-field input {
  background: transparent !important;
  box-shadow: none !important;
  color: var(--fd-r94-text) !important;
}
html[data-fd-theme="light"] #app .station-detail-link {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
  border: 0 !important;
}

/* Closed-station row stays transparent; only checkbox is colored. */
html[data-fd-theme="light"] #app .search-availability-filter,
html[data-fd-theme="light"] #app .search-availability-filter button,
html[data-fd-theme="light"] #app .closed-stations-filter,
html[data-fd-theme="light"] #app .closed-stations-filter label {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] #app .search-availability-filter button {
  color: var(--fd-r94-text) !important;
  border: 0 !important;
}

/* Active segmented controls. Scope each component; never style every .is-active button. */
html[data-fd-theme="light"] #app :where(
 .fuel-preference,.nearby-radius,.fuel-filter,.station-sort,.chart-range,.favorites-filter,.favorite-filter
) button {
  background: rgba(255,255,255,.82) !important;
  color: #4f4f56 !important;
  border: 1px solid var(--fd-r94-border-strong) !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] #app :where(
 .fuel-preference,.nearby-radius,.fuel-filter,.station-sort,.chart-range,.favorites-filter,.favorite-filter
) button:is(.is-active,[aria-pressed="true"],[aria-selected="true"]) {
  background: var(--fd-r94-red) !important;
  color: #fff !important;
  border-color: var(--fd-r94-red) !important;
}

/* Readable map markers. */
#app .map-price-marker,
#app .map-price-marker * {
  color: #fff !important;
  text-shadow: none !important;
}
#app .map-price-marker {
  background: rgba(78,20,20,.96) !important;
  border-color: rgba(255,116,108,.95) !important;
  box-shadow: 0 5px 14px rgba(0,0,0,.38) !important;
}
#app .map-price-marker.is-selected { background: var(--fd-r94-red) !important; }

/* Remove the translucent box around the nav step indicator only. */
#app :where(.tab-stepper,.tab-stepper__toggle) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
#app .tab-stepper__toggle span { background: var(--fd-r94-red) !important; box-shadow: none !important; }

/* Feature pages and tankbook: vertical-only, compact controls, no oversized buttons. */
.fd-feature-page,
.fd-feature-shell,
.fd-feature-content,
.fd-tankbook-layout,
.fd-tank-form,
.fd-tank-history,
.fd-tank-entry-list {
  max-width: 100%;
  overflow-x: hidden !important;
}
.fd-feature-page { overscroll-behavior-x: none; }
.fd-feature-content { box-sizing: border-box; }
.fd-tankbook-layout { display: flex !important; flex-direction: column !important; gap: 14px !important; }
.fd-tankbook-layout [data-fd-tank-form] { order: -20; }
.fd-tankbook-layout [data-fd-month-summary] { order: -10; }
.fd-tankbook-layout .fd-tank-summary { order: 0; }
.fd-tankbook-layout .fd-tank-history { order: 10; }

.fd-feature-page button,
.fd-account-sheet button {
  min-height: 0;
  max-width: 100%;
}
.fd-tank-form button[type="submit"],
.fd-auth-primary,
.fd-account-card > button,
.fd-backup-actions button {
  width: 100%;
  min-height: 44px !important;
  padding: 11px 14px !important;
  border-radius: 14px !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}
.fd-backup-actions {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 9px !important;
}
.fd-backup-actions button:last-child:nth-child(odd) { grid-column: 1 / -1; }
.fd-field input,.fd-field select,.fd-field textarea,.fd-auth-form input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
html[data-fd-theme="light"] .fd-feature-page :where(.fd-feature-card,.fd-tank-summary article,.fd-month-grid article,.fd-tank-entry,.fd-tank-history,.fd-theme-choice,.fd-account-card) {
  background: var(--fd-r94-surface) !important;
  background-image: none !important;
  border-color: var(--fd-r94-border) !important;
  box-shadow: 0 9px 26px rgba(18,18,22,.055), inset 0 1px rgba(255,255,255,.9) !important;
}
html[data-fd-theme="light"] .fd-feature-page :where(.fd-field input,.fd-field select,.fd-field textarea,.fd-auth-form input) {
  color: var(--fd-r94-text) !important;
  background: rgba(255,255,255,.88) !important;
  background-image: none !important;
  border-color: var(--fd-r94-border-strong) !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] .fd-feature-page :where(.fd-feature-heading h1,.fd-feature-card h2,.fd-theme-choice strong,.fd-tank-entry strong,.fd-tank-summary strong,.fd-month-grid strong) {
  color: var(--fd-r94-text) !important;
}
html[data-fd-theme="light"] .fd-feature-page :where(.fd-feature-heading p,.fd-feature-card p,.fd-theme-choice small,.fd-tank-entry p,.fd-tank-entry small,.fd-tank-summary small,.fd-month-grid small) {
  color: var(--fd-r94-muted) !important;
}

@media (max-width: 390px) {
  .fd-backup-actions { grid-template-columns: 1fr !important; }
  .fd-backup-actions button { grid-column: auto !important; }
}

/* ===== assets/r96-component-polish.css ===== */
/* FuelDash R96 — final component-scoped continuity layer. */
:root {
  --fd-r96-dark-bg: #050505;
  --fd-r96-light-bg: #f5f5f7;
  --fd-r96-light-card: rgba(255, 255, 255, 0.96);
  --fd-r96-light-control: #f0f0f3;
  --fd-r96-light-control-hover: #e9e9ed;
  --fd-r96-light-border: #d3d3d9;
  --fd-r96-light-text: #151517;
  --fd-r96-light-muted: #66666d;
  --fd-r96-red: #ff3b30;
  --fd-r96-card-radius: 24px;
  --fd-r96-control-radius: 16px;
  --fd-r96-surface-gap: 16px;
}

html,
body,
#app,
.app-shell {
  min-height: 100%;
  background-color: var(--fd-page-bg, var(--fd-r96-dark-bg)) !important;
}

html[data-fd-theme="dark"],
html[data-fd-theme="dark"] body,
html[data-fd-theme="dark"] #app,
html[data-fd-theme="dark"] .app-shell,
html[data-fd-theme="dark"] .fd-feature-page,
html[data-fd-theme="dark"] .fd-feature-shell,
html[data-fd-theme="dark"] .fd-feature-content {
  background-color: var(--fd-r96-dark-bg) !important;
}

html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] .app-shell,
html[data-fd-theme="light"] .app-content,
html[data-fd-theme="light"] .detail-view,
html[data-fd-theme="light"] .fd-feature-page,
html[data-fd-theme="light"] .fd-feature-shell,
html[data-fd-theme="light"] .fd-feature-content {
  background-color: var(--fd-r96-light-bg) !important;
  background-image: none !important;
}

/* Extend the feature background beyond the visual viewport edges. */
.fd-feature-page {
  inset: -1px 0 !important;
  min-height: calc(100dvh + 2px);
  overscroll-behavior: none;
}
.fd-feature-page::before,
.fd-feature-page::after {
  position: fixed;
  z-index: -1;
  left: 0;
  right: 0;
  height: 120px;
  content: "";
  background: inherit;
  pointer-events: none;
}
.fd-feature-page::before { top: -120px; }
.fd-feature-page::after { bottom: -120px; }

.fd-feature-header {
  background: var(--fd-page-bg, var(--fd-r96-dark-bg)) !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] .fd-feature-header {
  border-bottom: 1px solid rgba(28, 28, 32, 0.08) !important;
}

/* True visually-hidden utility; prevents the month label from widening the layout. */
.fd-feature-page .sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Detail view: one visual control family, based on the accepted route button. */
html[data-fd-theme="light"] #app .detail-view :where(
  .primary-station-action,
  .station-route .route-trigger
) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 52px !important;
  padding: 11px 16px !important;
  border: 1px solid var(--fd-r96-light-border) !important;
  border-radius: 18px !important;
  background: var(--fd-r96-light-control) !important;
  background-image: none !important;
  color: #4f4f56 !important;
  box-shadow: none !important;
  filter: none !important;
}
html[data-fd-theme="light"] #app .detail-view .primary-station-action {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-align: left !important;
}
html[data-fd-theme="light"] #app .detail-view .primary-station-action :where(strong, small) {
  color: #4f4f56 !important;
  text-shadow: none !important;
}
html[data-fd-theme="light"] #app .detail-view .station-route .route-trigger {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 680 !important;
}
html[data-fd-theme="light"] #app .detail-view :where(.station-route, .route-chooser) {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] #app .detail-view .station-route {
  margin-top: 12px !important;
}
html[data-fd-theme="light"] #app .detail-view :where(.detail-favorite, .detail-header .round-button) {
  border: 1px solid var(--fd-r96-light-border) !important;
  background: var(--fd-r96-light-control) !important;
  background-image: none !important;
  color: #55555c !important;
  box-shadow: none !important;
}

/* Convert the dark tile source into a genuinely light neutral map only in detail view. */
html[data-fd-theme="light"] #app .detail-view .station-mini-map .leaflet-container {
  background: #ececef !important;
}
html[data-fd-theme="light"] #app .detail-view .station-mini-map .leaflet-tile-pane {
  filter: invert(0.92) grayscale(1) saturate(0.12) brightness(1.14) contrast(0.78) !important;
}
html[data-fd-theme="light"] #app .detail-view .station-mini-map :where(.leaflet-control-attribution, .leaflet-control-attribution a) {
  color: #55555d !important;
  background: rgba(255, 255, 255, 0.78) !important;
}

/* Tankbook: one vertical rhythm and no horizontal overflow. */
.fd-feature-page[data-fd-feature-view="tankbook"],
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-shell,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content {
  max-width: 100% !important;
  overflow-x: hidden !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--fd-r96-surface-gap) !important;
  box-sizing: border-box !important;
  padding: 16px 20px calc(34px + env(safe-area-inset-bottom)) !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content > * {
  flex: 0 0 auto;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

.fd-feature-page[data-fd-feature-view="tankbook"] :where(
  .fd-feature-card,
  .fd-tank-history
) {
  overflow: hidden !important;
  border-radius: var(--fd-r96-card-radius) !important;
  padding: 18px !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] :where(
  .fd-feature-card,
  .fd-tank-history,
  .fd-tank-summary article,
  .fd-month-grid article,
  .fd-tank-entry
) {
  border: 1px solid var(--fd-r96-light-border) !important;
  background: var(--fd-r96-light-card) !important;
  background-image: none !important;
  box-shadow: 0 8px 24px rgba(20, 20, 24, 0.055) !important;
}

.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-summary {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-summary article {
  min-width: 0 !important;
  min-height: 96px !important;
  padding: 16px !important;
  border-radius: 20px !important;
}

.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px 12px !important;
  margin-top: 16px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] :where(.fd-field, .fd-field-affix, .fd-tank-extras, .fd-tank-extras > div) {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras {
  grid-column: 1 / -1 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px 12px !important;
  padding-top: 14px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras .fd-field:last-child {
  grid-column: 1 / -1 !important;
}

.fd-feature-page[data-fd-feature-view="tankbook"] :where(
  .fd-field input,
  .fd-field select,
  .fd-field textarea,
  .fd-month-picker input,
  .fd-auth-form input
) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  border-radius: var(--fd-r96-control-radius) !important;
  box-shadow: none !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] :where(.fd-field input, .fd-field select, .fd-month-picker input, .fd-auth-form input) {
  min-height: 48px !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] :where(
  .fd-field input,
  .fd-field select,
  .fd-field textarea,
  .fd-month-picker input,
  .fd-auth-form input
) {
  border: 1px solid var(--fd-r96-light-border) !important;
  background: #f6f6f8 !important;
  background-image: none !important;
  color: var(--fd-r96-light-text) !important;
}

.fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  gap: 12px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-picker {
  display: block !important;
  min-width: 0 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-picker input {
  width: 132px !important;
  padding: 0 10px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-grid {
  gap: 10px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-grid article {
  border-radius: 16px !important;
}

.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-history__head {
  padding: 0 0 14px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-empty {
  box-sizing: border-box !important;
  width: 100% !important;
  border-radius: 18px !important;
}

.fd-feature-page[data-fd-feature-view="tankbook"] :where(
  .fd-tank-submit,
  .fd-auth-primary,
  .fd-auth-secondary,
  .fd-backup-actions button,
  .fd-account-card > button
) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 48px !important;
  padding: 12px 14px !important;
  border-radius: var(--fd-r96-control-radius) !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}

.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 16px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions button {
  grid-column: auto !important;
  min-width: 0 !important;
  min-height: 64px !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] :where(
  .fd-backup-actions button,
  .fd-account-card > button,
  .fd-auth-secondary
) {
  border: 1px solid var(--fd-r96-light-border) !important;
  background: var(--fd-r96-light-control) !important;
  background-image: none !important;
  color: var(--fd-r96-light-text) !important;
  box-shadow: none !important;
}

.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card > button {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 16px !important;
  text-align: left !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card > button > span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card > button > strong {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 26px !important;
  padding: 0 9px !important;
  border-radius: 999px !important;
  background: rgba(127, 127, 135, 0.1) !important;
  color: var(--fd-r96-light-muted) !important;
  font-size: 11px !important;
  white-space: nowrap !important;
}

@media (max-width: 370px) {
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content {
    padding-right: 15px !important;
    padding-left: 15px !important;
  }
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form,
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div,
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
    grid-template-columns: 1fr !important;
  }
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-picker input {
    width: 100% !important;
  }
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions {
    grid-template-columns: 1fr !important;
  }
}

/* ===== assets/r97-component-polish.css ===== */
/* FuelDash R97 — final scoped Lightmode polish. Darkmode remains untouched. */
:root {
  --fd-r97-page-bg: #f5f5f7;
  --fd-r97-surface: #ffffff;
  --fd-r97-control: #f0f0f3;
  --fd-r97-control-border: #d4d4da;
  --fd-r97-divider: #d8d8dd;
  --fd-r97-text: #171719;
  --fd-r97-muted: #74747b;
  --fd-r97-red: #ff3b30;
}

/* One uninterrupted page surface, including overscroll and the area behind navigation. */
html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] #app .app-shell,
html[data-fd-theme="light"] #app .app-content,
html[data-fd-theme="light"] #app .detail-view,
html[data-fd-theme="light"] .fd-feature-page,
html[data-fd-theme="light"] .fd-feature-shell,
html[data-fd-theme="light"] .fd-feature-content {
  background-color: var(--fd-r97-page-bg) !important;
  background-image: none !important;
}

html[data-fd-theme="light"] body,
html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] #app .app-shell {
  min-height: 100dvh !important;
}

html[data-fd-theme="light"] body::before,
html[data-fd-theme="light"] body::after,
html[data-fd-theme="light"] #app::before,
html[data-fd-theme="light"] #app::after,
html[data-fd-theme="light"] #app .app-shell::before,
html[data-fd-theme="light"] #app .app-shell::after,
html[data-fd-theme="light"] #app .app-content::before,
html[data-fd-theme="light"] #app .app-content::after,
html[data-fd-theme="light"] #app .fuel-tab-bar::before,
html[data-fd-theme="light"] #app .fuel-tab-bar::after {
  content: none !important;
  display: none !important;
}

/* Safari's fixed glass navigation must not create a rectangular haze behind itself. */
html[data-fd-theme="light"] #app .fuel-tab-bar {
  border-color: var(--fd-r97-control-border) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

/* One secondary-control family. Route is intentionally flatter than R96. */
html[data-fd-theme="light"] #app :where(
  .detail-view .primary-station-action,
  .detail-view .station-route .route-trigger,
  .detail-view .refresh-pill,
  .detail-view .map-location-button,
  .detail-view .round-button
) {
  box-sizing: border-box !important;
  min-height: 44px !important;
  padding: 9px 14px !important;
  border: 1px solid var(--fd-r97-control-border) !important;
  border-radius: 16px !important;
  background: var(--fd-r97-control) !important;
  background-image: none !important;
  color: #505057 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  filter: none !important;
}

html[data-fd-theme="light"] #app .detail-view .primary-station-action {
  width: 100% !important;
}

html[data-fd-theme="light"] #app .detail-view .primary-station-action :where(strong, small) {
  color: #505057 !important;
  text-shadow: none !important;
}

html[data-fd-theme="light"] #app .detail-view .station-route {
  margin-top: 10px !important;
}

html[data-fd-theme="light"] #app .detail-view :where(.station-route, .route-chooser) {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* All inactive segmented controls use the same neutral fill; selected stays red. */
html[data-fd-theme="light"] #app :where(
  .fuel-preference,
  .nearby-radius,
  .fuel-filter,
  .station-sort,
  .favorites-filter,
  .favorite-filter,
  .chart-range
) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="light"] #app .chart-range {
  gap: 4px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
}

html[data-fd-theme="light"] #app :where(
  .fuel-preference,
  .nearby-radius,
  .fuel-filter,
  .station-sort,
  .favorites-filter,
  .favorite-filter,
  .chart-range
) button {
  border: 1px solid var(--fd-r97-control-border) !important;
  background: var(--fd-r97-control) !important;
  background-image: none !important;
  color: #505057 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  filter: none !important;
}

html[data-fd-theme="light"] #app :where(
  .fuel-preference,
  .nearby-radius,
  .fuel-filter,
  .station-sort,
  .favorites-filter,
  .favorite-filter,
  .chart-range
) button:is(.is-active, [aria-pressed="true"], [aria-selected="true"]) {
  border-color: var(--fd-r97-red) !important;
  background: var(--fd-r97-red) !important;
  color: #fff !important;
  box-shadow: none !important;
}

/* Recommendation facts and chart readout are calm information surfaces, not floating buttons. */
html[data-fd-theme="light"] #app .primary-station-card__facts > span,
html[data-fd-theme="light"] #app .chart-selection-readout {
  border: 1px solid var(--fd-r97-control-border) !important;
  background: var(--fd-r97-control) !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  filter: none !important;
}

html[data-fd-theme="light"] #app .primary-station-card__facts > span :where(small, b) {
  text-shadow: none !important;
}

html[data-fd-theme="light"] #app .primary-station-card__facts > span small {
  color: var(--fd-r97-muted) !important;
}

html[data-fd-theme="light"] #app .primary-station-card__facts > span b {
  color: var(--fd-r97-text) !important;
}

html[data-fd-theme="light"] #app .detail-advice-card,
html[data-fd-theme="light"] #app .detail-chart {
  box-shadow: none !important;
}

/* Search and detail maps share the same genuinely light neutral tile treatment. */
html[data-fd-theme="light"] #app :where(
  [data-search-map] .fuel-map,
  .station-mini-map .fuel-map,
  .detail-map .fuel-map
) .leaflet-container {
  background: #ececef !important;
}

html[data-fd-theme="light"] #app :where(
  [data-search-map] .fuel-map,
  .station-mini-map .fuel-map,
  .detail-map .fuel-map
) .leaflet-tile-pane {
  filter: invert(0.92) grayscale(1) saturate(0.12) brightness(1.14) contrast(0.78) !important;
}

html[data-fd-theme="light"] #app [data-search-map] .fuel-map {
  border-color: var(--fd-r97-control-border) !important;
  background: #ececef !important;
  box-shadow: none !important;
}

/* Opening hours are plain copy, never a gray plate over the status. */
html[data-fd-theme="light"] #app .station-opening-hours,
html[data-fd-theme="light"] #app .station-opening-hours > span {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  filter: none !important;
}

html[data-fd-theme="light"] #app .station-opening-hours :where(b, em) {
  color: #626269 !important;
  text-shadow: none !important;
}

/* Price divider and both timestamps use one quiet hierarchy. */
html[data-fd-theme="light"] #app .detail-freshness {
  border-top: 1px solid var(--fd-r97-divider) !important;
}

html[data-fd-theme="light"] #app .freshness-copy,
html[data-fd-theme="light"] #app .freshness-copy span,
html[data-fd-theme="light"] #app .freshness-copy [data-valid-since],
html[data-fd-theme="light"] #app .freshness-copy [data-fetched-at] {
  color: var(--fd-r97-muted) !important;
  text-shadow: none !important;
}

/* Dashboard hero: retain the map, remove the heavy dark/glass veil. */
html[data-fd-theme="light"] #app .hero-card-wrap {
  border-color: var(--fd-r97-control-border) !important;
  background: #ececef !important;
  box-shadow: 0 4px 14px rgba(30, 30, 36, 0.05) !important;
}

html[data-fd-theme="light"] #app .hero-map-layer {
  opacity: 0.9 !important;
  filter: none !important;
}

html[data-fd-theme="light"] #app .hero-map-layer::after {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
}

html[data-fd-theme="light"] #app .hero-map-layer .fuel-map {
  border: 0 !important;
  background: #ececef !important;
  box-shadow: none !important;
}

html[data-fd-theme="light"] #app .hero-map-layer .leaflet-tile-pane {
  filter: invert(0.92) grayscale(1) saturate(0.12) brightness(1.14) contrast(0.78) !important;
}

html[data-fd-theme="light"] #app .price-hero {
  border-color: rgba(28, 28, 32, 0.1) !important;
  background: rgba(255, 255, 255, 0.28) !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

/* Match the legacy detail specificity so the compact height wins the important cascade. */
html[data-fd-theme="light"] #app .detail-view .primary-station-action,
html[data-fd-theme="light"] #app .detail-view .station-route .route-trigger {
  min-height: 44px !important;
}

/* Equalize search and detail tile treatment at the same specificity as R96. */
html[data-fd-theme="light"] #app [data-search-map] .fuel-map .leaflet-tile-pane,
html[data-fd-theme="light"] #app .detail-view .station-mini-map .leaflet-tile-pane,
html[data-fd-theme="light"] #app .detail-view .detail-map .leaflet-tile-pane {
  filter: invert(0.92) grayscale(1) saturate(0.12) brightness(1.14) contrast(0.78) !important;
}

/* ===== assets/r98-component-consistency.css ===== */
/* FuelDash R98 — scoped consistency layer loaded after R97. */
:root {
  --fd-r98-page: #f5f5f7;
  --fd-r98-map: #ececef;
  --fd-r98-surface: #ffffff;
  --fd-r98-control: #f1f1f4;
  --fd-r98-control-soft: #f7f7f9;
  --fd-r98-border: #d4d4da;
  --fd-r98-text: #171719;
  --fd-r98-muted: #74747b;
  --fd-r98-red: #ff3b30;
}

/* Exact light PWA/page surface. System chrome receives the same theme color from R98 JS. */
html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] #app .app-shell,
html[data-fd-theme="light"] #app .app-content {
  background-color: var(--fd-r98-page) !important;
  background-image: none !important;
}
html[data-fd-theme="light"] #app .brand-header {
  background: var(--fd-r98-page) !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Dashboard best-price map now matches the light detail map instead of a dark glass hero. */
html[data-fd-theme="light"] #app .fd-best {
  border-color: var(--fd-r98-border) !important;
  background: var(--fd-r98-map) !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: 0 5px 16px rgba(24, 24, 28, .055) !important;
}
html[data-fd-theme="light"] #app .fd-best__map {
  background: var(--fd-r98-map) !important;
  opacity: 1 !important;
  filter: none !important;
}
html[data-fd-theme="light"] #app .fd-best__map .leaflet-container {
  background: var(--fd-r98-map) !important;
}
html[data-fd-theme="light"] #app .fd-best__map .leaflet-tile-pane,
html[data-fd-theme="light"] #app .detail-map .leaflet-tile-pane,
html[data-fd-theme="light"] #app .station-mini-map .leaflet-tile-pane {
  filter: invert(.92) grayscale(1) saturate(.12) brightness(1.14) contrast(.78) !important;
}
html[data-fd-theme="light"] #app .fd-best::after {
  display: block !important;
  content: "" !important;
  background: linear-gradient(90deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.52) 52%, rgba(255,255,255,.10) 100%) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-fd-theme="light"] #app .fd-best__label,
html[data-fd-theme="light"] #app .fd-best__station {
  color: var(--fd-r98-text) !important;
  text-shadow: none !important;
}
html[data-fd-theme="light"] #app .fd-best__meta,
html[data-fd-theme="light"] #app .fd-best__trend,
html[data-fd-theme="light"] #app .fd-best__trend i,
html[data-fd-theme="light"] #app .fd-best__chevron {
  color: var(--fd-r98-muted) !important;
  text-shadow: none !important;
}

/* Search sorting: light parent surface and consistent button family. */
html[data-fd-theme="light"] #app .station-sort {
  padding: 4px !important;
  border: 1px solid var(--fd-r98-border) !important;
  border-radius: 18px !important;
  background: var(--fd-r98-control-soft) !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] #app .station-sort button {
  min-height: 42px !important;
  border: 1px solid var(--fd-r98-border) !important;
  border-radius: 14px !important;
  background: var(--fd-r98-surface) !important;
  color: #4f4f56 !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] #app .station-sort button:is(.is-active,[aria-pressed="true"],[aria-selected="true"]) {
  border-color: var(--fd-r98-red) !important;
  background: var(--fd-r98-red) !important;
  color: #fff !important;
}

/* More-menu values use the same thin hierarchy as “Aktiv”. */
#app .menu-card button em {
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}
#app .menu-card button.about-build em { font-weight: 400 !important; }

/* Appearance and Tankbook: header is outside the scroll container. */
.fd-feature-page {
  overflow: hidden !important;
}
.fd-feature-shell {
  display: flex !important;
  flex-direction: column !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
.fd-feature-header {
  position: relative !important;
  top: auto !important;
  flex: 0 0 auto !important;
  z-index: 20 !important;
}
.fd-feature-content {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
}
html[data-fd-theme="light"] .fd-feature-header {
  background: var(--fd-r98-page) !important;
  border-bottom: 1px solid rgba(28,28,32,.08) !important;
  box-shadow: none !important;
}

/* Price alerts keep a physically fixed header and receive the light surface language. */
.fd-alert-head { position: fixed !important; }
html[data-fd-theme="light"] .fd-alert-modal {
  background: var(--fd-r98-page) !important;
  color: var(--fd-r98-text) !important;
}
html[data-fd-theme="light"] .fd-alert-head {
  background: var(--fd-r98-page) !important;
  border-bottom-color: rgba(28,28,32,.08) !important;
  color: var(--fd-r98-text) !important;
}
html[data-fd-theme="light"] .fd-alert-close,
html[data-fd-theme="light"] .fd-alert-row,
html[data-fd-theme="light"] .fd-alert-station,
html[data-fd-theme="light"] .fd-alert-empty,
html[data-fd-theme="light"] .fd-alert-status {
  border-color: var(--fd-r98-border) !important;
  background: var(--fd-r98-surface) !important;
  color: var(--fd-r98-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] .fd-alert-row :where(small),
html[data-fd-theme="light"] .fd-alert-station small,
html[data-fd-theme="light"] .fd-alert-note { color: var(--fd-r98-muted) !important; }
html[data-fd-theme="light"] .fd-alert-row :where(select,input[type="time"],input[type="number"]) {
  border-color: var(--fd-r98-border) !important;
  background: var(--fd-r98-control-soft) !important;
  color: var(--fd-r98-text) !important;
}

/* Tankbook cloud card and account dialog. */
.fd-account-card {
  display: grid !important;
  gap: 16px !important;
  border-radius: 24px !important;
  padding: 20px !important;
}
.fd-account-card__copy { min-width: 0; }
.fd-account-card__eyebrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.fd-account-card__eyebrow > small {
  color: var(--fd-r98-red) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .16em !important;
}
.fd-account-card__eyebrow > span {
  flex: 0 0 auto;
  color: var(--fd-r98-muted);
  font-size: 10px;
  font-weight: 400;
}
.fd-account-card h2 { margin: 7px 0 0 !important; }
.fd-account-card p { margin: 10px 0 0 !important; line-height: 1.5 !important; }
.fd-account-card > button,
.fd-account-card__action {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 48px !important;
  padding: 11px 14px !important;
  border: 1px solid var(--fd-r98-border) !important;
  border-radius: 16px !important;
  background: var(--fd-r98-control) !important;
  background-image: none !important;
  color: #4f4f56 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}
.fd-account-card__action svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
html[data-fd-theme="light"] .fd-account-card {
  border: 1px solid var(--fd-r98-border) !important;
  background: var(--fd-r98-surface) !important;
  box-shadow: 0 5px 16px rgba(24,24,28,.05) !important;
}

body.fd-account-open { overflow: hidden !important; }
.fd-account-sheet {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483200 !important;
  display: grid !important;
  align-items: end !important;
  justify-items: center !important;
  padding: max(8px, env(safe-area-inset-top)) 8px max(8px, env(safe-area-inset-bottom)) !important;
  box-sizing: border-box !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .16s ease, visibility .16s ease;
}
.fd-account-sheet.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto !important;
}
.fd-account-sheet__backdrop {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(0,0,0,.42) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
}
.fd-account-sheet__panel {
  position: relative !important;
  z-index: 1 !important;
  width: min(calc(100vw - 16px), 560px) !important;
  max-width: calc(100vw - 16px) !important;
  max-height: calc(100dvh - max(16px, env(safe-area-inset-top)) - max(16px, env(safe-area-inset-bottom))) !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 20px !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 26px !important;
  background: #111114 !important;
  color: #fff !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.48) !important;
  transform: translateY(18px);
  transition: transform .18s cubic-bezier(.22,.72,.25,1);
}
.fd-account-sheet.is-visible .fd-account-sheet__panel { transform: translateY(0); }
.fd-account-sheet__panel > header {
  position: sticky;
  top: -20px;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin: -20px -20px 0;
  padding: 20px 20px 14px;
  background: #111114;
}
.fd-account-sheet__panel > header small {
  color: var(--fd-r98-red);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .16em;
}
.fd-account-sheet__panel > header h2 { margin: 5px 0 0; font-size: 24px; }
.fd-account-sheet__panel > header > button {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
  background: #242428;
  color: #fff;
  font-size: 24px;
}
.fd-auth-form { max-width: 100%; }
.fd-auth-form input { max-width: 100%; }
.fd-auth-secondary {
  width: 100%;
  min-height: 44px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  background: #242428;
  color: #fff;
}

.fd-account-sheet__panel .fd-auth-switch button {
  min-height: 40px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
.fd-account-sheet__panel .fd-auth-form > label > span {
  font-size: 12px !important;
  font-weight: 600 !important;
}
.fd-account-sheet__panel .fd-auth-form > label > small,
.fd-account-sheet__panel .fd-auth-explanation {
  font-size: 11px !important;
}
.fd-account-sheet__panel .fd-auth-form input {
  min-height: 48px !important;
  font-size: 15px !important;
  border-radius: 15px !important;
}
.fd-account-sheet__panel .fd-auth-primary,
.fd-account-sheet__panel .fd-auth-secondary {
  min-height: 48px !important;
  font-size: 14px !important;
  font-weight: 650 !important;
}

html[data-fd-theme="light"] .fd-account-sheet__panel,
html[data-fd-theme="light"] .fd-account-sheet__panel > header {
  border-color: var(--fd-r98-border) !important;
  background: var(--fd-r98-surface) !important;
  color: var(--fd-r98-text) !important;
}
html[data-fd-theme="light"] .fd-account-sheet__panel { box-shadow: 0 24px 60px rgba(24,24,28,.20) !important; }
html[data-fd-theme="light"] .fd-account-sheet__panel > header > button,
html[data-fd-theme="light"] .fd-auth-secondary {
  border-color: var(--fd-r98-border) !important;
  background: var(--fd-r98-control) !important;
  color: #4f4f56 !important;
}
html[data-fd-theme="light"] .fd-auth-switch {
  border-color: var(--fd-r98-border) !important;
  background: var(--fd-r98-control-soft) !important;
}
html[data-fd-theme="light"] .fd-auth-form input {
  border-color: var(--fd-r98-border) !important;
  background: var(--fd-r98-control-soft) !important;
  color: var(--fd-r98-text) !important;
}

@media (max-width: 360px) {
  .fd-account-sheet__panel { padding: 16px !important; border-radius: 22px !important; }
  .fd-account-sheet__panel > header { top: -16px; margin: -16px -16px 0; padding: 16px 16px 12px; }
}

/* ===== assets/r100-balanced-ui.css ===== */
/* FuelDash R100 — R98 visual baseline with isolated functional repairs. */
:root {
  --fd-r100-red: #ff3b30;
  --fd-r100-light-page: #f5f5f7;
  --fd-r100-light-surface: #ffffff;
  --fd-r100-light-control: #f0f0f3;
  --fd-r100-light-border: #d4d4da;
  --fd-r100-light-text: #171719;
  --fd-r100-light-muted: #74747b;
  --fd-r100-dark-page: #050505;
  --fd-r100-dark-surface: rgba(20,20,22,.94);
  --fd-r100-dark-control: rgba(255,255,255,.075);
  --fd-r100-dark-border: rgba(255,255,255,.11);
  --fd-r100-dark-text: #f7f7f8;
  --fd-r100-dark-muted: #99999f;
}

/* Preserve the uninterrupted R98 page background and remove generated veils only. */
html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] #app .app-shell,
html[data-fd-theme="light"] #app .app-content,
html[data-fd-theme="light"] #app .detail-view,
html[data-fd-theme="light"] .fd-feature-page,
html[data-fd-theme="light"] .fd-feature-shell,
html[data-fd-theme="light"] .fd-feature-content {
  background-color: var(--fd-r100-light-page) !important;
  background-image: none !important;
}
html[data-fd-theme="light"] :where(body,#app,.app-shell,.app-content,.fd-feature-page)::before,
html[data-fd-theme="light"] :where(body,#app,.app-shell,.app-content,.fd-feature-page)::after,
html[data-fd-theme="light"] #app .fuel-tab-bar::before,
html[data-fd-theme="light"] #app .fuel-tab-bar::after {
  content: none !important;
  display: none !important;
}

/* R98 dashboard map, tempered slightly so it is readable but not washed out. */
html[data-fd-theme="light"] #app .fd-best {
  border-color: var(--fd-r100-light-border) !important;
  background: #e9e9ed !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] #app .fd-best__map {
  background: #e9e9ed !important;
  opacity: 1 !important;
  filter: none !important;
}
html[data-fd-theme="light"] #app .fd-best__map .leaflet-container { background: #e9e9ed !important; }
html[data-fd-theme="light"] #app .fd-best__map .leaflet-tile-pane {
  filter: invert(.88) grayscale(1) saturate(.16) brightness(1.04) contrast(.86) !important;
}
html[data-fd-theme="light"] #app .fd-best::after {
  display: block !important;
  content: "" !important;
  background: linear-gradient(90deg,rgba(255,255,255,.58) 0%,rgba(255,255,255,.34) 54%,rgba(255,255,255,.06) 100%) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Remove button/fact glows without flattening the R98 cards themselves. */
#app :where(
  .primary-station-card__facts > span,
  .chart-selection-readout,
  .chart-range button,
  .station-sort button,
  .fuel-preference button,
  .nearby-radius button,
  .fuel-filter button,
  .favorites-filter button,
  .favorite-filter button,
  .detail-view .primary-station-action,
  .detail-view .station-route .route-trigger,
  .refresh-pill
),
.fd-feature-page :where(
  .fd-tank-submit,
  .fd-backup-actions button,
  .fd-account-card > button,
  .fd-auth-primary,
  .fd-auth-secondary
) {
  box-shadow: none !important;
  filter: none !important;
}

/* One back/close control family, matching the original circular R89 control. */
#app .brand-header .round-button.detail-close,
.fd-feature-back,
.fd-alert-close,
.fd-account-sheet__panel > header > button {
  box-sizing: border-box !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 48px !important;
  width: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
#app .brand-header .round-button.detail-close svg,
.fd-feature-back svg {
  width: 22px !important;
  height: 22px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
html[data-fd-theme="light"] #app .brand-header .round-button.detail-close,
html[data-fd-theme="light"] .fd-feature-back,
html[data-fd-theme="light"] .fd-alert-close,
html[data-fd-theme="light"] .fd-account-sheet__panel > header > button {
  border: 1px solid var(--fd-r100-light-border) !important;
  background: var(--fd-r100-light-control) !important;
  color: #505057 !important;
}
html[data-fd-theme="dark"] #app .brand-header .round-button.detail-close,
html[data-fd-theme="dark"] .fd-feature-back,
html[data-fd-theme="dark"] .fd-alert-close,
html[data-fd-theme="dark"] .fd-account-sheet__panel > header > button {
  border: 1px solid var(--fd-r100-dark-border) !important;
  background: var(--fd-r100-dark-control) !important;
  color: var(--fd-r100-dark-text) !important;
}

/* Tankbook: no phantom row or oversized gap after “Weitere Angaben”. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form {
  gap: 12px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras {
  grid-column: 1 / -1 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary {
  display: flex !important;
  align-items: center !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0 2px !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
  cursor: pointer !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 12px !important;
  padding-top: 12px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras .fd-field:last-child { grid-column: 1 / -1 !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-form-status:empty { display: none !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-form-status:not(:empty) {
  grid-column: 1 / -1 !important;
  min-height: 0 !important;
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-submit { margin: 0 !important; }

/* Price alerts: neutral when unselected, red only after an explicit check. */
.fd-alert-modal input[type="checkbox"] {
  box-sizing: border-box !important;
  flex: 0 0 23px !important;
  width: 23px !important;
  min-width: 23px !important;
  height: 23px !important;
  min-height: 23px !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
  border: 1px solid var(--fd-r100-dark-border) !important;
  border-radius: 7px !important;
  outline: none !important;
  background: var(--fd-r100-dark-control) !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.fd-alert-modal input[type="checkbox"]::after {
  display: block !important;
  width: 7px !important;
  height: 12px !important;
  margin: 3px auto 0 !important;
  content: "" !important;
  border: solid #fff !important;
  border-width: 0 2px 2px 0 !important;
  opacity: 0 !important;
  transform: rotate(45deg) !important;
}
.fd-alert-modal input[type="checkbox"]:checked {
  border-color: var(--fd-r100-red) !important;
  background: var(--fd-r100-red) !important;
}
.fd-alert-modal input[type="checkbox"]:checked::after { opacity: 1 !important; }
html[data-fd-theme="light"] .fd-alert-modal input[type="checkbox"] {
  border-color: var(--fd-r100-light-border) !important;
  background: var(--fd-r100-light-control) !important;
}
html[data-fd-theme="light"] .fd-alert-modal input[type="checkbox"]:checked {
  border-color: var(--fd-r100-red) !important;
  background: var(--fd-r100-red) !important;
}
.fd-alert-modal .fd-alert-station:has(input:not(:checked)),
.fd-alert-modal .fd-alert-row:has(input:not(:checked)) {
  box-shadow: none !important;
}

/* Recovery code: compact, readable and every control has visible state. */
.fd-recovery-sheet .fd-account-sheet__panel {
  width: min(calc(100vw - 24px),520px) !important;
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  padding: 20px !important;
  border-radius: 24px !important;
  overflow-x: hidden !important;
}
.fd-recovery-sheet .fd-account-sheet__panel > header {
  margin: -20px -20px 0 !important;
  padding: 20px 20px 12px !important;
}
.fd-recovery-sheet .fd-account-sheet__panel > p {
  margin: 12px 0 0 !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
}
.fd-recovery-code {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 14px 0 0 !important;
  padding: 13px 12px !important;
  border-radius: 14px !important;
  font-family: ui-monospace,SFMono-Regular,Menlo,monospace !important;
  font-size: clamp(14px,3.8vw,19px) !important;
  line-height: 1.35 !important;
  text-align: center !important;
  letter-spacing: .02em !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
.fd-recovery-sheet :where(.fd-auth-primary,.fd-auth-secondary) {
  width: 100% !important;
  min-height: 48px !important;
  margin: 10px 0 0 !important;
  padding: 11px 14px !important;
  border-radius: 15px !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
}
.fd-recovery-confirm {
  display: grid !important;
  grid-template-columns: 23px minmax(0,1fr) !important;
  align-items: start !important;
  gap: 10px !important;
  margin: 12px 0 0 !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}
.fd-recovery-confirm input[type="checkbox"] {
  box-sizing: border-box !important;
  width: 23px !important;
  height: 23px !important;
  margin: 0 !important;
  border-radius: 7px !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.fd-recovery-confirm input[type="checkbox"]::after {
  display: block !important;
  width: 7px !important;
  height: 12px !important;
  margin: 3px auto 0 !important;
  content: "" !important;
  border: solid #fff !important;
  border-width: 0 2px 2px 0 !important;
  opacity: 0 !important;
  transform: rotate(45deg) !important;
}
.fd-recovery-confirm input[type="checkbox"]:checked {
  border-color: var(--fd-r100-red) !important;
  background: var(--fd-r100-red) !important;
}
.fd-recovery-confirm input[type="checkbox"]:checked::after { opacity: 1 !important; }
.fd-recovery-sheet .fd-auth-primary:disabled {
  border-color: transparent !important;
  background: rgba(127,127,135,.22) !important;
  color: rgba(127,127,135,.85) !important;
  opacity: 1 !important;
}
.fd-recovery-sheet [data-fd-recovery-status] {
  min-height: 0 !important;
  margin: 8px 0 0 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
.fd-recovery-sheet [data-fd-recovery-status]:empty { display: none !important; }

html[data-fd-theme="light"] .fd-recovery-sheet .fd-account-sheet__panel {
  border-color: var(--fd-r100-light-border) !important;
  background: var(--fd-r100-light-surface) !important;
  color: var(--fd-r100-light-text) !important;
  box-shadow: 0 14px 36px rgba(24,24,28,.16) !important;
}
html[data-fd-theme="light"] .fd-recovery-sheet .fd-account-sheet__panel > header { background: var(--fd-r100-light-surface) !important; }
html[data-fd-theme="light"] .fd-recovery-code,
html[data-fd-theme="light"] .fd-recovery-confirm input[type="checkbox"] {
  border: 1px solid var(--fd-r100-light-border) !important;
  background: var(--fd-r100-light-control) !important;
  color: var(--fd-r100-light-text) !important;
}
html[data-fd-theme="dark"] .fd-recovery-code,
html[data-fd-theme="dark"] .fd-recovery-confirm input[type="checkbox"] {
  border: 1px solid var(--fd-r100-dark-border) !important;
  background: var(--fd-r100-dark-control) !important;
  color: var(--fd-r100-dark-text) !important;
}
html[data-fd-theme="light"] .fd-recovery-confirm input[type="checkbox"]:checked,
html[data-fd-theme="dark"] .fd-recovery-confirm input[type="checkbox"]:checked {
  border-color: var(--fd-r100-red) !important;
  background: var(--fd-r100-red) !important;
}

@media (max-width: 360px) {
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div { grid-template-columns: minmax(0,1fr) !important; }
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras .fd-field:last-child { grid-column: auto !important; }
  .fd-recovery-sheet .fd-account-sheet__panel { padding: 16px !important; }
  .fd-recovery-sheet .fd-account-sheet__panel > header { margin: -16px -16px 0 !important; padding: 16px 16px 10px !important; }
}

/* ===== assets/r101-ui-consistency.css ===== */
/* FuelDash R101 — one component contract for feature pages and price alerts. */
:root {
  --fd-r101-red: #ff3b30;
  --fd-r101-light-page: #f5f5f7;
  --fd-r101-light-surface: #ffffff;
  --fd-r101-light-control: #f0f0f3;
  --fd-r101-light-border: #d4d4da;
  --fd-r101-light-text: #171719;
  --fd-r101-light-muted: #74747b;
  --fd-r101-dark-page: #050505;
  --fd-r101-dark-surface: #141416;
  --fd-r101-dark-control: #242428;
  --fd-r101-dark-border: rgba(255,255,255,.11);
  --fd-r101-dark-text: #f7f7f8;
  --fd-r101-dark-muted: #99999f;
  --fd-r101-card-radius: 24px;
  --fd-r101-control-radius: 16px;
  --fd-r101-control-height: 48px;
}

/* A feature page owns the viewport. Only its content column scrolls. */
body.fd-feature-open,
body.fd-account-open { overflow: hidden !important; }
.fd-feature-page {
  overflow: hidden !important;
  overscroll-behavior: none !important;
  background-image: none !important;
}
.fd-feature-page::before,
.fd-feature-page::after,
.fd-feature-shell::before,
.fd-feature-shell::after,
.fd-feature-content::before,
.fd-feature-content::after {
  content: none !important;
  display: none !important;
}
.fd-feature-shell {
  display: flex !important;
  flex-direction: column !important;
  width: min(100%, 480px) !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  padding: 0 !important;
  overflow: hidden !important;
}
.fd-feature-header {
  position: relative !important;
  inset: auto !important;
  z-index: 30 !important;
  flex: 0 0 auto !important;
  display: grid !important;
  grid-template-columns: 48px minmax(0,1fr) !important;
  align-items: start !important;
  gap: 14px !important;
  padding: calc(14px + env(safe-area-inset-top)) 20px 16px !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
.fd-feature-content {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: contain !important;
  padding: 16px 20px calc(40px + env(safe-area-inset-bottom)) !important;
  background-image: none !important;
  -webkit-overflow-scrolling: touch !important;
}
html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] .fd-feature-page,
html[data-fd-theme="light"] .fd-feature-shell,
html[data-fd-theme="light"] .fd-feature-header,
html[data-fd-theme="light"] .fd-feature-content {
  background-color: var(--fd-r101-light-page) !important;
  background-image: none !important;
}
html[data-fd-theme="dark"],
html[data-fd-theme="dark"] body,
html[data-fd-theme="dark"] #app,
html[data-fd-theme="dark"] .fd-feature-page,
html[data-fd-theme="dark"] .fd-feature-shell,
html[data-fd-theme="dark"] .fd-feature-header,
html[data-fd-theme="dark"] .fd-feature-content {
  background-color: var(--fd-r101-dark-page) !important;
  background-image: none !important;
}

/* Every navigation control uses the same circle and never keeps the iOS focus halo. */
#app .brand-header .round-button.detail-close,
.fd-feature-back,
.fd-alert-close,
.fd-account-sheet__panel > header > button {
  box-sizing: border-box !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 48px !important;
  width: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  outline: none !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  -webkit-tap-highlight-color: transparent !important;
}
#app .brand-header .round-button.detail-close:focus,
#app .brand-header .round-button.detail-close:focus-visible,
.fd-feature-back:focus,
.fd-feature-back:focus-visible,
.fd-alert-close:focus,
.fd-alert-close:focus-visible,
.fd-account-sheet__panel > header > button:focus,
.fd-account-sheet__panel > header > button:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
.fd-feature-back svg,
#app .brand-header .round-button.detail-close svg {
  width: 22px !important;
  height: 22px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
html[data-fd-theme="light"] :is(#app .brand-header .round-button.detail-close,.fd-feature-back,.fd-alert-close,.fd-account-sheet__panel > header > button) {
  border: 1px solid var(--fd-r101-light-border) !important;
  background: var(--fd-r101-light-control) !important;
  color: #505057 !important;
}
html[data-fd-theme="dark"] :is(#app .brand-header .round-button.detail-close,.fd-feature-back,.fd-alert-close,.fd-account-sheet__panel > header > button) {
  border: 1px solid var(--fd-r101-dark-border) !important;
  background: var(--fd-r101-dark-control) !important;
  color: var(--fd-r101-dark-text) !important;
}

/* One action hierarchy: red = commit/setup, gray = secondary/export/test. */
.fd-tank-submit,
.fd-account-card__action,
.fd-auth-primary,
.fd-alert-enable {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: var(--fd-r101-control-height) !important;
  height: var(--fd-r101-control-height) !important;
  padding: 0 16px !important;
  border: 1px solid var(--fd-r101-red) !important;
  border-radius: var(--fd-r101-control-radius) !important;
  background: var(--fd-r101-red) !important;
  background-image: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.fd-backup-actions button,
.fd-auth-secondary,
.fd-alert-test {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: var(--fd-r101-control-height) !important;
  height: var(--fd-r101-control-height) !important;
  padding: 0 14px !important;
  border-radius: var(--fd-r101-control-radius) !important;
  background-image: none !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-fd-theme="light"] :is(.fd-backup-actions button,.fd-auth-secondary,.fd-alert-test) {
  border: 1px solid var(--fd-r101-light-border) !important;
  background: var(--fd-r101-light-control) !important;
  color: #4f4f56 !important;
}
html[data-fd-theme="dark"] :is(.fd-backup-actions button,.fd-auth-secondary,.fd-alert-test) {
  border: 1px solid var(--fd-r101-dark-border) !important;
  background: var(--fd-r101-dark-control) !important;
  color: var(--fd-r101-dark-text) !important;
}
.fd-account-card__action { justify-content: center !important; }
.fd-account-card__action svg { display: none !important; }

/* Tankbook field rhythm. No phantom status row or oversized gap. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form {
  gap: 12px !important;
  margin-top: 16px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras {
  grid-column: 1 / -1 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary {
  display: flex !important;
  align-items: center !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 2px !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
  cursor: pointer !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 12px !important;
  padding-top: 12px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras .fd-field:last-child { grid-column: 1 / -1 !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-form-status:empty,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-status:empty { display: none !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-form-status:not(:empty),
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-status:not(:empty) {
  min-height: 0 !important;
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-field input,.fd-field select,.fd-field textarea) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  border-radius: var(--fd-r101-control-radius) !important;
  box-shadow: none !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-field input,.fd-field select) {
  min-height: var(--fd-r101-control-height) !important;
  height: var(--fd-r101-control-height) !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-field textarea { min-height: 96px !important; }

/* Price alerts: one internal scroll area, stationary header, identical cards and controls. */
.fd-alert-modal {
  box-sizing: border-box !important;
  overflow: hidden !important;
  padding: 0 !important;
  background-image: none !important;
}
.fd-alert-sheet {
  box-sizing: border-box !important;
  display: block !important;
  width: min(100%,560px) !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  margin: 0 auto !important;
  padding: 0 14px calc(120px + env(safe-area-inset-bottom)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: contain !important;
  scroll-padding-top: calc(92px + env(safe-area-inset-top)) !important;
  -webkit-overflow-scrolling: touch !important;
}
.fd-alert-head {
  position: sticky !important;
  top: 0 !important;
  left: auto !important;
  transform: none !important;
  z-index: 40 !important;
  box-sizing: border-box !important;
  width: auto !important;
  height: auto !important;
  min-height: calc(78px + env(safe-area-inset-top)) !important;
  margin: 0 -2px 12px !important;
  padding: calc(14px + env(safe-area-inset-top)) 2px 14px !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
.fd-alert-head h2 { font-size: 28px !important; }
.fd-alert-grid { display: grid !important; gap: 10px !important; }
.fd-alert-row,
.fd-alert-station,
.fd-alert-empty,
.fd-alert-status {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  border-radius: 20px !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.fd-alert-row {
  min-height: 72px !important;
  padding: 12px 14px !important;
}
.fd-alert-station {
  min-height: 70px !important;
  padding: 11px 14px !important;
}
.fd-alert-stations { gap: 10px !important; }
.fd-alert-station-section { margin-top: 18px !important; }
.fd-alert-station-section > header {
  padding: 0 2px 10px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
.fd-alert-station-section h3 { font-size: 19px !important; }
.fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  min-height: var(--fd-r101-control-height) !important;
  height: var(--fd-r101-control-height) !important;
  padding: 0 12px !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  font-size: 15px !important;
  line-height: 1 !important;
}
.fd-alert-row select { width: 136px !important; max-width: 136px !important; }
.fd-alert-row input[type="time"] { width: 112px !important; min-width: 112px !important; max-width: 112px !important; text-align: center !important; }
.fd-alert-row input[type="number"] { width: 72px !important; min-width: 72px !important; max-width: 72px !important; text-align: center !important; }
.fd-alert-row input[type="time"]::-webkit-date-and-time-value { text-align: center !important; }
.fd-alert-modal input[type="checkbox"] {
  box-sizing: border-box !important;
  flex: 0 0 24px !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
  border-radius: 7px !important;
  outline: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.fd-alert-modal input[type="checkbox"]::after {
  display: block !important;
  width: 7px !important;
  height: 12px !important;
  margin: 3px auto 0 !important;
  content: "" !important;
  border: solid #fff !important;
  border-width: 0 2px 2px 0 !important;
  opacity: 0 !important;
  transform: rotate(45deg) !important;
}
.fd-alert-modal input[type="checkbox"]:checked {
  border-color: var(--fd-r101-red) !important;
  background: var(--fd-r101-red) !important;
}
.fd-alert-modal input[type="checkbox"]:checked::after { opacity: 1 !important; }
.fd-alert-actions {
  display: grid !important;
  grid-template-columns: minmax(0,1.3fr) minmax(0,1fr) !important;
  gap: 10px !important;
  margin-top: 16px !important;
}
.fd-alert-actions button {
  min-height: var(--fd-r101-control-height) !important;
  height: var(--fd-r101-control-height) !important;
  padding: 0 12px !important;
  border-radius: var(--fd-r101-control-radius) !important;
  box-shadow: none !important;
  transform: none !important;
}
.fd-alert-note { margin: 16px 2px 0 !important; }

html[data-fd-theme="light"] :is(.fd-alert-modal,.fd-alert-sheet,.fd-alert-head) {
  background-color: var(--fd-r101-light-page) !important;
  color: var(--fd-r101-light-text) !important;
}
html[data-fd-theme="light"] .fd-alert-head { border-bottom: 1px solid rgba(28,28,32,.08) !important; }
html[data-fd-theme="light"] :is(.fd-alert-row,.fd-alert-station,.fd-alert-empty,.fd-alert-status) {
  border: 1px solid var(--fd-r101-light-border) !important;
  background: var(--fd-r101-light-surface) !important;
  color: var(--fd-r101-light-text) !important;
}
html[data-fd-theme="light"] .fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  border: 1px solid var(--fd-r101-light-border) !important;
  background: var(--fd-r101-light-control) !important;
  color: var(--fd-r101-light-text) !important;
}
html[data-fd-theme="light"] .fd-alert-modal input[type="checkbox"] {
  border: 1px solid var(--fd-r101-light-border) !important;
  background: var(--fd-r101-light-control) !important;
}
html[data-fd-theme="light"] .fd-alert-modal input[type="checkbox"]:checked {
  border-color: var(--fd-r101-red) !important;
  background: var(--fd-r101-red) !important;
}
html[data-fd-theme="dark"] :is(.fd-alert-modal,.fd-alert-sheet,.fd-alert-head) {
  background-color: var(--fd-r101-dark-page) !important;
  color: var(--fd-r101-dark-text) !important;
}
html[data-fd-theme="dark"] .fd-alert-head { border-bottom: 1px solid rgba(255,255,255,.07) !important; }
html[data-fd-theme="dark"] :is(.fd-alert-row,.fd-alert-station,.fd-alert-empty,.fd-alert-status) {
  border: 1px solid var(--fd-r101-dark-border) !important;
  background: var(--fd-r101-dark-surface) !important;
  color: var(--fd-r101-dark-text) !important;
}
html[data-fd-theme="dark"] .fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  border: 1px solid var(--fd-r101-dark-border) !important;
  background: var(--fd-r101-dark-control) !important;
  color: var(--fd-r101-dark-text) !important;
}
html[data-fd-theme="dark"] .fd-alert-modal input[type="checkbox"] {
  border: 1px solid var(--fd-r101-dark-border) !important;
  background: var(--fd-r101-dark-control) !important;
}
html[data-fd-theme="dark"] .fd-alert-modal input[type="checkbox"]:checked {
  border-color: var(--fd-r101-red) !important;
  background: var(--fd-r101-red) !important;
}

@media (max-width: 360px) {
  .fd-feature-header { grid-template-columns: 46px minmax(0,1fr) !important; gap: 12px !important; padding-inline: 16px !important; }
  .fd-feature-content { padding-inline: 16px !important; }
  .fd-feature-back,
  .fd-alert-close { width: 46px !important; min-width: 46px !important; max-width: 46px !important; height: 46px !important; min-height: 46px !important; max-height: 46px !important; }
  .fd-alert-sheet { padding-inline: 12px !important; }
  .fd-alert-row input[type="time"] { width: 104px !important; min-width: 104px !important; max-width: 104px !important; }
  .fd-alert-actions { grid-template-columns: 1fr !important; }
}
/* Theme-specific specificity guard: account setup is a primary action in both themes. */
html[data-fd-theme="light"] .fd-account-card .fd-account-card__action,
html[data-fd-theme="dark"] .fd-account-card .fd-account-card__action {
  border-color: var(--fd-r101-red) !important;
  background: var(--fd-r101-red) !important;
  color: #fff !important;
}
html[data-fd-theme="light"] .fd-feature-page .fd-backup-actions button,
html[data-fd-theme="dark"] .fd-feature-page .fd-backup-actions button {
  min-height: var(--fd-r101-control-height) !important;
  height: var(--fd-r101-control-height) !important;
  padding: 0 14px !important;
  border-radius: var(--fd-r101-control-radius) !important;
}
.fd-alert-station-section {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
@media (max-width: 360px) {
  .fd-feature-header { grid-template-columns: 48px minmax(0,1fr) !important; }
  .fd-feature-back,
  .fd-alert-close { width: 48px !important; min-width: 48px !important; max-width: 48px !important; height: 48px !important; min-height: 48px !important; max-height: 48px !important; }
}

/* ===== assets/r102-ui-harmony.css ===== */
/* FuelDash R102 — harmonized component rhythm without touching core behavior. */
:root {
  --fd-r102-red: #ff3b30;
  --fd-r102-light-page: #f5f5f7;
  --fd-r102-light-surface: #ffffff;
  --fd-r102-light-control: #ececf0;
  --fd-r102-light-border: #d2d2d8;
  --fd-r102-dark-page: #050505;
  --fd-r102-dark-surface: #141416;
  --fd-r102-dark-control: #242428;
  --fd-r102-dark-border: rgba(255,255,255,.11);
  --fd-r102-section-gap: 16px;
  --fd-r102-card-radius: 24px;
  --fd-r102-control-radius: 16px;
  --fd-r102-control-height: 48px;
}

/* Dashboard cards use the same vertical rhythm above and below the primary station. */
#app .primary-station-card + .favorites-block {
  margin-top: var(--fd-r102-section-gap) !important;
}

/* Feature header is a fixed top row; the navigation control matches Details and sits right. */
.fd-feature-header {
  grid-template-columns: minmax(0,1fr) 48px !important;
  align-items: start !important;
  gap: 14px !important;
}
.fd-feature-heading {
  grid-column: 1 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
}
.fd-feature-back {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: end !important;
}
.fd-feature-header,
.fd-feature-heading,
.fd-feature-back {
  transform: none !important;
}

/* Tankbook is one vertical card system with equal spacing in both themes. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--fd-r102-section-gap) !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content > section {
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 !important;
  border-radius: var(--fd-r102-card-radius) !important;
  box-sizing: border-box !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-overall-card,.fd-tank-history) {
  padding: 20px !important;
  overflow: hidden !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-overall-card,.fd-tank-history) {
  border: 1px solid var(--fd-r102-light-border) !important;
  background: var(--fd-r102-light-surface) !important;
  color: #171719 !important;
  box-shadow: 0 8px 24px rgba(20,20,24,.055) !important;
}
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-overall-card,.fd-tank-history) {
  border: 1px solid var(--fd-r102-dark-border) !important;
  background: var(--fd-r102-dark-surface) !important;
  color: #f7f7f8 !important;
  box-shadow: none !important;
}
.fd-overall-card .fd-feature-card__head,
.fd-tank-history__head {
  margin: 0 0 16px !important;
}
.fd-overall-card .fd-tank-summary {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 12px !important;
  margin: 0 !important;
}
.fd-overall-card .fd-tank-summary article {
  min-width: 0 !important;
  min-height: 92px !important;
  margin: 0 !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}
.fd-tank-history .fd-tank-list { margin: 0 !important; }

/* Additional fields always show a clear disclosure arrow. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary {
  position: relative !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  list-style: none !important;
  padding-right: 30px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary::-webkit-details-marker { display: none !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary::after {
  content: "›" !important;
  position: absolute !important;
  right: 4px !important;
  top: 50% !important;
  display: block !important;
  font-size: 25px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  transform: translateY(-50%) rotate(90deg) !important;
  transform-origin: center !important;
  transition: none !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras[open] summary::after {
  transform: translateY(-50%) rotate(-90deg) !important;
}

/* Cloud card follows the same typography scale and separates login from registration. */
.fd-account-card__copy h2 {
  margin: 8px 0 10px !important;
  font-size: 22px !important;
  line-height: 1.15 !important;
  letter-spacing: -.35px !important;
}
.fd-account-card__copy p {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}
.fd-account-card__actions {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 10px !important;
  margin-top: 18px !important;
}
.fd-account-card__actions button,
.fd-account-card__action {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: var(--fd-r102-control-height) !important;
  min-height: var(--fd-r102-control-height) !important;
  padding: 0 14px !important;
  border-radius: var(--fd-r102-control-radius) !important;
  text-align: center !important;
  font-size: 14px !important;
  font-weight: 680 !important;
  line-height: 1.15 !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] .fd-account-card__actions .fd-auth-secondary {
  border: 1px solid var(--fd-r102-light-border) !important;
  background: var(--fd-r102-light-control) !important;
  color: #4f4f56 !important;
}
html[data-fd-theme="dark"] .fd-account-card__actions .fd-auth-secondary {
  border: 1px solid var(--fd-r102-dark-border) !important;
  background: var(--fd-r102-dark-control) !important;
  color: #f7f7f8 !important;
}
.fd-account-card__actions .fd-auth-primary,
.fd-account-card__action.fd-auth-primary {
  border: 1px solid var(--fd-r102-red) !important;
  background: var(--fd-r102-red) !important;
  color: #fff !important;
}

/* Inactive segmented controls use a tinted glass control, not plain white. */
html[data-fd-theme="light"] #app :where(
  .fuel-preference,.nearby-radius,.fuel-filter,.station-sort,.chart-range,.favorites-filter,.favorite-filter
) button:not(.is-active):not([aria-pressed="true"]):not([aria-selected="true"]) {
  border: 1px solid var(--fd-r102-light-border) !important;
  background: var(--fd-r102-light-control) !important;
  background-image: none !important;
  color: #505057 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-fd-theme="light"] #app :where(
  .fuel-preference,.nearby-radius,.fuel-filter,.station-sort,.chart-range,.favorites-filter,.favorite-filter
) button:is(.is-active,[aria-pressed="true"],[aria-selected="true"]) {
  border-color: var(--fd-r102-red) !important;
  background: var(--fd-r102-red) !important;
  color: #fff !important;
}

@media (max-width: 360px) {
  .fd-account-card__actions { grid-template-columns: 1fr !important; }
  .fd-feature-header { grid-template-columns: minmax(0,1fr) 48px !important; }
}

/* ===== assets/r103-unified-ui.css ===== */
/* FuelDash R103 — unified page, modal and control geometry. */
:root {
  --fd-r103-red: #ff3b30;
  --fd-r103-light-page: #f5f5f7;
  --fd-r103-light-surface: #ffffff;
  --fd-r103-light-control: #ececf0;
  --fd-r103-light-border: #d2d2d8;
  --fd-r103-light-text: #171719;
  --fd-r103-light-muted: #717178;
  --fd-r103-dark-page: #050505;
  --fd-r103-dark-surface: #141416;
  --fd-r103-dark-control: #242428;
  --fd-r103-dark-border: rgba(255,255,255,.11);
  --fd-r103-dark-text: #f7f7f8;
  --fd-r103-dark-muted: #99999f;
  --fd-r103-round-control: 40px;
  --fd-r103-control-height: 48px;
  --fd-r103-control-radius: 16px;
  --fd-r103-card-radius: 24px;
  --fd-r103-gap: 16px;
}

/* One uninterrupted page color, including overscroll and PWA edge areas. */
html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] .fd-feature-page,
html[data-fd-theme="light"] .fd-feature-shell,
html[data-fd-theme="light"] .fd-feature-content,
html[data-fd-theme="light"] .fd-alert-modal,
html[data-fd-theme="light"] .fd-account-sheet {
  background-color: var(--fd-r103-light-page) !important;
  background-image: none !important;
}
html[data-fd-theme="dark"],
html[data-fd-theme="dark"] body,
html[data-fd-theme="dark"] #app,
html[data-fd-theme="dark"] .fd-feature-page,
html[data-fd-theme="dark"] .fd-feature-shell,
html[data-fd-theme="dark"] .fd-feature-content,
html[data-fd-theme="dark"] .fd-alert-modal,
html[data-fd-theme="dark"] .fd-account-sheet {
  background-color: var(--fd-r103-dark-page) !important;
  background-image: none !important;
}
html, body, #app { min-height: 100%; }
html[data-fd-theme] :where(body,#app,.fd-feature-page,.fd-feature-shell,.fd-feature-content,.fd-alert-modal,.fd-account-sheet)::before,
html[data-fd-theme] :where(body,#app,.fd-feature-page,.fd-feature-shell,.fd-feature-content,.fd-alert-modal,.fd-account-sheet)::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* Feature pages: the heading is normal page content, never a clipped overlay. */
body.fd-feature-open { overflow: hidden !important; }
.fd-feature-page {
  position: fixed !important;
  inset: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
}
.fd-feature-shell {
  display: block !important;
  width: min(100%, 480px) !important;
  min-height: 100dvh !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 0 calc(36px + env(safe-area-inset-bottom)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.fd-feature-header {
  position: static !important;
  inset: auto !important;
  z-index: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) var(--fd-r103-round-control) !important;
  align-items: start !important;
  gap: 14px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: calc(18px + env(safe-area-inset-top)) 20px 14px !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transform: none !important;
}
.fd-feature-heading {
  grid-column: 1 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
}
.fd-feature-heading h1 { margin: 0 !important; }
.fd-feature-heading p { max-width: 360px; }
.fd-feature-back {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  display: grid !important;
  place-items: center !important;
  width: var(--fd-r103-round-control) !important;
  min-width: var(--fd-r103-round-control) !important;
  height: var(--fd-r103-round-control) !important;
  min-height: var(--fd-r103-round-control) !important;
  margin: 0 !important;
  padding: 10px !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  transform: none !important;
}
.fd-feature-back svg {
  display: block !important;
  width: 19px !important;
  height: 19px !important;
  margin: 0 !important;
  transform: none !important;
}
.fd-feature-content {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--fd-r103-gap) !important;
  width: 100% !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  padding: 10px 20px 0 !important;
}
.fd-feature-content > section { margin: 0 !important; }

/* Compact round controls match the original Details geometry. */
:is(.fd-feature-back,.fd-alert-close,.fd-account-sheet__panel > header > button) {
  width: var(--fd-r103-round-control) !important;
  min-width: var(--fd-r103-round-control) !important;
  height: var(--fd-r103-round-control) !important;
  min-height: var(--fd-r103-round-control) !important;
  padding: 0 !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  box-shadow: inset 0 1px rgba(255,255,255,.06) !important;
  -webkit-tap-highlight-color: transparent !important;
}
html[data-fd-theme="light"] :is(.fd-feature-back,.fd-alert-close,.fd-account-sheet__panel > header > button) {
  border: 1px solid var(--fd-r103-light-border) !important;
  background: var(--fd-r103-light-control) !important;
  color: #55555c !important;
}
html[data-fd-theme="dark"] :is(.fd-feature-back,.fd-alert-close,.fd-account-sheet__panel > header > button) {
  border: 1px solid var(--fd-r103-dark-border) !important;
  background: var(--fd-r103-dark-control) !important;
  color: #f7f7f8 !important;
}
:is(.fd-feature-back,.fd-alert-close,.fd-account-sheet__panel > header > button):focus,
:is(.fd-feature-back,.fd-alert-close,.fd-account-sheet__panel > header > button):focus-visible {
  outline: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.06) !important;
}

/* Price alarms use the same ordinary-page header and card rhythm. */
.fd-alert-modal {
  position: fixed !important;
  inset: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 0 16px calc(32px + env(safe-area-inset-bottom)) !important;
  overscroll-behavior-y: contain !important;
}
.fd-alert-sheet {
  width: min(100%, 480px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
}
.fd-alert-head {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  width: 100% !important;
  height: auto !important;
  box-sizing: border-box !important;
  padding: calc(18px + env(safe-area-inset-top)) 0 16px !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.fd-alert-close {
  display: grid !important;
  place-items: center !important;
  font-size: 0 !important;
  line-height: 0 !important;
  position: relative !important;
}
.fd-alert-close::before,
.fd-alert-close::after,
.fd-account-sheet__panel > header > button::before,
.fd-account-sheet__panel > header > button::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 18px !important;
  height: 2px !important;
  border-radius: 2px !important;
  background: currentColor !important;
  transform-origin: center !important;
}
.fd-alert-close::before,
.fd-account-sheet__panel > header > button::before { transform: translate(-50%,-50%) rotate(45deg) !important; }
.fd-alert-close::after,
.fd-account-sheet__panel > header > button::after { transform: translate(-50%,-50%) rotate(-45deg) !important; }
.fd-alert-grid { gap: 10px !important; }
.fd-alert-row,
.fd-alert-station,
.fd-alert-empty {
  min-width: 0 !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  width: 112px !important;
  max-width: 112px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 12px !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
  text-align: center !important;
}
html[data-fd-theme="light"] .fd-alert-row,
html[data-fd-theme="light"] .fd-alert-station,
html[data-fd-theme="light"] .fd-alert-empty {
  border: 1px solid var(--fd-r103-light-border) !important;
  background: var(--fd-r103-light-surface) !important;
  color: var(--fd-r103-light-text) !important;
}
html[data-fd-theme="light"] .fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  border: 1px solid var(--fd-r103-light-border) !important;
  background: var(--fd-r103-light-control) !important;
  color: var(--fd-r103-light-text) !important;
}
html[data-fd-theme="dark"] .fd-alert-row,
html[data-fd-theme="dark"] .fd-alert-station,
html[data-fd-theme="dark"] .fd-alert-empty {
  border: 1px solid var(--fd-r103-dark-border) !important;
  background: var(--fd-r103-dark-surface) !important;
  color: var(--fd-r103-dark-text) !important;
}
html[data-fd-theme="dark"] .fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  border: 1px solid var(--fd-r103-dark-border) !important;
  background: var(--fd-r103-dark-control) !important;
  color: var(--fd-r103-dark-text) !important;
}
.fd-alert-actions { margin-bottom: 0 !important; padding-bottom: 0 !important; }
.fd-alert-note { padding-bottom: 4px !important; }

/* Account and recovery views are regular full-page overlays, not bottom sheets. */
body.fd-account-open { overflow: hidden !important; }
.fd-account-sheet {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483400 !important;
  display: block !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: calc(16px + env(safe-area-inset-top)) 16px calc(32px + env(safe-area-inset-bottom)) !important;
  box-sizing: border-box !important;
  opacity: 1 !important;
  transform: none !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
}
.fd-account-sheet__backdrop { display: none !important; }
.fd-account-sheet__panel {
  position: relative !important;
  inset: auto !important;
  width: min(100%, 448px) !important;
  max-width: 448px !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 20px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  border-radius: var(--fd-r103-card-radius) !important;
  transform: none !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] .fd-account-sheet__panel {
  border: 1px solid var(--fd-r103-light-border) !important;
  background: var(--fd-r103-light-surface) !important;
  color: var(--fd-r103-light-text) !important;
}
html[data-fd-theme="dark"] .fd-account-sheet__panel {
  border: 1px solid var(--fd-r103-dark-border) !important;
  background: var(--fd-r103-dark-surface) !important;
  color: var(--fd-r103-dark-text) !important;
}
.fd-account-sheet__panel > header {
  position: static !important;
  top: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.fd-account-sheet__panel > header h2 {
  margin: 5px 0 0 !important;
  font-size: 24px !important;
  line-height: 1.1 !important;
  letter-spacing: -.45px !important;
}
.fd-account-sheet__panel > header > button {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 var(--fd-r103-round-control) !important;
  font-size: 0 !important;
  line-height: 0 !important;
}
.fd-auth-switch {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 4px !important;
  height: 48px !important;
  padding: 4px !important;
  margin: 0 0 18px !important;
  border-radius: 16px !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
}
.fd-auth-switch button {
  min-width: 0 !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1.1 !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] .fd-auth-switch { background: var(--fd-r103-light-control) !important; }
html[data-fd-theme="dark"] .fd-auth-switch { background: var(--fd-r103-dark-control) !important; }
.fd-auth-switch button.is-active { background: var(--fd-r103-red) !important; color: #fff !important; }
.fd-auth-form {
  display: grid !important;
  gap: 14px !important;
  width: 100% !important;
}
.fd-auth-form > label { display: grid !important; gap: 7px !important; margin: 0 !important; }
.fd-auth-form > label > span { font-size: 13px !important; font-weight: 650 !important; line-height: 1.2 !important; }
.fd-auth-form > label > small,
.fd-auth-explanation { margin: 0 !important; font-size: 12px !important; line-height: 1.45 !important; }
.fd-auth-form input {
  width: 100% !important;
  height: var(--fd-r103-control-height) !important;
  min-height: var(--fd-r103-control-height) !important;
  padding: 0 14px !important;
  border-radius: var(--fd-r103-control-radius) !important;
  box-sizing: border-box !important;
  font-size: 16px !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] .fd-auth-form input {
  border: 1px solid var(--fd-r103-light-border) !important;
  background: var(--fd-r103-light-control) !important;
  color: var(--fd-r103-light-text) !important;
}
html[data-fd-theme="dark"] .fd-auth-form input {
  border: 1px solid var(--fd-r103-dark-border) !important;
  background: var(--fd-r103-dark-control) !important;
  color: var(--fd-r103-dark-text) !important;
}
.fd-account-sheet :is(.fd-auth-primary,.fd-auth-secondary) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: var(--fd-r103-control-height) !important;
  min-height: var(--fd-r103-control-height) !important;
  padding: 0 16px !important;
  border-radius: var(--fd-r103-control-radius) !important;
  box-sizing: border-box !important;
  text-align: center !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  box-shadow: none !important;
}
.fd-account-sheet .fd-auth-primary {
  border: 1px solid var(--fd-r103-red) !important;
  background: var(--fd-r103-red) !important;
  color: #fff !important;
}
html[data-fd-theme="light"] .fd-account-sheet .fd-auth-secondary {
  border: 1px solid var(--fd-r103-light-border) !important;
  background: var(--fd-r103-light-control) !important;
  color: var(--fd-r103-light-text) !important;
}
html[data-fd-theme="dark"] .fd-account-sheet .fd-auth-secondary {
  border: 1px solid var(--fd-r103-dark-border) !important;
  background: var(--fd-r103-dark-control) !important;
  color: var(--fd-r103-dark-text) !important;
}
.fd-account-signed-in { display: grid !important; gap: 10px !important; }
.fd-account-signed-in h3 { margin: 0 !important; }
.fd-account-signed-in p { margin: 0 0 8px !important; font-size: 14px !important; line-height: 1.5 !important; }
.fd-account-avatar { width: 32px !important; height: 32px !important; display: grid !important; place-items: center !important; }
.fd-account-sheet .fd-auth-link {
  justify-self: start !important;
  min-height: 36px !important;
  padding: 4px 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--fd-r103-red) !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}
.fd-recovery-code { overflow-wrap: anywhere !important; word-break: break-word !important; }
.fd-recovery-confirm { align-items: flex-start !important; }

/* Backup controls keep their icons readable. */
.fd-backup-actions button {
  min-height: 72px !important;
  border-radius: var(--fd-r103-control-radius) !important;
  box-shadow: none !important;
}
.fd-backup-actions button span {
  display: block !important;
  font-size: 17px !important;
  line-height: 1 !important;
  font-weight: 780 !important;
}
.fd-backup-actions button:nth-child(3) span { font-size: 21px !important; }
.fd-backup-actions button strong { font-size: 12px !important; line-height: 1.15 !important; }

@media (max-width: 360px) {
  .fd-feature-header,
  .fd-feature-content { padding-left: 16px !important; padding-right: 16px !important; }
  .fd-account-sheet { padding-left: 12px !important; padding-right: 12px !important; }
  .fd-account-sheet__panel { padding: 16px !important; }
  .fd-alert-modal { padding-left: 12px !important; padding-right: 12px !important; }
}

/* Final specificity guards for controls previously sized by legacy repair layers. */
.fd-alert-head .fd-alert-close,
.fd-account-sheet__panel > header > button {
  width: var(--fd-r103-round-control) !important;
  min-width: var(--fd-r103-round-control) !important;
  max-width: var(--fd-r103-round-control) !important;
  height: var(--fd-r103-round-control) !important;
  min-height: var(--fd-r103-round-control) !important;
  max-height: var(--fd-r103-round-control) !important;
}

/* ===== assets/r104-tankbook-polish.css ===== */
/* FuelDash R104 — scoped Tankbuch date, backup and account polish. */
:root {
  --fd-r104-red: #ff3b30;
  --fd-r104-light-control: #ececf0;
  --fd-r104-light-border: #d2d2d8;
  --fd-r104-light-text: #171719;
  --fd-r104-light-muted: #717178;
  --fd-r104-dark-control: #242428;
  --fd-r104-dark-border: rgba(255,255,255,.11);
  --fd-r104-dark-text: #f7f7f8;
  --fd-r104-dark-muted: #99999f;
}

/* Full-date month selector: compact and visibly editable. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
  display: grid !important;
  justify-items: end !important;
  gap: 5px !important;
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date > span:first-child {
  font-size: 10px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 164px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 10px 0 34px !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  box-shadow: none !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control > svg {
  position: absolute !important;
  left: 11px !important;
  top: 50% !important;
  width: 16px !important;
  height: 16px !important;
  transform: translateY(-50%) !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  pointer-events: none !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control input {
  width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-align: center !important;
  box-shadow: none !important;
  outline: none !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date > span:first-child { color: var(--fd-r104-light-muted) !important; }
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  border: 1px solid var(--fd-r104-light-border) !important;
  background: var(--fd-r104-light-control) !important;
  color: var(--fd-r104-light-text) !important;
}
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date > span:first-child { color: var(--fd-r104-dark-muted) !important; }
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  border: 1px solid var(--fd-r104-dark-border) !important;
  background: var(--fd-r104-dark-control) !important;
  color: var(--fd-r104-dark-text) !important;
}

/* Backup actions: standard icon scale, single compact row. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions {
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 8px !important;
  margin-top: 14px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions button {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 58px !important;
  min-height: 58px !important;
  padding: 8px 9px !important;
  border-radius: 15px !important;
  box-sizing: border-box !important;
  text-align: left !important;
  box-shadow: none !important;
}
.fd-backup-action__icon {
  display: block !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: var(--fd-r104-red) !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions button > span,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions button:nth-child(3) > span {
  display: grid !important;
  min-width: 0 !important;
  gap: 2px !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions button > span > strong {
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  color: inherit !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions button > span > small {
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.05 !important;
  color: inherit !important;
  opacity: .68 !important;
}

/* Cloud card stays one card; management expands inline without a second sheet. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card {
  display: grid !important;
  gap: 14px !important;
  padding: 20px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__copy h2 {
  margin: 7px 0 0 !important;
  font-size: 21px !important;
  line-height: 1.15 !important;
  letter-spacing: -.3px !important;
}
.fd-account-card__copy p {
  margin: 8px 0 0 !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__copy p strong { font-weight: 700 !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__action {
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 14px !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}
.fd-account-card__manager {
  display: grid !important;
  gap: 10px !important;
  padding-top: 14px !important;
  border-top: 1px solid currentColor !important;
  border-top-color: rgba(127,127,135,.24) !important;
}
.fd-account-manager__row {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 8px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__manager :is(.fd-auth-primary,.fd-auth-secondary) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 11px !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
  text-align: center !important;
  font-size: 12px !important;
  font-weight: 680 !important;
  line-height: 1.15 !important;
  box-shadow: none !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__manager .fd-auth-primary {
  border: 1px solid var(--fd-r104-red) !important;
  background: var(--fd-r104-red) !important;
  color: #fff !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__manager .fd-auth-secondary {
  border: 1px solid var(--fd-r104-light-border) !important;
  background: var(--fd-r104-light-control) !important;
  color: var(--fd-r104-light-text) !important;
}
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__manager .fd-auth-secondary {
  border: 1px solid var(--fd-r104-dark-border) !important;
  background: var(--fd-r104-dark-control) !important;
  color: var(--fd-r104-dark-text) !important;
}
.fd-account-manager__wide { grid-column: 1 / -1 !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__manager > .fd-auth-link {
  justify-self: start !important;
  min-height: 32px !important;
  padding: 3px 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--fd-r104-red) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}
.fd-account-card__password {
  display: grid !important;
  gap: 11px !important;
}
.fd-account-card__password > label {
  display: grid !important;
  gap: 6px !important;
  margin: 0 !important;
}
.fd-account-card__password > label > span {
  font-size: 12px !important;
  font-weight: 650 !important;
}
.fd-account-card__password input {
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 13px !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
  font-size: 15px !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] .fd-account-card__password input {
  border: 1px solid var(--fd-r104-light-border) !important;
  background: var(--fd-r104-light-control) !important;
  color: var(--fd-r104-light-text) !important;
}
html[data-fd-theme="dark"] .fd-account-card__password input {
  border: 1px solid var(--fd-r104-dark-border) !important;
  background: var(--fd-r104-dark-control) !important;
  color: var(--fd-r104-dark-text) !important;
}
.fd-account-card__password .fd-auth-form-status:empty { display: none !important; }

@media (max-width: 360px) {
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
    grid-template-columns: minmax(0,1fr) !important;
    align-items: start !important;
  }
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date { justify-items: start !important; }
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control { width: 156px !important; }
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions { grid-template-columns: 1fr !important; }
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions button { justify-content: flex-start !important; height: 52px !important; min-height: 52px !important; }
  .fd-account-manager__row { grid-template-columns: 1fr !important; }
}

/* Final R104 details: one visible German date label and a neutral manager toggle. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__label {
  display: block !important;
  width: 100% !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control input {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  cursor: pointer !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control input::-webkit-calendar-picker-indicator {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  cursor: pointer !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__action.fd-auth-secondary {
  border: 1px solid var(--fd-r104-light-border) !important;
  background: var(--fd-r104-light-control) !important;
  color: var(--fd-r104-light-text) !important;
}
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__action.fd-auth-secondary {
  border: 1px solid var(--fd-r104-dark-border) !important;
  background: var(--fd-r104-dark-control) !important;
  color: var(--fd-r104-dark-text) !important;
}

/* ===== assets/r105-global-account.css ===== */
/* FuelDash R105 — global account page and continuous theme surfaces. */
:root {
  --fd-r105-red: #ff3b34;
  --fd-r105-light-bg: #f5f5f7;
  --fd-r105-light-card: rgba(255, 255, 255, 0.88);
  --fd-r105-light-control: rgba(237, 237, 241, 0.86);
  --fd-r105-light-border: rgba(92, 92, 102, 0.20);
  --fd-r105-dark-bg: #050505;
  --fd-r105-dark-card: rgba(18, 18, 21, 0.90);
  --fd-r105-dark-control: rgba(39, 39, 44, 0.88);
  --fd-r105-dark-border: rgba(255, 255, 255, 0.14);
}

html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] #app .app-shell,
html[data-fd-theme="light"] #app .app-content,
html[data-fd-theme="light"] .fd-feature-page,
html[data-fd-theme="light"] .fd-feature-shell,
html[data-fd-theme="light"] .fd-feature-content {
  background-color: #f5f5f7 !important;
  background-image: none !important;
}

html[data-fd-theme="dark"],
html[data-fd-theme="dark"] body,
html[data-fd-theme="dark"] #app,
html[data-fd-theme="dark"] #app .app-shell,
html[data-fd-theme="dark"] #app .app-content,
html[data-fd-theme="dark"] .fd-feature-page,
html[data-fd-theme="dark"] .fd-feature-shell,
html[data-fd-theme="dark"] .fd-feature-content {
  background-color: #050505 !important;
  background-image: none !important;
}

html[data-fd-theme] :where(body,#app,.app-shell,.app-content,.fd-feature-page,.fd-feature-shell,.fd-feature-content)::before,
html[data-fd-theme] :where(body,#app,.app-shell,.app-content,.fd-feature-page,.fd-feature-shell,.fd-feature-content)::after {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
}

.fd-main-header-actions {
  margin-left: auto;
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-width: 40px;
}

.fd-profile-button {
  position: relative;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="light"] .fd-profile-button {
  color: #26262b !important;
  background: var(--fd-r105-light-control) !important;
  border: 1px solid var(--fd-r105-light-border) !important;
}

html[data-fd-theme="dark"] .fd-profile-button {
  color: #f5f5f7 !important;
  background: var(--fd-r105-dark-control) !important;
  border: 1px solid var(--fd-r105-dark-border) !important;
}

.fd-profile-button svg {
  width: 21px !important;
  height: 21px !important;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fd-profile-button > i {
  display: none;
  position: absolute;
  right: 2px;
  top: 2px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--fd-r105-red);
  border: 1.5px solid currentColor;
}

.fd-profile-button[data-state="attention"] > i { display: block; }
.fd-profile-button[data-state="busy"] svg { animation: fd-r105-profile-pulse 1.2s ease-in-out infinite; }
@keyframes fd-r105-profile-pulse { 50% { opacity: .45; } }

.fd-feature-page[data-fd-feature-view="account"] {
  z-index: 1800 !important;
  overflow: hidden !important;
}

.fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell {
  width: min(100%, 760px) !important;
  min-height: 100dvh !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header {
  flex: 0 0 auto;
  padding-top: calc(18px + env(safe-area-inset-top)) !important;
  padding-bottom: 12px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header .fd-feature-back {
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  box-shadow: none !important;
}

.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header .fd-feature-back svg {
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
}

.fd-account-page-title {
  flex: 0 0 auto;
  padding: 0 20px 18px;
}
.fd-account-page-title small,
.fd-account-page-title h1,
.fd-account-page-title p { margin: 0; }
.fd-account-page-title small {
  display: block;
  color: var(--fd-r105-red);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .18em;
}
.fd-account-page-title h1 {
  margin-top: 5px;
  font-size: clamp(29px, 8vw, 40px);
  line-height: 1.04;
  letter-spacing: -.035em;
}
.fd-account-page-title p {
  margin-top: 8px;
  font-size: 15px;
  line-height: 1.45;
  opacity: .66;
}

.fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 0 20px calc(32px + env(safe-area-inset-bottom)) !important;
  overscroll-behavior-x: none;
}

.fd-account-page {
  display: grid;
  gap: 16px;
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
}

.fd-account-page-status,
.fd-account-page-card,
.fd-tankbook-cloud-row {
  border-radius: 24px !important;
  box-shadow: none !important;
  overflow: hidden;
}

html[data-fd-theme="light"] :is(.fd-account-page-status,.fd-account-page-card,.fd-tankbook-cloud-row) {
  background: var(--fd-r105-light-card) !important;
  border: 1px solid var(--fd-r105-light-border) !important;
  color: #17171a !important;
  -webkit-backdrop-filter: blur(14px) saturate(115%) !important;
  backdrop-filter: blur(14px) saturate(115%) !important;
}

html[data-fd-theme="dark"] :is(.fd-account-page-status,.fd-account-page-card,.fd-tankbook-cloud-row) {
  background: var(--fd-r105-dark-card) !important;
  border: 1px solid var(--fd-r105-dark-border) !important;
  color: #f7f7f8 !important;
  -webkit-backdrop-filter: blur(14px) saturate(115%) !important;
  backdrop-filter: blur(14px) saturate(115%) !important;
}

.fd-account-page-status,
.fd-account-page-card { padding: 22px !important; }
.fd-account-page-status small,
.fd-account-page-card .fd-feature-card__head small {
  color: var(--fd-r105-red) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .16em !important;
}
.fd-account-page-status h2,
.fd-account-page-card h2 {
  margin: 6px 0 0 !important;
  font-size: 24px !important;
  line-height: 1.12 !important;
  letter-spacing: -.025em !important;
}
.fd-account-page-status p,
.fd-account-page-card > p {
  margin: 12px 0 0 !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  opacity: .72;
}
.fd-account-page-status > div > small:last-child {
  display: block;
  margin-top: 10px;
  color: inherit !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
  opacity: .55;
}

.fd-account-page-card .fd-feature-card__head {
  margin-bottom: 18px !important;
}
.fd-account-page-card .fd-feature-card__head > span {
  font-size: 12px !important;
  font-weight: 500 !important;
  opacity: .58;
}

.fd-account-page-card .fd-auth-switch {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 4px !important;
  margin: 0 0 18px !important;
  padding: 4px !important;
  border-radius: 16px !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] .fd-account-page-card .fd-auth-switch { background: var(--fd-r105-light-control) !important; border: 1px solid var(--fd-r105-light-border) !important; }
html[data-fd-theme="dark"] .fd-account-page-card .fd-auth-switch { background: var(--fd-r105-dark-control) !important; border: 1px solid var(--fd-r105-dark-border) !important; }
.fd-account-page-card .fd-auth-switch button {
  min-height: 44px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: inherit !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}
.fd-account-page-card .fd-auth-switch button.is-active { background: var(--fd-r105-red) !important; color: #fff !important; }

.fd-account-page-card .fd-auth-form {
  display: grid !important;
  gap: 14px !important;
}
.fd-account-page-card .fd-auth-form label {
  display: grid !important;
  gap: 7px !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}
.fd-account-page-card .fd-auth-form label > small,
.fd-account-page-card .fd-auth-explanation {
  font-size: 12px !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  opacity: .62;
}
.fd-account-page-card .fd-auth-form input {
  width: 100% !important;
  height: 50px !important;
  min-height: 50px !important;
  padding: 0 15px !important;
  border-radius: 15px !important;
  box-shadow: none !important;
  font-size: 16px !important;
}
html[data-fd-theme="light"] .fd-account-page-card .fd-auth-form input { background: var(--fd-r105-light-control) !important; color: #17171a !important; border: 1px solid var(--fd-r105-light-border) !important; }
html[data-fd-theme="dark"] .fd-account-page-card .fd-auth-form input { background: var(--fd-r105-dark-control) !important; color: #f7f7f8 !important; border: 1px solid var(--fd-r105-dark-border) !important; }

.fd-account-page-card :is(.fd-auth-primary,.fd-auth-secondary) {
  width: 100% !important;
  min-height: 48px !important;
  padding: 0 16px !important;
  border-radius: 15px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}
.fd-account-page-card .fd-auth-primary { background: var(--fd-r105-red) !important; color: #fff !important; border: 1px solid var(--fd-r105-red) !important; }
html[data-fd-theme="light"] .fd-account-page-card .fd-auth-secondary { background: var(--fd-r105-light-control) !important; color: #2f2f35 !important; border: 1px solid var(--fd-r105-light-border) !important; }
html[data-fd-theme="dark"] .fd-account-page-card .fd-auth-secondary { background: var(--fd-r105-dark-control) !important; color: #f4f4f5 !important; border: 1px solid var(--fd-r105-dark-border) !important; }
.fd-account-page-card .fd-auth-link {
  justify-self: center;
  min-height: 38px;
  padding: 0 8px;
  border: 0 !important;
  background: transparent !important;
  color: var(--fd-r105-red) !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}
.fd-account-page-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 18px; }
.fd-account-page-actions--stack { grid-template-columns: 1fr; }
.fd-account-page-actions--stack .fd-auth-link { justify-self: start; }
.fd-admin-panel {
  display: grid !important;
  gap: 14px !important;
}
.fd-admin-user-list {
  display: grid;
  gap: 8px;
}
.fd-admin-user {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  align-items: center;
  padding: 13px 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: #080808;
}
.fd-admin-user > div {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.fd-admin-user strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fd-admin-user span {
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(255,59,48,.16);
  color: #ff5148;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.fd-admin-user small {
  color: #85858c;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.fd-admin-user time {
  grid-column: 2;
  grid-row: 1 / span 2;
  color: #d9d9dd;
  font-size: 12px;
  text-align: right;
}
.fd-admin-state {
  margin: 0 !important;
  color: #a4a4aa !important;
}
.fd-admin-state[data-type="error"] { color: #ff625a !important; }
.fd-admin-refresh { width: 100%; }
.fd-auth-form-status:empty { display: none !important; }
.fd-auth-form-status { margin: 0 !important; font-size: 13px !important; line-height: 1.4 !important; }
.fd-auth-form-status[data-type="error"] { color: #d72d27 !important; }
.fd-auth-form-status[data-type="success"] { color: #30d158 !important; }

.fd-recovery-code {
  display: block;
  margin: 18px 0;
  padding: 14px;
  border-radius: 15px;
  font-size: clamp(15px, 4.5vw, 20px);
  line-height: 1.4;
  text-align: center;
  letter-spacing: .06em;
  overflow-wrap: anywhere;
}
html[data-fd-theme="light"] .fd-recovery-code { background: var(--fd-r105-light-control); border: 1px solid var(--fd-r105-light-border); }
html[data-fd-theme="dark"] .fd-recovery-code { background: var(--fd-r105-dark-control); border: 1px solid var(--fd-r105-dark-border); }
.fd-recovery-confirm { display: flex !important; align-items: flex-start !important; gap: 10px !important; margin: 16px 0 !important; font-size: 13px !important; font-weight: 500 !important; }
.fd-recovery-confirm input { width: 22px !important; min-width: 22px !important; height: 22px !important; margin: 0 !important; }

.fd-tankbook-cloud-row { padding: 0 !important; }
.fd-tankbook-cloud-row > button {
  width: 100% !important;
  min-height: 82px !important;
  padding: 16px 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px;
  text-align: left !important;
  color: inherit !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.fd-tankbook-cloud-row > button > span { display: grid; gap: 3px; min-width: 0; }
.fd-tankbook-cloud-row small { color: var(--fd-r105-red); font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.fd-tankbook-cloud-row strong { font-size: 17px; line-height: 1.2; }
.fd-tankbook-cloud-row em { font-size: 12px; font-style: normal; opacity: .58; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.fd-tankbook-cloud-row svg { width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; opacity: .56; }

.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions button {
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions button > span {
  align-items: center !important;
  justify-items: center !important;
  text-align: center !important;
}

html[data-fd-theme="light"] #app .station-sort {
  background: var(--fd-r105-light-bg) !important;
  border-color: var(--fd-r105-light-border) !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] #app .station-sort button:not(.is-active) {
  background: var(--fd-r105-light-bg) !important;
  color: #4d4d54 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] #app .station-sort button.is-active {
  background: var(--fd-r105-red) !important;
  color: #fff !important;
}

@media (max-width: 480px) {
  .fd-account-page-title { padding-inline: 16px; }
  .fd-feature-page[data-fd-feature-view="account"] .fd-feature-content { padding-inline: 16px !important; }
  .fd-account-page-status,
  .fd-account-page-card { padding: 18px !important; }
  .fd-account-page-actions { grid-template-columns: 1fr; }
}

/* ===== assets/r106-responsive-performance.css ===== */
/* FuelDash R106 — responsive account, compact feature views and in-place themes. */
:root {
  --fd-r106-red: #ff3b34;
  --fd-r106-green: #30d158;
  --fd-r106-light-bg: #f5f5f7;
  --fd-r106-light-card: rgba(255,255,255,.88);
  --fd-r106-light-control: rgba(232,232,237,.82);
  --fd-r106-light-border: rgba(74,74,82,.18);
  --fd-r106-dark-bg: #050505;
  --fd-r106-dark-card: rgba(18,18,21,.92);
  --fd-r106-dark-control: rgba(38,38,43,.9);
  --fd-r106-dark-border: rgba(255,255,255,.13);
}

html.fd-theme-switching *,
html.fd-theme-switching *::before,
html.fd-theme-switching *::after {
  transition: none !important;
  animation: none !important;
}

/* Main header account affordance. */
.fd-main-header-actions { gap: 8px !important; min-width: 40px !important; }
.fd-profile-greeting {
  max-width: 112px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 12px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: -.01em;
}
html[data-fd-theme="light"] .fd-profile-greeting { color: #57575e; }
html[data-fd-theme="dark"] .fd-profile-greeting { color: rgba(255,255,255,.68); }

.fd-main-header-actions.has-profile-greeting .header-background-status {
  display: none !important;
}
.fd-profile-button { width: 38px !important; min-width: 38px !important; height: 38px !important; min-height: 38px !important; }
.fd-profile-button svg { width: 19px !important; height: 19px !important; }

/* Account page follows the same mobile scale as the main app. */
.fd-feature-page[data-fd-feature-view="account"] {
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell {
  width: min(100%, 560px) !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header {
  min-height: 58px !important;
  padding: calc(10px + env(safe-area-inset-top)) 16px 6px !important;
  box-sizing: border-box !important;
}
.fd-feature-page[data-fd-feature-view="account"] .brand-wordmark img { width: 32px !important; height: 32px !important; }
.fd-feature-page[data-fd-feature-view="account"] .brand-wordmark > span,
.fd-feature-page[data-fd-feature-view="account"] .brand-wordmark > strong { font-size: 25px !important; line-height: 1 !important; }
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header .fd-feature-back {
  width: 38px !important; min-width: 38px !important; height: 38px !important; min-height: 38px !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header .fd-feature-back svg { width: 18px !important; height: 18px !important; }
.fd-account-page-title { padding: 8px 16px 14px !important; }
.fd-account-page-title small { font-size: 10px !important; letter-spacing: .16em !important; }
.fd-account-page-title h1 { margin-top: 4px !important; font-size: 30px !important; line-height: 1.05 !important; letter-spacing: -.035em !important; }
.fd-account-page-title p { margin-top: 6px !important; font-size: 13px !important; line-height: 1.38 !important; }
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
  padding: 0 16px calc(22px + env(safe-area-inset-bottom)) !important;
}
.fd-account-page { max-width: 520px !important; gap: 12px !important; padding: 0 !important; }
.fd-account-page-status,
.fd-account-page-card { padding: 16px !important; border-radius: 21px !important; }
.fd-account-page-status small,
.fd-account-page-card .fd-feature-card__head small { font-size: 10px !important; letter-spacing: .15em !important; }
.fd-account-page-status h2,
.fd-account-page-card h2 { margin-top: 4px !important; font-size: 20px !important; line-height: 1.15 !important; }
.fd-account-page-status p,
.fd-account-page-card > p { margin-top: 8px !important; font-size: 13px !important; line-height: 1.42 !important; }
.fd-account-page-status > div > small:last-child { margin-top: 7px !important; font-size: 11px !important; }
.fd-account-page-card .fd-feature-card__head { margin-bottom: 12px !important; }
.fd-account-page-card .fd-feature-card__head > span { font-size: 11px !important; }
.fd-account-page-card .fd-auth-switch { margin-bottom: 12px !important; border-radius: 14px !important; }
.fd-account-page-card .fd-auth-switch button { min-height: 40px !important; border-radius: 10px !important; font-size: 13px !important; }
.fd-account-page-card .fd-auth-form { gap: 11px !important; }
.fd-account-page-card .fd-auth-form label { gap: 5px !important; font-size: 12px !important; }
.fd-account-page-card .fd-auth-form input { height: 46px !important; min-height: 46px !important; border-radius: 14px !important; font-size: 15px !important; }
.fd-account-page-card :is(.fd-auth-primary,.fd-auth-secondary) { height: 44px !important; min-height: 44px !important; max-height: 44px !important; border-radius: 14px !important; font-size: 14px !important; }
.fd-account-page-actions { gap: 8px !important; margin-top: 12px !important; }
.fd-account-page-card .fd-auth-link { min-height: 34px !important; font-size: 12px !important; }
.fd-recovery-code { margin: 12px 0 !important; padding: 11px !important; font-size: 15px !important; }

/* Tankbook and alert pages use the compact page scale. */
.fd-feature-page[data-fd-feature-view="tankbook"] { height: 100dvh !important; max-height: 100dvh !important; overflow: hidden !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-shell { height: 100dvh !important; min-height: 0 !important; overflow: hidden !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content { min-height: 0 !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-heading h1 { font-size: 28px !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-heading p { font-size: 12.5px !important; line-height: 1.35 !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-card { border-radius: 21px !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-card h2 { font-size: 20px !important; line-height: 1.15 !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] :is(input,select,textarea) { font-size: 15px !important; }
.fd-feature-page[data-fd-feature-view="tankbook"] :is(button,.fd-auth-primary,.fd-auth-secondary) { font-size: 14px !important; }

.fd-alert-modal { overflow-y: auto !important; -webkit-overflow-scrolling: touch !important; }
.fd-alert-sheet { width: min(100%, 520px) !important; }
.fd-alert-head h2 { font-size: 23px !important; }
.fd-alert-close { width: 38px !important; height: 38px !important; font-size: 22px !important; }
.fd-alert-grid { gap: 8px !important; }
.fd-alert-row { min-height: 58px !important; padding: 12px 13px !important; border-radius: 15px !important; }
.fd-alert-row span { font-size: 14px !important; }
.fd-alert-row small { font-size: 10.5px !important; }
.fd-alert-row select,
.fd-alert-row input[type="time"],
.fd-alert-row input[type="number"] { min-height: 38px !important; max-width: 126px !important; padding: 8px 9px !important; font-size: 14px !important; }
.fd-alert-station { min-height: 58px !important; padding: 9px 12px !important; }
.fd-alert-station strong { font-size: 13px !important; }
.fd-alert-actions button { min-height: 46px !important; padding: 11px 10px !important; font-size: 12.5px !important; }

/* Light mode keeps the same red/green price semantics as dark mode. */
html[data-fd-theme="light"] #app .station-value .price-change.is-lower,
html[data-fd-theme="light"] #app .fd-best__trend.is-lower { color: var(--fd-r106-green) !important; text-shadow: none !important; }
html[data-fd-theme="light"] #app .station-value .price-change.is-higher,
html[data-fd-theme="light"] #app .fd-best__trend.is-higher { color: #e23b33 !important; text-shadow: none !important; }
html[data-fd-theme="light"] #app .fd-best__trend.is-steady,
html[data-fd-theme="light"] #app .price-change.is-neutral { color: #77777f !important; }

@media (max-width: 390px) {
  .fd-profile-greeting { max-width: 88px; font-size: 11px; }
  .fd-account-page-title h1 { font-size: 28px !important; }
  .fd-account-page-status,
  .fd-account-page-card { padding: 14px !important; }
  .fd-account-page-actions { grid-template-columns: 1fr !important; }
}

/* ===== assets/r107-account-live-fixes.css ===== */
/* FuelDash R107 — compact account page, one mobile scroller and semantic cloud states. */
:root {
  --fd-r107-mint: #30d158;
  --fd-r107-red: #ff5a52;
  --fd-r107-orange: #ff9f43;
}

/* One scroll owner fixes the clipped black block produced by nested 100dvh containers on iOS Safari. */
.fd-feature-page[data-fd-feature-view="account"] {
  height: auto !important;
  min-height: 100% !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell {
  display: block !important;
  width: min(100%, 480px) !important;
  height: auto !important;
  min-height: 100% !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 0 calc(24px + env(safe-area-inset-bottom)) !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  display: block !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 0 16px 0 !important;
}

/* Header geometry is identical to station details. */
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header {
  min-height: 54px !important;
  margin: 2px 0 10px !important;
  padding: calc(10px + env(safe-area-inset-top)) 16px 0 !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header .fd-feature-back {
  box-sizing: border-box !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 48px !important;
  width: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  padding: 0 !important;
  border-radius: 50% !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header .fd-feature-back svg {
  width: 22px !important;
  height: 22px !important;
  stroke-width: 2 !important;
}
.fd-feature-page[data-fd-feature-view="account"] .brand-wordmark,
.fd-feature-page[data-fd-feature-view="account"] .brand-wordmark > span,
.fd-feature-page[data-fd-feature-view="account"] .brand-wordmark > strong {
  font-size: 29px !important;
  line-height: 1 !important;
}
.fd-feature-page[data-fd-feature-view="account"] .brand-wordmark img {
  width: 42px !important;
  height: 42px !important;
}

/* Compact hierarchy aligned with dashboard cards. */
.fd-account-page-title {
  padding: 2px 16px 12px !important;
}
.fd-account-page-title small {
  font-size: 9px !important;
  letter-spacing: .17em !important;
}
.fd-account-page-title h1 {
  margin-top: 3px !important;
  font-size: 25px !important;
  line-height: 1.06 !important;
  letter-spacing: -.032em !important;
}
.fd-account-page-title p {
  margin-top: 5px !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
.fd-account-page {
  max-width: 448px !important;
  gap: 10px !important;
  padding: 0 !important;
  margin: 0 auto !important;
}
.fd-account-page-status,
.fd-account-page-card {
  padding: 14px !important;
  border-radius: 18px !important;
}
.fd-account-page-status small,
.fd-account-page-card .fd-feature-card__head small {
  font-size: 9px !important;
  letter-spacing: .15em !important;
}
.fd-account-page-status h2,
.fd-account-page-card h2 {
  margin-top: 3px !important;
  font-size: 17px !important;
  line-height: 1.15 !important;
  letter-spacing: -.018em !important;
}
.fd-account-page-status p,
.fd-account-page-card > p {
  margin-top: 6px !important;
  font-size: 12px !important;
  line-height: 1.38 !important;
}
.fd-account-page-status > div > small:last-child {
  margin-top: 6px !important;
  font-size: 10px !important;
}
.fd-account-page-card .fd-feature-card__head {
  margin-bottom: 10px !important;
}
.fd-account-page-card .fd-feature-card__head > span {
  padding: 5px 8px !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}
.fd-account-page-actions {
  gap: 7px !important;
  margin-top: 10px !important;
}
.fd-account-page-card :is(.fd-auth-primary,.fd-auth-secondary) {
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  padding: 0 12px !important;
  border-radius: 13px !important;
  font-size: 13px !important;
}
.fd-account-page-card .fd-auth-link {
  min-height: 30px !important;
  font-size: 11px !important;
}
.fd-account-page-card .fd-auth-switch {
  margin-bottom: 10px !important;
  border-radius: 13px !important;
}
.fd-account-page-card .fd-auth-switch button {
  min-height: 38px !important;
  border-radius: 9px !important;
  font-size: 12px !important;
}
.fd-account-page-card .fd-auth-form {
  gap: 9px !important;
}
.fd-account-page-card .fd-auth-form label {
  gap: 4px !important;
  font-size: 11px !important;
}
.fd-account-page-card .fd-auth-form input {
  height: 42px !important;
  min-height: 42px !important;
  border-radius: 13px !important;
  font-size: 14px !important;
}

/* Explicit cloud semantics in every account/tankbook status location. */
[data-cloud-tone="active"],
.fd-account-page-status[data-cloud-tone="active"] h2 {
  color: var(--fd-r107-mint) !important;
}
[data-cloud-tone="inactive"],
.fd-account-page-status[data-cloud-tone="inactive"] h2 {
  color: var(--fd-r107-red) !important;
}
[data-cloud-tone="error"],
.fd-account-page-status[data-cloud-tone="error"] h2 {
  color: var(--fd-r107-orange) !important;
}
.fd-account-page-card .fd-feature-card__head > span[data-cloud-tone="active"] {
  border: 1px solid color-mix(in srgb, var(--fd-r107-mint) 35%, transparent) !important;
  background: color-mix(in srgb, var(--fd-r107-mint) 11%, transparent) !important;
}
.fd-account-page-card .fd-feature-card__head > span[data-cloud-tone="inactive"] {
  border: 1px solid color-mix(in srgb, var(--fd-r107-red) 35%, transparent) !important;
  background: color-mix(in srgb, var(--fd-r107-red) 11%, transparent) !important;
}
.fd-account-page-card .fd-feature-card__head > span[data-cloud-tone="error"] {
  border: 1px solid color-mix(in srgb, var(--fd-r107-orange) 38%, transparent) !important;
  background: color-mix(in srgb, var(--fd-r107-orange) 12%, transparent) !important;
}

/* Live-data recovery actions remain compact and wrap safely. */
.live-error .fd-live-recovery-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.live-error .fd-live-location-button,
.live-error .refresh-pill {
  min-height: 38px !important;
  margin: 0 !important;
}
.live-error .fd-live-location-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 1px solid #ff3b30;
  border-radius: 999px;
  background: #ff3b30;
  color: #fff;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
}

/* ===== assets/r109-startup-stability.css ===== */
/* FuelDash R109 — keep one stable startup surface visible until the first render burst settles. */
html.fd-app-starting,
html.fd-app-starting body {
  overflow: hidden !important;
  background: var(--fd-page-bg, #050505) !important;
}

html.fd-app-starting #app {
  min-height: 100dvh;
  visibility: hidden;
}

html.fd-render-quiet :where(#app, #app *) {
  transition: none !important;
  animation: none !important;
  scroll-behavior: auto !important;
}

.fd-startup-cover {
  position: fixed;
  z-index: 2147483000;
  inset: 0;
  display: block;
  overflow: hidden;
  background: var(--fd-page-bg, #050505);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateZ(0);
  -webkit-font-smoothing: antialiased;
  contain: layout paint style;
}

.fd-startup-cover .fd-fast-shell {
  min-height: 100%;
  height: 100dvh;
  overflow: hidden;
}

.fd-startup-cover.is-leaving {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 160ms ease-out, visibility 0s linear 160ms;
}

html.fd-app-ready #app {
  visibility: visible;
}

html[data-fd-theme="light"] .fd-startup-cover {
  background: #f5f5f7;
}

html[data-fd-theme="light"] .fd-startup-cover .fd-fast-kicker,
html[data-fd-theme="light"] .fd-startup-cover .fd-fast-line {
  background: rgba(24,24,27,.11);
}

html[data-fd-theme="light"] .fd-startup-cover .fd-fast-title {
  background: rgba(24,24,27,.15);
}

html[data-fd-theme="light"] .fd-startup-cover .fd-fast-card {
  border-color: rgba(25,25,28,.10);
  background: rgba(255,255,255,.68);
}

html[data-fd-theme="light"] .fd-startup-cover .fd-fast-nav {
  border-color: rgba(25,25,28,.12);
  background: rgba(247,247,249,.90);
}

html[data-fd-theme="light"] .fd-startup-cover .fd-fast-nav span {
  color: rgba(25,25,28,.58);
}

html[data-fd-theme="light"] .fd-startup-cover .fd-fast-nav span:first-child {
  color: #ff3b30;
}

@media (prefers-reduced-motion: reduce) {
  .fd-startup-cover.is-leaving {
    transition-duration: 1ms;
  }
}

/* ===== assets/r113-ui-consolidation.css ===== */
/* FuelDash R113 — one control family, dashboard-like feature scrolling and uninterrupted theme surfaces. */
:root {
  --fd-r113-red: #ff3b30;
  --fd-r113-dark-bg: #050505;
  --fd-r113-light-bg: #f5f5f7;
  --fd-info-text: #9a9aa0;
  --fd-r113-glass-dark: linear-gradient(145deg, rgba(27,27,31,.88), rgba(8,8,11,.96));
  --fd-r113-glass-light: linear-gradient(145deg, rgba(255,255,255,.96), rgba(235,235,240,.80));
}
html[data-fd-theme="light"] { --fd-info-text: #6e6e73; }

html,
body {
  min-height: 100% !important;
  background: var(--fd-r113-dark-bg) !important;
}
html[data-fd-theme="light"],
html[data-fd-theme="light"] body {
  background: var(--fd-r113-light-bg) !important;
}
body.fd-feature-open {
  overflow: hidden !important;
  background: var(--fd-r113-dark-bg) !important;
}
html[data-fd-theme="light"] body.fd-feature-open {
  background: var(--fd-r113-light-bg) !important;
}

/* Profile, reload, back and close are one exact FuelDash glass component. */
:is(.fd-profile-button,.fd-app-reload,.fd-feature-back,.detail-close,.fd-alert-close,.fd-account-sheet__close) {
  box-sizing: border-box !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #2c2c31 !important;
  border-radius: 50% !important;
  background: var(--fd-r113-glass-dark) !important;
  color: #f7f7f8 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  outline: none !important;
  transition: none !important;
  animation: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  -webkit-tap-highlight-color: transparent !important;
}
:is(.fd-profile-button,.fd-app-reload,.fd-feature-back,.detail-close,.fd-alert-close,.fd-account-sheet__close) svg {
  display: block !important;
  width: 19px !important;
  height: 19px !important;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  transform-origin: 50% 50% !important;
}
html[data-fd-theme="light"] :is(.fd-profile-button,.fd-app-reload,.fd-feature-back,.detail-close,.fd-alert-close,.fd-account-sheet__close) {
  border-color: rgba(35,35,40,.16) !important;
  background: var(--fd-r113-glass-light) !important;
  color: #303036 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
}
:is(.fd-profile-button,.fd-app-reload,.fd-feature-back,.detail-close,.fd-alert-close,.fd-account-sheet__close):is(:focus,:focus-visible,:active) {
  outline: none !important;
  opacity: 1 !important;
  filter: none !important;
}
.fd-app-reload.is-reloading svg { animation: fd-r113-reload-spin .64s linear infinite !important; }
@keyframes fd-r113-reload-spin { to { transform: rotate(360deg); } }

/* All feature views use the same pattern as the dashboard: one page scroller; header is normal page content. */
.fd-feature-page,
.fd-feature-page[data-fd-feature-view="account"],
.fd-feature-page[data-fd-feature-view="tankbook"],
.fd-feature-page[data-fd-feature-view="appearance"] {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147482000 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
  background: var(--fd-r113-dark-bg) !important;
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
html[data-fd-theme="light"] .fd-feature-page {
  background: var(--fd-r113-light-bg) !important;
}
.fd-feature-page .fd-feature-shell,
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-shell,
.fd-feature-page[data-fd-feature-view="appearance"] .fd-feature-shell {
  display: block !important;
  box-sizing: border-box !important;
  width: min(100%, 480px) !important;
  height: auto !important;
  min-height: 100% !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 0 calc(28px + env(safe-area-inset-bottom)) !important;
  overflow: visible !important;
  background: var(--fd-r113-dark-bg) !important;
}
html[data-fd-theme="light"] .fd-feature-page .fd-feature-shell {
  background: var(--fd-r113-light-bg) !important;
}
.fd-feature-page .fd-feature-header {
  position: relative !important;
  top: auto !important;
  z-index: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 38px !important;
  grid-template-rows: auto !important;
  align-items: start !important;
  gap: 12px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: calc(18px + env(safe-area-inset-top)) 16px 18px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.fd-feature-page .fd-feature-heading {
  grid-column: 1 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  padding: 0 !important;
}
.fd-feature-page .fd-feature-header > .fd-feature-back {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: start !important;
}
.fd-feature-page .fd-feature-content,
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-content,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content,
.fd-feature-page[data-fd-feature-view="appearance"] .fd-feature-content {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 16px !important;
  overflow: visible !important;
  background: transparent !important;
  overscroll-behavior: auto !important;
}

/* Mein FuelDash header/title are part of the same scroller and never sticky. */
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header {
  position: relative !important;
  top: auto !important;
  z-index: auto !important;
  box-sizing: border-box !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: calc(18px + env(safe-area-inset-top)) 16px 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-title {
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 4px 16px 14px !important;
  background: transparent !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page {
  min-height: 0 !important;
  padding-bottom: 0 !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="account"] .brand-wordmark > span {
  color: #151517 !important;
}
.fd-feature-page[data-fd-feature-view="account"] .brand-wordmark > strong {
  color: #ff3b30 !important;
}

/* Defensive removal: cloud/account stays in Mein FuelDash, not below the tankbook. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tankbook-cloud-row { display: none !important; }

/* Same selected red outline in both themes. */
.fd-theme-choice.is-selected {
  border-color: #ff3b30 !important;
  box-shadow: inset 0 0 0 1px rgba(255,59,48,.22), 0 12px 30px rgba(0,0,0,.10) !important;
}
html[data-fd-theme="light"] .fd-theme-choice.is-selected {
  border-color: #ff3b30 !important;
  box-shadow: inset 0 0 0 1px rgba(255,59,48,.22), 0 12px 30px rgba(35,35,42,.10) !important;
}

/* Price alert header participates in the sheet scroll and all info copy matches FuelDash helper typography. */
.fd-alert-sheet {
  padding-top: max(14px, env(safe-area-inset-top)) !important;
  padding-bottom: calc(26px + env(safe-area-inset-bottom)) !important;
  background: var(--fd-r113-dark-bg) !important;
}
html[data-fd-theme="light"] .fd-alert-sheet { background: var(--fd-r113-light-bg) !important; }
.fd-alert-head {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 38px !important;
  margin: 0 0 14px !important;
  padding: 0 2px 12px !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(255,255,255,.055) !important;
}
html[data-fd-theme="light"] .fd-alert-head { border-bottom-color: rgba(20,20,24,.08) !important; }
.fd-alert-note,
.fd-alert-status {
  color: var(--fd-info-text) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}
.fd-alert-row small,
.fd-alert-station small,
.fd-alert-station-section header small,
.fd-alert-empty {
  color: var(--fd-info-text) !important;
  line-height: 1.4 !important;
  font-weight: 400 !important;
}

/* Exact active FuelDash red for account primary actions. */
.fd-feature-page[data-fd-feature-view="account"] :is(.fd-auth-primary,.fd-auth-switch button.is-active,button[type="submit"].fd-auth-primary),
.fd-account-sheet :is(.fd-auth-primary,.fd-auth-switch button.is-active) {
  border-color: #ff3b30 !important;
  background: #ff3b30 !important;
  background-image: none !important;
  color: #fff !important;
}

/* Initial navigation already shows the final icon family. */
.fd-fast-nav > span {
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 4px !important;
  min-width: 0 !important;
}
.fd-fast-nav > span > svg {
  width: 21px !important;
  height: 21px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.fd-fast-nav > span > span { font-size: 11px !important; line-height: 1 !important; }

@media (max-width: 390px) {
  .fd-feature-page .fd-feature-header { padding-inline: 14px !important; }
  .fd-feature-page .fd-feature-content { padding-inline: 14px !important; }
  .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header,
  .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-title { padding-inline: 14px !important; }
}

/* Canonical single-selector aliases used by diagnostics and future releases. */
.fd-feature-page { overflow-y: auto !important; }
.fd-feature-shell { min-height: 100% !important; }
.fd-feature-header { position: relative !important; }
.fd-feature-content { overflow: visible !important; }

/* High-specificity guard against legacy feature/modal geometry. */
.fd-feature-page :is(.fd-feature-back,.fd-app-reload),
.fd-alert-modal .fd-alert-close,
.fd-account-sheet .fd-account-sheet__close,
.fd-startup-cover .fd-app-reload,
#app :is(.fd-profile-button,.fd-app-reload,.detail-close) {
  box-sizing: border-box !important;
  flex-basis: 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  border-width: 1px !important;
  border-radius: 50% !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header :is(.fd-app-reload,.fd-feature-back,.detail-close) {
  box-sizing: border-box !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  border-width: 1px !important;
  border-radius: 50% !important;
}
#app .brand-header .round-button.detail-close,
.fd-account-sheet .fd-account-sheet__panel > header > .fd-account-sheet__close {
  box-sizing: border-box !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  border-width: 1px !important;
  border-radius: 50% !important;
  background: var(--fd-r113-glass-dark) !important;
  color: #f7f7f8 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}
#app .brand-header .round-button.detail-close svg,
.fd-account-sheet .fd-account-sheet__panel > header > .fd-account-sheet__close svg {
  width: 19px !important;
  height: 19px !important;
  stroke-width: 1.9 !important;
}
html[data-fd-theme="light"] #app .brand-header .round-button.detail-close,
html[data-fd-theme="light"] .fd-account-sheet .fd-account-sheet__panel > header > .fd-account-sheet__close {
  border-color: rgba(35,35,40,.16) !important;
  background: var(--fd-r113-glass-light) !important;
  color: #303036 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
}

/* ===== assets/r117-ui-refinement.css ===== */
/* FuelDash R114 — focused visual refinement on top of the verified R113 behavior. */
:root {
  --fd-r114-red: #ff3b30;
  --fd-r114-mint: #30d158;
  --fd-r114-orange: #ff9f43;
  --fd-r114-gap: 16px;
  --fd-r114-glass-dark: linear-gradient(145deg, rgba(27,27,31,.88), rgba(8,8,11,.96));
  --fd-r114-glass-light: linear-gradient(145deg, rgba(255,255,255,.96), rgba(235,235,240,.80));
}

/* Startup: no floating spinner. The unlabelled skeleton surfaces carry the loading motion. */
.fd-startup-cover .fd-fast-card {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.fd-startup-cover .fd-fast-card::after {
  position: absolute;
  z-index: 0;
  inset: 0;
  content: '';
  pointer-events: none;
  background: linear-gradient(105deg, transparent 20%, rgba(255,255,255,.075) 43%, rgba(255,255,255,.13) 50%, rgba(255,255,255,.075) 57%, transparent 80%);
  transform: translateX(-115%);
  animation: fd-r114-skeleton-sweep 1.65s cubic-bezier(.4,0,.2,1) infinite;
}
.fd-startup-cover :is(.fd-fast-line,.fd-fast-kicker,.fd-fast-title) {
  position: relative;
  z-index: 1;
  background-size: 220% 100% !important;
  background-image: linear-gradient(100deg, rgba(255,255,255,.09) 22%, rgba(255,255,255,.18) 46%, rgba(255,255,255,.09) 70%) !important;
  animation: fd-r114-skeleton-shimmer 1.65s ease-in-out infinite;
}
.fd-startup-cover .fd-fast-line.is-price {
  background-image: linear-gradient(100deg, rgba(255,59,48,.18) 22%, rgba(255,59,48,.34) 46%, rgba(255,59,48,.18) 70%) !important;
}
html[data-fd-theme="light"] .fd-startup-cover :is(.fd-fast-line,.fd-fast-kicker,.fd-fast-title) {
  background-image: linear-gradient(100deg, rgba(24,24,27,.08) 22%, rgba(24,24,27,.17) 46%, rgba(24,24,27,.08) 70%) !important;
}
html[data-fd-theme="light"] .fd-startup-cover .fd-fast-line.is-price {
  background-image: linear-gradient(100deg, rgba(255,59,48,.14) 22%, rgba(255,59,48,.28) 46%, rgba(255,59,48,.14) 70%) !important;
}
@keyframes fd-r114-skeleton-sweep {
  from { transform: translateX(-115%); }
  to { transform: translateX(115%); }
}
@keyframes fd-r114-skeleton-shimmer {
  from { background-position: 115% 0; }
  to { background-position: -115% 0; }
}

/* All round header controls use the exact profile-button component, regardless of view. */
:is(.fd-profile-button,.fd-app-reload,.fd-feature-back,.detail-close,.fd-alert-close,.fd-account-sheet__close) {
  box-sizing: border-box !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #2c2c31 !important;
  border-radius: 50% !important;
  background: var(--fd-r114-glass-dark) !important;
  color: #f7f7f8 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
  outline: 0 !important;
  opacity: 1 !important;
  filter: none !important;
  transition: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
:is(.fd-profile-button,.fd-app-reload,.fd-feature-back,.detail-close,.fd-alert-close,.fd-account-sheet__close) svg {
  display: block !important;
  width: 19px !important;
  height: 19px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
html[data-fd-theme="light"] :is(.fd-profile-button,.fd-app-reload,.fd-feature-back,.detail-close,.fd-alert-close,.fd-account-sheet__close) {
  border-color: rgba(35,35,40,.16) !important;
  background: var(--fd-r114-glass-light) !important;
  color: #303036 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
}

/* Account: dashboard rhythm, one coherent glass card, and unambiguous status tones. */
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page {
  display: grid !important;
  gap: 16px !important;
}
.fd-feature-page[data-fd-feature-view="account"] :is(.fd-account-page-status,.fd-account-page-card) {
  box-sizing: border-box !important;
  padding: 18px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 22px !important;
  background: var(--fd-r114-glass-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055), 0 18px 42px rgba(0,0,0,.27) !important;
  -webkit-backdrop-filter: blur(28px) saturate(130%) !important;
  backdrop-filter: blur(28px) saturate(130%) !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="account"] :is(.fd-account-page-status,.fd-account-page-card) {
  border-color: rgba(30,30,35,.10) !important;
  background: var(--fd-r114-glass-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 16px 38px rgba(35,35,42,.10) !important;
}
html:not([data-fd-theme="light"]) .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status[data-cloud-tone="inactive"] h2 {
  color: #fff !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status[data-cloud-tone="inactive"] h2 {
  color: #171719 !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status[data-cloud-tone="active"] h2 { color: var(--fd-r114-mint) !important; }
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status[data-cloud-tone="error"] h2 { color: var(--fd-r114-orange) !important; }
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-card .fd-feature-card__head { margin-bottom: var(--fd-r114-gap) !important; }
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-card .fd-auth-switch {
  margin: 0 0 var(--fd-r114-gap) !important;
  padding: 4px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  background: linear-gradient(145deg, rgba(40,40,45,.80), rgba(23,23,27,.86)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055) !important;
  -webkit-backdrop-filter: blur(18px) saturate(120%) !important;
  backdrop-filter: blur(18px) saturate(120%) !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-card .fd-auth-form {
  display: grid !important;
  gap: 16px !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-card .fd-auth-form > label {
  display: grid !important;
  gap: 8px !important;
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-card .fd-auth-form input {
  border: 1px solid rgba(255,255,255,.10) !important;
  background: linear-gradient(145deg, rgba(45,45,50,.88), rgba(31,31,36,.90)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  backdrop-filter: blur(16px) !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-card .fd-auth-form-status:empty { display: none !important; }
.fd-feature-page[data-fd-feature-view="account"] :is(.fd-account-page-actions,.fd-account-page-actions--stack,.fd-account-signed-in) {
  display: grid !important;
  gap: 16px !important;
}
.fd-feature-page[data-fd-feature-view="account"] .fd-account-page-card .fd-auth-link {
  margin: 0 !important;
  min-height: 38px !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-card .fd-auth-switch {
  border-color: rgba(35,35,40,.14) !important;
  background: linear-gradient(145deg, rgba(246,246,248,.96), rgba(227,227,232,.88)) !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-card .fd-auth-form input {
  border-color: rgba(35,35,40,.14) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(235,235,240,.92)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98) !important;
}

/* Appearance: every card-to-card interval follows the same dashboard rhythm. */
.fd-feature-page[data-fd-feature-view="appearance"] .fd-feature-content {
  display: grid !important;
  gap: 16px !important;
}
.fd-feature-page[data-fd-feature-view="appearance"] .fd-theme-options {
  display: grid !important;
  gap: 16px !important;
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="appearance"] .fd-feature-note { margin: 0 !important; padding-top: 2px !important; }

/* Price-alert status: same geometry as the alert cards and explicit operational tone. */
.fd-alert-status {
  box-sizing: border-box !important;
  margin: 0 0 12px !important;
  padding: 14px !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 16px !important;
  background: linear-gradient(145deg, rgba(25,25,29,.86), rgba(8,8,10,.92)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.035) !important;
  -webkit-backdrop-filter: blur(18px) saturate(120%) !important;
  backdrop-filter: blur(18px) saturate(120%) !important;
}
.fd-alert-status[data-tone="active"] { color: #30d158 !important; border-color: rgba(48,209,88,.28) !important; }
.fd-alert-status[data-tone="inactive"] { color: #ff3b30 !important; border-color: rgba(255,59,48,.28) !important; }
.fd-alert-status[data-tone="error"] { color: #ff9f43 !important; border-color: rgba(255,159,67,.30) !important; }
.fd-alert-status[data-tone="pending"] { color: #ff9f43 !important; border-color: rgba(255,159,67,.24) !important; }
html[data-fd-theme="light"] .fd-alert-status {
  border-color: rgba(35,35,40,.12) !important;
  background: var(--fd-r114-glass-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 12px 28px rgba(35,35,42,.08) !important;
}

@media (prefers-reduced-motion: reduce) {
  .fd-startup-cover .fd-fast-card::after,
  .fd-startup-cover :is(.fd-fast-line,.fd-fast-kicker,.fd-fast-title) { animation: none !important; }
}

/* Context-specific final guard: legacy release selectors must not visually fork the shared control. */
html body #app .brand-header :is(.fd-profile-button,.fd-app-reload,.round-button.detail-close),
html body:not(#fd-r114-control-scope) .fd-feature-page[data-fd-feature-view] .fd-feature-header .fd-feature-back,
html body:not(#fd-r114-control-scope) .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header :is(.fd-profile-button,.fd-app-reload,.fd-feature-back,.detail-close),
html body:not(#fd-r114-control-scope) .fd-alert-modal .fd-alert-sheet .fd-alert-head .fd-alert-close,
html body:not(#fd-r114-control-scope) .fd-account-sheet .fd-account-sheet__panel > header > .fd-account-sheet__close,
html body:not(#fd-r114-control-scope) .fd-startup-cover .fd-fast-header .fd-app-reload {
  box-sizing: border-box !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #2c2c31 !important;
  border-radius: 50% !important;
  background: var(--fd-r114-glass-dark) !important;
  color: #f7f7f8 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}
html[data-fd-theme="light"] body #app .brand-header :is(.fd-profile-button,.fd-app-reload,.round-button.detail-close),
html[data-fd-theme="light"] body:not(#fd-r114-control-scope) .fd-feature-page[data-fd-feature-view] .fd-feature-header .fd-feature-back,
html[data-fd-theme="light"] body:not(#fd-r114-control-scope) .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header :is(.fd-profile-button,.fd-app-reload,.fd-feature-back,.detail-close),
html[data-fd-theme="light"] body:not(#fd-r114-control-scope) .fd-alert-modal .fd-alert-sheet .fd-alert-head .fd-alert-close,
html[data-fd-theme="light"] body:not(#fd-r114-control-scope) .fd-account-sheet .fd-account-sheet__panel > header > .fd-account-sheet__close,
html[data-fd-theme="light"] body:not(#fd-r114-control-scope) .fd-startup-cover .fd-fast-header .fd-app-reload {
  border-color: rgba(35,35,40,.16) !important;
  background: var(--fd-r114-glass-light) !important;
  color: #303036 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
}

/* Status-tone guard against older theme selectors with stronger :is() specificity. */
html body:not(#fd-r114-status-scope) .fd-alert-modal .fd-alert-status[data-tone="active"] { color: #30d158 !important; border-color: rgba(48,209,88,.28) !important; }
html body:not(#fd-r114-status-scope) .fd-alert-modal .fd-alert-status[data-tone="inactive"] { color: #ff3b30 !important; border-color: rgba(255,59,48,.28) !important; }
html body:not(#fd-r114-status-scope) .fd-alert-modal .fd-alert-status[data-tone="error"] { color: #ff9f43 !important; border-color: rgba(255,159,67,.30) !important; }
html body:not(#fd-r114-status-scope) .fd-alert-modal .fd-alert-status[data-tone="pending"] { color: #ff9f43 !important; border-color: rgba(255,159,67,.24) !important; }


/* FuelDash R115 — spacing polish, dot-only refresh status, and tankbook cleanup. */

/* Header update hint: dot only, no visible text. */
#app .header-background-status {
  min-height: 10px !important;
  min-width: 10px !important;
  width: 10px !important;
  padding: 0 !important;
  gap: 0 !important;
  line-height: 0 !important;
  font-size: 0 !important;
}
#app .header-background-status b,
#app .header-background-status::before,
#app .header-background-status::after {
  display: none !important;
  content: none !important;
}
#app .header-background-status i {
  width: 10px !important;
  height: 10px !important;
  display: block !important;
}

/* Shared dashboard rhythm for Darstellung and Tankbuch content areas. */
.fd-feature-page[data-fd-feature-view="appearance"] .fd-feature-content,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content {
  display: grid !important;
  align-content: start !important;
  gap: 16px !important;
  padding: 16px 16px calc(28px + env(safe-area-inset-bottom)) !important;
}
.fd-feature-page[data-fd-feature-view="appearance"] .fd-feature-content > *,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content > * {
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="appearance"] .fd-theme-options {
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="appearance"] .fd-feature-note,
.fd-feature-page[data-fd-feature-view="appearance"] [data-fd-appearance-status] {
  display: none !important;
}

/* Appearance preview thumbnails: always readable, no extra HELL/DUNKEL label. */
.fd-theme-preview__top b,
.fd-theme-preview__top .fd-theme-preview__fuel {
  color: #ffffff !important;
}
.fd-theme-preview.is-light .fd-theme-preview__top b,
.fd-theme-preview.is-light .fd-theme-preview__top .fd-theme-preview__fuel {
  color: #151517 !important;
}
.fd-theme-preview__top strong {
  color: #ff3b30 !important;
}
.fd-theme-preview__label {
  display: none !important;
}

/* Tankbuch: even card spacing above/below each block, including below the header divider. */
.fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-month-card,.fd-cloud-card,.fd-backup-card,.fd-tank-history,.fd-overall-card,.fd-tank-form-card,.fd-account-card) {
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form {
  gap: 16px 16px !important;
  margin-top: 16px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  isolation: auto !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras[open],
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras[open] > div {
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary {
  min-height: 40px !important;
  padding: 0 30px 0 0 !important;
  -webkit-tap-highlight-color: transparent !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px 16px !important;
  padding-top: 16px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras .fd-field:last-child {
  grid-column: 1 / -1 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-form-status,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-status {
  margin: 0 !important;
}

/* Monthly statistics: more compact red-tinted date control matching the site language. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  gap: 16px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
  justify-items: end !important;
  gap: 6px !important;
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  width: 136px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 10px 0 32px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(255,59,48,.28) !important;
  background: rgba(255,59,48,.12) !important;
  color: inherit !important;
  box-shadow: inset 0 1px rgba(255,255,255,.04) !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control > svg {
  left: 10px !important;
  width: 15px !important;
  height: 15px !important;
  color: #ff3b30 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__label,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control input {
  font-size: 12px !important;
  font-weight: 650 !important;
  letter-spacing: -.01em !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control input {
  height: 34px !important;
  min-height: 34px !important;
  text-align: center !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  border-color: rgba(255,59,48,.24) !important;
  background: rgba(255,59,48,.10) !important;
  color: #171719 !important;
}
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  border-color: rgba(255,59,48,.30) !important;
  background: rgba(255,59,48,.14) !important;
  color: #f7f7f8 !important;
}

@media (max-width: 520px) {
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form,
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div,
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
    justify-items: start !important;
  }
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
    width: 136px !important;
  }
}

/* ===== assets/r117-ui-polish.css ===== */
/* FuelDash R115 — final UI rhythm and preview corrections without regressing R114 behavior. */
:root {
  --fd-r115-gap: 16px;
  --fd-r115-red: #ff3b30;
  --fd-r115-red-soft-dark: linear-gradient(145deg, rgba(255,59,48,.18), rgba(64,11,14,.30));
  --fd-r115-red-soft-light: linear-gradient(145deg, rgba(255,59,48,.10), rgba(255,255,255,.82));
}

/* Header background update indicator: red dot only, no label. */
#app .header-background-status {
  min-width: 9px !important;
  min-height: 28px !important;
  gap: 0 !important;
  font-size: 0 !important;
}
#app .header-background-status b {
  display: none !important;
}
#app .header-background-status i {
  margin: 0 !important;
}

/* Appearance and Tankbuch follow the dashboard card rhythm, including top spacing below the divider. */
.fd-feature-page[data-fd-feature-view="appearance"] .fd-feature-content,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content {
  display: grid !important;
  gap: var(--fd-r115-gap) !important;
  padding-top: var(--fd-r115-gap) !important;
  padding-bottom: var(--fd-r115-gap) !important;
}
.fd-feature-page[data-fd-feature-view="appearance"] .fd-feature-content > *,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content > * {
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="appearance"] .fd-theme-options {
  gap: var(--fd-r115-gap) !important;
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="appearance"] .fd-feature-note {
  display: none !important;
}

/* Preview cards: keep Fuel readable in both modes and remove redundant preview labels. */
.fd-theme-preview__top b {
  color: #fff !important;
}
.fd-theme-preview.is-light .fd-theme-preview__top b {
  color: #151517 !important;
}
.fd-theme-preview__top strong {
  color: var(--fd-r115-red) !important;
}
.fd-theme-preview__label {
  display: none !important;
}

/* Tankbuch: evenly spaced cards and consistent head/body rhythm. */
.fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-feature-card,.fd-theme-choice,.fd-tank-history,.fd-tankbook-cloud-row,.fd-account-card) {
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-card__head {
  margin-bottom: var(--fd-r115-gap) !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form {
  margin-top: 0 !important;
  gap: 14px 12px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-summary,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-grid,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-account-card__manager {
  margin-top: var(--fd-r115-gap) !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-card,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-cloud-card,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-card {
  margin-bottom: 0 !important;
}

/* Additional fields expansion: no iOS dark tap veil / overlay. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-card,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary {
  background: transparent !important;
  box-shadow: none !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary {
  -webkit-tap-highlight-color: transparent !important;
  -webkit-touch-callout: none !important;
  outline: none !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary:focus,
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary:active {
  background: transparent !important;
}

/* Monthly statistics date control: smaller and aligned to the FuelDash red glass control style. */
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
  gap: 12px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
  gap: 5px !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  width: 132px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 10px 0 29px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(255,59,48,.26) !important;
  background: var(--fd-r115-red-soft-dark) !important;
  color: #ffd9d6 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.04) !important;
  -webkit-backdrop-filter: blur(16px) saturate(120%) !important;
  backdrop-filter: blur(16px) saturate(120%) !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control > svg {
  left: 10px !important;
  width: 14px !important;
  height: 14px !important;
  color: currentColor !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__label {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: currentColor !important;
}
.fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control input {
  height: 34px !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  background: var(--fd-r115-red-soft-light) !important;
  color: #b22b24 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.82), 0 8px 18px rgba(255,59,48,.08) !important;
}

@media (max-width: 360px) {
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
    width: 124px !important;
  }
}


/* FuelDash R117 — glass alignment, preview fidelity, light-mode color parity. */
:root {
  --fd-r117-red: #ff3b30;
  --fd-r117-mint: #30d158;
  --fd-r117-glass-dark: linear-gradient(145deg, rgba(24,24,28,.90), rgba(7,7,9,.94));
  --fd-r117-glass-light: linear-gradient(145deg, rgba(255,255,255,.98), rgba(237,237,242,.92));
  --fd-r117-gap: 16px;
}

/* Appearance cards and tankbook keep dashboard-like vertical rhythm. */
.fd-feature-page[data-fd-feature-view=appearance] .fd-feature-content,
.fd-feature-page[data-fd-feature-view=tankbook] .fd-feature-content,
.fd-alert-modal .fd-alert-grid {
  gap: var(--fd-r117-gap) !important;
}
.fd-feature-page[data-fd-feature-view=appearance] .fd-feature-card,
.fd-feature-page[data-fd-feature-view=appearance] .fd-theme-choice,
.fd-feature-page[data-fd-feature-view=tankbook] .fd-feature-card,
.fd-feature-page[data-fd-feature-view=tankbook] .fd-theme-choice,
.fd-feature-page[data-fd-feature-view=tankbook] .fd-tank-history,
.fd-feature-page[data-fd-feature-view=tankbook] .fd-account-card {
  margin: 0 !important;
}
.fd-feature-page[data-fd-feature-view=appearance] .fd-feature-card { margin-top: 0 !important; }
.fd-feature-page[data-fd-feature-view=appearance] .fd-feature-content > :first-child,
.fd-feature-page[data-fd-feature-view=tankbook] .fd-feature-content > :first-child { margin-top: 0 !important; }

/* Strong preview fidelity: Fuel/Dash colors per selected example. */
.fd-theme-preview__top b {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
  font-weight: 760 !important;
  letter-spacing: 0 !important;
}
.fd-theme-preview__top .fd-theme-preview__fuel {
  color: #ffffff !important;
  opacity: 1 !important;
}
.fd-theme-preview.is-light .fd-theme-preview__top .fd-theme-preview__fuel {
  color: #151517 !important;
}
.fd-theme-preview__top strong { color: var(--fd-r117-red) !important; }
.fd-theme-choice__copy small { display: block !important; }

/* Tankbuch date control: still compact, but no longer cramped. */
.fd-feature-page[data-fd-feature-view=tankbook] .fd-month-head {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
}
.fd-feature-page[data-fd-feature-view=tankbook] .fd-statistics-date {
  align-self: flex-end !important;
  gap: 6px !important;
}
.fd-feature-page[data-fd-feature-view=tankbook] .fd-statistics-date__control {
  width: 172px !important;
  min-width: 172px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 12px 0 34px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,59,48,.22) !important;
  background: linear-gradient(145deg, rgba(255,59,48,.10), rgba(255,255,255,.72)) !important;
  color: #b23d37 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.74) !important;
}
html[data-fd-theme=dark] .fd-feature-page[data-fd-feature-view=tankbook] .fd-statistics-date__control {
  background: linear-gradient(145deg, rgba(255,59,48,.18), rgba(57,13,16,.30)) !important;
  color: #ffe3e0 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.05) !important;
}
.fd-feature-page[data-fd-feature-view=tankbook] .fd-statistics-date__control > svg {
  left: 12px !important;
  width: 15px !important;
  height: 15px !important;
}
.fd-feature-page[data-fd-feature-view=tankbook] .fd-statistics-date__label {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: -.01em !important;
}

/* Remove any dark tap veil when expanding additional fields. */
.fd-feature-page[data-fd-feature-view=tankbook] details,
.fd-feature-page[data-fd-feature-view=tankbook] details[open],
.fd-feature-page[data-fd-feature-view=tankbook] details > div,
.fd-feature-page[data-fd-feature-view=tankbook] details summary,
.fd-feature-page[data-fd-feature-view=tankbook] details summary::marker,
.fd-feature-page[data-fd-feature-view=tankbook] details summary::-webkit-details-marker {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Price alert modal aligned to appearance/tankbook glass cards. */
.fd-alert-head {
  padding: 8px 2px 16px !important;
  background: linear-gradient(180deg, rgba(5,5,5,.98) 76%, rgba(5,5,5,0)) !important;
  -webkit-backdrop-filter: blur(22px) saturate(130%) !important;
  backdrop-filter: blur(22px) saturate(130%) !important;
}
.fd-alert-status,
.fd-alert-row,
.fd-alert-station,
.fd-alert-empty {
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: var(--fd-r117-glass-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.05) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
}
.fd-alert-row { padding: 15px 16px !important; }
.fd-alert-row small,
.fd-alert-note,
.fd-alert-station small,
.fd-alert-station-section header small { color: #8e8e93 !important; font-size: 12px !important; }
.fd-alert-row select,
.fd-alert-row input[type=time],
.fd-alert-row input[type=number] {
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  background: linear-gradient(145deg, rgba(44,44,48,.88), rgba(27,27,31,.92)) !important;
}
html[data-fd-theme=light] .fd-alert-modal {
  background: #efeff2 !important;
}
html[data-fd-theme=light] .fd-alert-head {
  background: linear-gradient(180deg, rgba(239,239,242,.98) 76%, rgba(239,239,242,0)) !important;
}
html[data-fd-theme=light] .fd-alert-status,
html[data-fd-theme=light] .fd-alert-row,
html[data-fd-theme=light] .fd-alert-station,
html[data-fd-theme=light] .fd-alert-empty {
  border-color: rgba(35,35,40,.12) !important;
  background: var(--fd-r117-glass-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.96), 0 9px 22px rgba(35,35,42,.08) !important;
  color: #17171b !important;
}
html[data-fd-theme=light] .fd-alert-row small,
html[data-fd-theme=light] .fd-alert-note,
html[data-fd-theme=light] .fd-alert-station small,
html[data-fd-theme=light] .fd-alert-station-section header small,
html[data-fd-theme=light] .fd-alert-status { color: #6c6c74 !important; }
html[data-fd-theme=light] .fd-alert-row select,
html[data-fd-theme=light] .fd-alert-row input[type=time],
html[data-fd-theme=light] .fd-alert-row input[type=number] {
  color: #17171b !important;
  border-color: rgba(35,35,40,.14) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(237,237,242,.92)) !important;
}

/* Light mode: enforce the same mint/red price semantics as dark mode everywhere. */
html[data-fd-theme=light] #app :is(.price-change.is-lower, .fd-best__trend.is-lower, .fd-best__trend.is-lower i) {
  color: var(--fd-r117-mint) !important;
  fill: var(--fd-r117-mint) !important;
  stroke: var(--fd-r117-mint) !important;
  text-shadow: none !important;
}
html[data-fd-theme=light] #app :is(.price-change.is-higher, .fd-best__trend.is-higher, .fd-best__trend.is-higher i) {
  color: var(--fd-r117-red) !important;
  fill: var(--fd-r117-red) !important;
  stroke: var(--fd-r117-red) !important;
  text-shadow: none !important;
}
html[data-fd-theme=light] #app :is(.price-change.is-neutral, .fd-best__trend.is-steady, .fd-best__trend.is-steady i) {
  color: #77777f !important;
  fill: #77777f !important;
  stroke: #77777f !important;
  text-shadow: none !important;
}

/* R117 final cascade guards: the rules below intentionally outrank legacy light-mode !important selectors. */
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="appearance"] .fd-theme-preview.is-dark .fd-theme-preview__top .fd-theme-preview__fuel {
  color: #ffffff !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="appearance"] .fd-theme-preview.is-light .fd-theme-preview__top .fd-theme-preview__fuel {
  color: #151517 !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="appearance"] .fd-theme-preview .fd-theme-preview__top strong,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="appearance"] .fd-theme-preview .fd-theme-preview__top strong {
  color: #ff3b30 !important;
}

/* Exact dark/light price-color parity, with higher specificity than the R106 compatibility layer. */
html[data-fd-theme="light"] body #app .station-value .price-change.is-lower,
html[data-fd-theme="light"] body #app .fd-best__trend.is-lower,
html[data-fd-theme="light"] body #app .fd-best__trend.is-lower i {
  color: #30d158 !important;
  fill: #30d158 !important;
  stroke: #30d158 !important;
  text-shadow: none !important;
}
html[data-fd-theme="light"] body #app .station-value .price-change.is-higher,
html[data-fd-theme="light"] body #app .fd-best__trend.is-higher,
html[data-fd-theme="light"] body #app .fd-best__trend.is-higher i {
  color: #ff3b30 !important;
  fill: #ff3b30 !important;
  stroke: #ff3b30 !important;
  text-shadow: none !important;
}

/* One visual system for Darstellung, Tankbuch and Preisalarm major cards. */
.fd-feature-page[data-fd-feature-view="appearance"] :is(.fd-feature-card,.fd-theme-choice),
.fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-feature-card,.fd-tank-history,.fd-account-card),
.fd-alert-modal :is(.fd-alert-status,.fd-alert-row,.fd-alert-station,.fd-alert-empty) {
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 22px !important;
  background: linear-gradient(145deg, rgba(22,22,25,.94), rgba(9,9,11,.97)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055), 0 16px 36px rgba(0,0,0,.22) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="appearance"] :is(.fd-feature-card,.fd-theme-choice),
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-feature-card,.fd-tank-history,.fd-account-card),
html[data-fd-theme="light"] .fd-alert-modal :is(.fd-alert-status,.fd-alert-row,.fd-alert-station,.fd-alert-empty) {
  border-color: rgba(35,35,40,.12) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(240,240,244,.94)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 12px 30px rgba(35,35,42,.09) !important;
}

/* Matching secondary glass controls inside Tankbuch and Preisalarm. */
.fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-tank-summary article,.fd-month-grid article,.fd-tank-entry,.fd-tank-empty,.fd-backup-actions button),
.fd-alert-modal :is(select,input[type="time"],input[type="number"]) {
  border: 1px solid rgba(255,255,255,.09) !important;
  background: linear-gradient(145deg, rgba(43,43,48,.88), rgba(25,25,29,.92)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.04) !important;
}
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-tank-summary article,.fd-month-grid article,.fd-tank-entry,.fd-tank-empty,.fd-backup-actions button),
html[data-fd-theme="light"] .fd-alert-modal :is(select,input[type="time"],input[type="number"]) {
  border-color: rgba(35,35,40,.13) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(237,237,242,.94)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98) !important;
}

/* ===== assets/r119-consistency.css ===== */
/* FuelDash R119 — component-scoped consistency system based on the accepted Tankbuch language. */
:root {
  --fd-r119-page-dark: #050505;
  --fd-r119-page-light: #f5f5f7;
  --fd-r119-card-dark: linear-gradient(145deg, rgba(22,22,25,.94), rgba(9,9,11,.97));
  --fd-r119-card-light: linear-gradient(145deg, rgba(255,255,255,.97), rgba(235,235,240,.91));
  --fd-r119-tile-dark: linear-gradient(145deg, rgba(43,43,48,.88), rgba(25,25,29,.92));
  --fd-r119-tile-light: linear-gradient(145deg, rgba(255,255,255,.98), rgba(230,230,235,.90));
  --fd-r119-control-dark: linear-gradient(145deg, rgba(45,45,50,.84), rgba(24,24,28,.91));
  --fd-r119-control-light: linear-gradient(145deg, rgba(255,255,255,.98), rgba(231,231,236,.90));
  --fd-r119-red-glass: linear-gradient(145deg, rgba(255,59,48,.88), rgba(181,28,24,.77));
  --fd-r119-red-glass-light: linear-gradient(145deg, rgba(255,59,48,.90), rgba(220,43,36,.80));
  --fd-r119-border-dark: rgba(255,255,255,.09);
  --fd-r119-border-light: rgba(35,35,40,.13);
  --fd-r119-card-shadow-dark: inset 0 1px rgba(255,255,255,.055), 0 16px 36px rgba(0,0,0,.22);
  --fd-r119-card-shadow-light: inset 0 1px rgba(255,255,255,.98), 0 12px 30px rgba(35,35,42,.09);
  --fd-r119-control-shadow-dark: inset 0 1px rgba(255,255,255,.05), 0 8px 20px rgba(0,0,0,.15);
  --fd-r119-control-shadow-light: inset 0 1px rgba(255,255,255,.98), 0 8px 18px rgba(35,35,42,.07);
  --fd-r119-radius-card: 22px;
  --fd-r119-radius-tile: 16px;
  --fd-r119-radius-control: 14px;
  --fd-r119-gap: 16px;
  --fd-r119-red: #ff3b30;
  --fd-r119-mint: #30d158;
  --fd-r119-orange: #ff9f43;
  --fd-r119-text-dark: #f7f7f8;
  --fd-r119-text-light: #171719;
  --fd-r119-muted-dark: #99999f;
  --fd-r119-muted-light: #6f6f77;
}

/* Page backgrounds are continuous; structural wrappers never paint an extra layer. */
html[data-fd-theme="dark"],
html[data-fd-theme="dark"] body,
html[data-fd-theme="dark"] #app,
html[data-fd-theme="dark"] #app .app-shell,
html[data-fd-theme="dark"] #app .app-content,
html[data-fd-theme="dark"] .fd-feature-page,
html[data-fd-theme="dark"] .fd-feature-shell,
html[data-fd-theme="dark"] .fd-feature-content,
html[data-fd-theme="dark"] .fd-alert-modal {
  background-color: var(--fd-r119-page-dark) !important;
}
html[data-fd-theme="light"],
html[data-fd-theme="light"] body,
html[data-fd-theme="light"] #app,
html[data-fd-theme="light"] #app .app-shell,
html[data-fd-theme="light"] #app .app-content,
html[data-fd-theme="light"] .fd-feature-page,
html[data-fd-theme="light"] .fd-feature-shell,
html[data-fd-theme="light"] .fd-feature-content,
html[data-fd-theme="light"] .fd-alert-modal {
  background-color: var(--fd-r119-page-light) !important;
}

/* One top-level card family. Selectors are explicit to avoid styling layout and hit-target elements. */
html body #app :is(
  .glass-card,
  .fd-best,
  .favorites-block,
  .station-result,
  .search-suggestion-panel,
  .menu-card,
  .detail-card,
  .station-detail-card,
  .primary-station-card,
  .dashboard-advice-card,
  .detail-advice-card,
  .route-options,
  .empty-state,
  .live-error
),
html body .fd-feature-page :is(
  .fd-feature-card,
  .fd-theme-choice,
  .fd-account-page-status,
  .fd-account-page-card,
  .fd-account-recovery-card,
  .fd-tank-history
),
html body .fd-alert-modal :is(
  .fd-alert-status,
  .fd-alert-row,
  .fd-alert-station,
  .fd-alert-empty
),
html body .fd-account-sheet__panel {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r119-border-dark) !important;
  border-radius: var(--fd-r119-radius-card) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-card-dark) !important;
  box-shadow: var(--fd-r119-card-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
  color: var(--fd-r119-text-dark) !important;
}
html[data-fd-theme="light"] body #app :is(
  .glass-card,
  .fd-best,
  .favorites-block,
  .station-result,
  .search-suggestion-panel,
  .menu-card,
  .detail-card,
  .station-detail-card,
  .primary-station-card,
  .dashboard-advice-card,
  .detail-advice-card,
  .route-options,
  .empty-state,
  .live-error
),
html[data-fd-theme="light"] body .fd-feature-page :is(
  .fd-feature-card,
  .fd-theme-choice,
  .fd-account-page-status,
  .fd-account-page-card,
  .fd-account-recovery-card,
  .fd-tank-history
),
html[data-fd-theme="light"] body .fd-alert-modal :is(
  .fd-alert-status,
  .fd-alert-row,
  .fd-alert-station,
  .fd-alert-empty
),
html[data-fd-theme="light"] body .fd-account-sheet__panel {
  border-color: var(--fd-r119-border-light) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-card-light) !important;
  box-shadow: var(--fd-r119-card-shadow-light) !important;
  color: var(--fd-r119-text-light) !important;
}

/* Cards use one spacing rhythm while retaining their established layout. */
.fd-feature-page .fd-feature-content,
.fd-alert-modal .fd-alert-grid,
.fd-alert-modal .fd-alert-stations {
  gap: var(--fd-r119-gap) !important;
}
.fd-feature-page .fd-feature-content > *,
.fd-feature-page :is(.fd-feature-card,.fd-theme-choice,.fd-tank-history),
#app :is(.dashboard-section,.station-result,.menu-card,.detail-card) {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Nested tiles and contained statistics use a quieter second glass depth. */
html body .fd-feature-page :is(
  .fd-tank-summary article,
  .fd-month-grid article,
  .fd-tank-entry,
  .fd-tank-empty
),
html body #app :is(
  .detail-price-card,
  .detail-price-grid > *,
  .primary-station-card__facts > span,
  .primary-station-card__insights > div
) {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r119-border-dark) !important;
  border-radius: var(--fd-r119-radius-tile) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-tile-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.04) !important;
  -webkit-backdrop-filter: blur(18px) saturate(122%) !important;
  backdrop-filter: blur(18px) saturate(122%) !important;
}
html[data-fd-theme="light"] body .fd-feature-page :is(
  .fd-tank-summary article,
  .fd-month-grid article,
  .fd-tank-entry,
  .fd-tank-empty
),
html[data-fd-theme="light"] body #app :is(
  .detail-price-card,
  .detail-price-grid > *,
  .primary-station-card__facts > span,
  .primary-station-card__insights > div
) {
  border-color: var(--fd-r119-border-light) !important;
  background-image: var(--fd-r119-tile-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 7px 17px rgba(35,35,42,.06) !important;
}

/* Search field is one glass control; its input and icon remain transparent inside it. */
html body #app .search-field {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r119-border-dark) !important;
  border-radius: 18px !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-control-dark) !important;
  box-shadow: var(--fd-r119-control-shadow-dark) !important;
  -webkit-backdrop-filter: blur(20px) saturate(124%) !important;
  backdrop-filter: blur(20px) saturate(124%) !important;
}
html body #app .search-field :is(input,.search-field-action,.search-field-clear) {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-fd-theme="light"] body #app .search-field {
  border-color: var(--fd-r119-border-light) !important;
  background-image: var(--fd-r119-control-light) !important;
  box-shadow: var(--fd-r119-control-shadow-light) !important;
}

/* Neutral controls. Text-only links and structural toggles are intentionally excluded. */
html body #app :is(
  .refresh-pill,
  .route-trigger,
  .favorite-toggle,
  .detail-favorite,
  .map-location-control,
  .fd-live-location-button,
  .primary-station-action,
  .station-sort button,
  .fuel-filter button,
  .fuel-preference button,
  .nearby-radius button,
  .route-options a
),
html body .fd-feature-page :is(
  .fd-auth-secondary,
  .fd-backup-actions button,
  .fd-tank-delete
),
html body .fd-alert-modal :is(.fd-alert-test),
html body .tab-stepper__controls button {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r119-border-dark) !important;
  border-radius: var(--fd-r119-radius-control) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-control-dark) !important;
  box-shadow: var(--fd-r119-control-shadow-dark) !important;
  -webkit-backdrop-filter: blur(20px) saturate(124%) !important;
  backdrop-filter: blur(20px) saturate(124%) !important;
  color: var(--fd-r119-text-dark) !important;
}
html[data-fd-theme="light"] body #app :is(
  .refresh-pill,
  .route-trigger,
  .favorite-toggle,
  .detail-favorite,
  .map-location-control,
  .fd-live-location-button,
  .primary-station-action,
  .station-sort button,
  .fuel-filter button,
  .fuel-preference button,
  .nearby-radius button,
  .route-options a
),
html[data-fd-theme="light"] body .fd-feature-page :is(
  .fd-auth-secondary,
  .fd-backup-actions button,
  .fd-tank-delete
),
html[data-fd-theme="light"] body .fd-alert-modal :is(.fd-alert-test),
html[data-fd-theme="light"] body .tab-stepper__controls button {
  border-color: var(--fd-r119-border-light) !important;
  background-image: var(--fd-r119-control-light) !important;
  box-shadow: var(--fd-r119-control-shadow-light) !important;
  color: #303036 !important;
}

/* Icon controls keep the accepted profile-button geometry. */
html body :is(
  .fd-profile-button,
  .fd-app-reload,
  .fd-feature-back,
  .detail-close,
  .fd-alert-close,
  .fd-account-sheet__close,
  .round-button
) {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r119-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-control-dark) !important;
  box-shadow: var(--fd-r119-control-shadow-dark) !important;
  -webkit-backdrop-filter: blur(22px) saturate(124%) !important;
  backdrop-filter: blur(22px) saturate(124%) !important;
  color: var(--fd-r119-text-dark) !important;
}
html[data-fd-theme="light"] body :is(
  .fd-profile-button,
  .fd-app-reload,
  .fd-feature-back,
  .detail-close,
  .fd-alert-close,
  .fd-account-sheet__close,
  .round-button
) {
  border-color: var(--fd-r119-border-light) !important;
  background-image: var(--fd-r119-control-light) !important;
  box-shadow: var(--fd-r119-control-shadow-light) !important;
  color: #303036 !important;
}

/* Inputs and selectors use control glass. Search-field input is handled above to prevent double glass. */
html body .fd-feature-page :is(input,select,textarea),
html body .fd-alert-modal :is(select,input[type="time"],input[type="number"]),
html body .fd-account-sheet__panel :is(input,select,textarea) {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r119-border-dark) !important;
  border-radius: var(--fd-r119-radius-control) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-control-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045) !important;
  color: var(--fd-r119-text-dark) !important;
}
html[data-fd-theme="light"] body .fd-feature-page :is(input,select,textarea),
html[data-fd-theme="light"] body .fd-alert-modal :is(select,input[type="time"],input[type="number"]),
html[data-fd-theme="light"] body .fd-account-sheet__panel :is(input,select,textarea) {
  border-color: var(--fd-r119-border-light) !important;
  background-image: var(--fd-r119-control-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98) !important;
  color: var(--fd-r119-text-light) !important;
}

/* Selected and primary actions share one translucent red family. */
html body :is(
  .fd-auth-primary,
  .fd-tank-submit,
  .fd-alert-enable,
  .fd-auth-switch button.is-active
),
html body #app :is(
  .station-sort button.is-active,
  .fuel-filter button.is-active,
  .fuel-preference button.is-active,
  .nearby-radius button.is-active,
  .primary-station-action.is-active
) {
  border: 1px solid rgba(255,59,48,.72) !important;
  border-radius: var(--fd-r119-radius-control) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-red-glass) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.18), 0 10px 24px rgba(255,59,48,.14) !important;
  -webkit-backdrop-filter: blur(20px) saturate(135%) !important;
  backdrop-filter: blur(20px) saturate(135%) !important;
  color: #fff !important;
}
html[data-fd-theme="light"] body :is(
  .fd-auth-primary,
  .fd-tank-submit,
  .fd-alert-enable,
  .fd-auth-switch button.is-active
),
html[data-fd-theme="light"] body #app :is(
  .station-sort button.is-active,
  .fuel-filter button.is-active,
  .fuel-preference button.is-active,
  .nearby-radius button.is-active,
  .primary-station-action.is-active
) {
  border-color: rgba(255,59,48,.70) !important;
  background-image: var(--fd-r119-red-glass-light) !important;
  color: #fff !important;
}

/* Structural interaction elements: absolutely no card plate, haze, shadow, or blur. */
html body #app .tab-stepper,
html body #app .tab-stepper__toggle,
html body #app .search-availability-filter,
html body #app .search-availability-filter button,
html body #app .fd-best__tap,
html body .fd-feature-page details,
html body .fd-feature-page details[open],
html body .fd-feature-page details > div,
html body .fd-feature-page details summary,
html body .fd-account-sheet__backdrop {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}
html body #app .tab-stepper__toggle::before,
html body #app .tab-stepper__toggle::after,
html body #app .search-availability-filter::before,
html body #app .search-availability-filter::after,
html body #app .search-availability-filter button::before,
html body #app .search-availability-filter button::after,
html body #app .fd-best__tap::before,
html body #app .fd-best__tap::after,
html body .fd-feature-page details summary::before {
  content: none !important;
  display: none !important;
}
html body #app .tab-stepper__toggle > span {
  background: var(--fd-r119-red) !important;
  background-image: none !important;
  box-shadow: none !important;
}
html body #app .tab-stepper__controls {
  border: 1px solid var(--fd-r119-border-dark) !important;
  border-radius: 27px !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-card-dark) !important;
  box-shadow: var(--fd-r119-card-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}
html[data-fd-theme="light"] body #app .tab-stepper__controls {
  border-color: var(--fd-r119-border-light) !important;
  background-image: var(--fd-r119-card-light) !important;
  box-shadow: var(--fd-r119-card-shadow-light) !important;
}
html body #app .tab-stepper__controls button {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: var(--fd-r119-red) !important;
}

/* Closed-stations row: plain text row, only the checkbox carries state. */
html body #app .search-availability-filter button {
  color: var(--fd-r119-muted-dark) !important;
}
html[data-fd-theme="light"] body #app .search-availability-filter button {
  color: var(--fd-r119-text-light) !important;
}
html body #app .search-availability-filter__box {
  box-sizing: border-box !important;
  border: 1.5px solid rgba(255,255,255,.38) !important;
  border-radius: 4px !important;
  background: rgba(255,255,255,.025) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-fd-theme="light"] body #app .search-availability-filter__box {
  border-color: #8d8d94 !important;
  background: #fff !important;
}
html body #app .search-availability-filter button.is-active {
  color: var(--fd-r119-text-dark) !important;
}
html[data-fd-theme="light"] body #app .search-availability-filter button.is-active {
  color: var(--fd-r119-text-light) !important;
}
html body #app .search-availability-filter button.is-active .search-availability-filter__box {
  border-color: var(--fd-r119-red) !important;
  background: var(--fd-r119-red) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Bottom navigation is glass, but never has an additional rectangular pseudo-layer. */
html body #app .fuel-tab-bar {
  border: 1px solid var(--fd-r119-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-card-dark) !important;
  box-shadow: var(--fd-r119-card-shadow-dark) !important;
  -webkit-backdrop-filter: blur(26px) saturate(132%) !important;
  backdrop-filter: blur(26px) saturate(132%) !important;
}
html[data-fd-theme="light"] body #app .fuel-tab-bar {
  border-color: var(--fd-r119-border-light) !important;
  background-image: var(--fd-r119-card-light) !important;
  box-shadow: var(--fd-r119-card-shadow-light) !important;
}
html body #app .fuel-tab-bar::before,
html body #app .fuel-tab-bar::after {
  content: none !important;
  display: none !important;
}

/* Text-only links retain their hierarchy and never become pills. */
html body :is(.fd-auth-link,.station-detail-link,.about-build) {
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Semantic status colors remain identical in both themes. */
html body #app :is(.price-change.is-lower,.fd-best__trend.is-lower,.fd-best__trend.is-lower i),
html[data-fd-theme="light"] body #app :is(.price-change.is-lower,.fd-best__trend.is-lower,.fd-best__trend.is-lower i) {
  color: var(--fd-r119-mint) !important;
  fill: var(--fd-r119-mint) !important;
  stroke: var(--fd-r119-mint) !important;
  text-shadow: none !important;
}
html body #app :is(.price-change.is-higher,.fd-best__trend.is-higher,.fd-best__trend.is-higher i),
html[data-fd-theme="light"] body #app :is(.price-change.is-higher,.fd-best__trend.is-higher,.fd-best__trend.is-higher i) {
  color: var(--fd-r119-red) !important;
  fill: var(--fd-r119-red) !important;
  stroke: var(--fd-r119-red) !important;
  text-shadow: none !important;
}
.fd-alert-status[data-tone="active"],
.fd-account-page-status[data-cloud-tone="active"] h2 { color: var(--fd-r119-mint) !important; }
.fd-alert-status[data-tone="inactive"],
.fd-account-page-status[data-cloud-tone="inactive"] h2 { color: var(--fd-r119-red) !important; }
.fd-alert-status[data-tone="error"],
.fd-alert-status[data-tone="pending"],
.fd-account-page-status[data-cloud-tone="error"] h2 { color: var(--fd-r119-orange) !important; }

/* Disabled, focus, and active states are controlled without adding new overlay plates. */
html body :is(button,input,select,textarea):focus-visible {
  outline: 2px solid rgba(255,59,48,.78) !important;
  outline-offset: 2px !important;
}
html body :is(button,input,select,textarea):disabled,
html body button[aria-disabled="true"] {
  opacity: .48 !important;
  filter: saturate(.65) !important;
  cursor: default !important;
}
html body button:active:not(:disabled):not([aria-disabled="true"]) {
  transform: scale(.985);
}
html body :is(.tab-stepper__toggle,.fd-best__tap,.search-availability-filter button,.fd-account-sheet__backdrop):active {
  transform: none !important;
}

/* Keep the accepted compact feature-page scale. */
@media (max-width: 520px) {
  .fd-feature-page .fd-feature-content { gap: var(--fd-r119-gap) !important; }
  .fd-feature-page :is(.fd-feature-card,.fd-theme-choice,.fd-tank-history) { border-radius: 21px !important; }
}

/* Final specificity guards for established feature/account selectors. */
html body .fd-feature-page[data-fd-feature-view] :is(
  .fd-feature-card,
  .fd-theme-choice,
  .fd-account-page-status,
  .fd-account-page-card,
  .fd-account-recovery-card,
  .fd-tank-history
),
html body .fd-account-sheet .fd-account-sheet__panel {
  border: 1px solid var(--fd-r119-border-dark) !important;
  border-radius: var(--fd-r119-radius-card) !important;
  background: var(--fd-r119-card-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-card-dark) !important;
  box-shadow: var(--fd-r119-card-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
  color: var(--fd-r119-text-dark) !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view] :is(
  .fd-feature-card,
  .fd-theme-choice,
  .fd-account-page-status,
  .fd-account-page-card,
  .fd-account-recovery-card,
  .fd-tank-history
),
html[data-fd-theme="light"] body .fd-account-sheet .fd-account-sheet__panel {
  border-color: var(--fd-r119-border-light) !important;
  background: var(--fd-r119-card-light) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-card-light) !important;
  box-shadow: var(--fd-r119-card-shadow-light) !important;
  color: var(--fd-r119-text-light) !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-tank-summary article,
  .fd-month-grid article,
  .fd-tank-entry,
  .fd-tank-empty
) {
  border-radius: var(--fd-r119-radius-tile) !important;
  background: var(--fd-r119-tile-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-tile-dark) !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-tank-summary article,
  .fd-month-grid article,
  .fd-tank-entry,
  .fd-tank-empty
) {
  background: var(--fd-r119-tile-light) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-tile-light) !important;
}

/* Semantic and segmented-control specificity guards. */
html body .fd-alert-modal .fd-alert-status[data-tone="active"] {
  color: var(--fd-r119-mint) !important;
}
html body .fd-alert-modal .fd-alert-status[data-tone="inactive"] {
  color: var(--fd-r119-red) !important;
}
html body .fd-alert-modal .fd-alert-status:is([data-tone="error"],[data-tone="pending"]) {
  color: var(--fd-r119-orange) !important;
}
html[data-fd-theme="light"] body #app :is(.station-sort,.fuel-filter,.fuel-preference,.nearby-radius) button:not(.is-active) {
  border: 1px solid var(--fd-r119-border-light) !important;
  border-radius: var(--fd-r119-radius-control) !important;
  background: var(--fd-r119-control-light) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-control-light) !important;
  box-shadow: var(--fd-r119-control-shadow-light) !important;
  -webkit-backdrop-filter: blur(20px) saturate(124%) !important;
  backdrop-filter: blur(20px) saturate(124%) !important;
  color: #303036 !important;
}

/* Legacy-ID specificity neutralizers. */
html body:not(#fd-r119-status-scope) .fd-alert-modal .fd-alert-status[data-tone="active"] {
  color: var(--fd-r119-mint) !important;
}
html body:not(#fd-r119-status-scope) .fd-alert-modal .fd-alert-status[data-tone="inactive"] {
  color: var(--fd-r119-red) !important;
}
html body:not(#fd-r119-status-scope) .fd-alert-modal .fd-alert-status:is([data-tone="error"],[data-tone="pending"]) {
  color: var(--fd-r119-orange) !important;
}
html[data-fd-theme="light"] body #app .station-sort button:not(.is-active),
html[data-fd-theme="light"] body #app .fuel-filter button:not(.is-active),
html[data-fd-theme="light"] body #app .fuel-preference button:not(.is-active),
html[data-fd-theme="light"] body #app .nearby-radius button:not(.is-active) {
  border: 1px solid var(--fd-r119-border-light) !important;
  border-radius: var(--fd-r119-radius-control) !important;
  background: var(--fd-r119-control-light) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-control-light) !important;
  box-shadow: var(--fd-r119-control-shadow-light) !important;
  -webkit-backdrop-filter: blur(20px) saturate(124%) !important;
  backdrop-filter: blur(20px) saturate(124%) !important;
  color: #303036 !important;
}

html[data-fd-theme="light"] body:not(#fd-r119-control-scope) #app .station-sort button:not(.is-active),
html[data-fd-theme="light"] body:not(#fd-r119-control-scope) #app .fuel-filter button:not(.is-active),
html[data-fd-theme="light"] body:not(#fd-r119-control-scope) #app .fuel-preference button:not(.is-active),
html[data-fd-theme="light"] body:not(#fd-r119-control-scope) #app .nearby-radius button:not(.is-active) {
  border-color: var(--fd-r119-border-light) !important;
  border-radius: var(--fd-r119-radius-control) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-control-light) !important;
  box-shadow: var(--fd-r119-control-shadow-light) !important;
  -webkit-backdrop-filter: blur(20px) saturate(124%) !important;
  backdrop-filter: blur(20px) saturate(124%) !important;
  color: #303036 !important;
}

/* Startup/final navigation label parity. */
.fd-startup-cover .fd-fast-nav > span > span,
html body #app .fuel-tab-bar small {
  font-size: 10px !important;
  line-height: 1 !important;
}

/* ===== assets/r120-targeted-fixes.css ===== */
/* FuelDash R120 — targeted corrections on top of the accepted R119 system. */
:root {
  --fd-r120-card-dark: var(--fd-r119-card-dark);
  --fd-r120-card-light: var(--fd-r119-card-light);
  --fd-r120-border-dark: var(--fd-r119-border-dark);
  --fd-r120-border-light: var(--fd-r119-border-light);
  --fd-r120-shadow-dark: var(--fd-r119-card-shadow-dark);
  --fd-r120-shadow-light: var(--fd-r119-card-shadow-light);
  --fd-r120-radius-card: var(--fd-r119-radius-card);
  --fd-r120-gap: 16px;
}

/* Search and favorites lists: one explicit 16px rhythm between top-level station cards. */
#app .result-list {
  display: grid !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
#app .result-list > :is(.station-result,.favorites-screen-card) {
  margin: 0 !important;
}

/* Dashboard favorites — option A: one outer glass card, transparent contained rows. */
#app .favorites-block {
  overflow: hidden !important;
  padding: 0 16px 10px !important;
  border: 1px solid var(--fd-r120-border-dark) !important;
  border-radius: var(--fd-r120-radius-card) !important;
  background-color: transparent !important;
  background-image: var(--fd-r120-card-dark) !important;
  box-shadow: var(--fd-r120-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}
html[data-fd-theme="light"] #app .favorites-block {
  border-color: var(--fd-r120-border-light) !important;
  background-image: var(--fd-r120-card-light) !important;
  box-shadow: var(--fd-r120-shadow-light) !important;
}
#app .favorites-block > header {
  min-height: 54px !important;
  height: auto !important;
  padding: 0 1px !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
}
html[data-fd-theme="light"] #app .favorites-block > header {
  border-bottom-color: rgba(35,35,40,.10) !important;
}
#app .favorites-block .dashboard-favorite-card {
  width: 100% !important;
  margin: 0 !important;
  padding: 14px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
#app .favorites-block .dashboard-favorite-card + .dashboard-favorite-card {
  border-top: 1px solid rgba(255,255,255,.07) !important;
}
html[data-fd-theme="light"] #app .favorites-block .dashboard-favorite-card + .dashboard-favorite-card {
  border-top-color: rgba(35,35,40,.10) !important;
}
#app .favorites-block > .empty-state {
  margin: 0 !important;
  padding: 16px 0 10px !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Favorites tab: no outer list plate; every station is one main glass card. */
#app .favorites-screen-card {
  box-sizing: border-box !important;
  width: 100% !important;
  border: 1px solid var(--fd-r120-border-dark) !important;
  border-radius: var(--fd-r120-radius-card) !important;
  background-color: transparent !important;
  background-image: var(--fd-r120-card-dark) !important;
  box-shadow: var(--fd-r120-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}
html[data-fd-theme="light"] #app .favorites-screen-card {
  border-color: var(--fd-r120-border-light) !important;
  background-image: var(--fd-r120-card-light) !important;
  box-shadow: var(--fd-r120-shadow-light) !important;
}
#app .favorites-screen-card.is-primary-station {
  border-color: rgba(255,59,48,.55) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055), 0 14px 32px rgba(255,59,48,.08) !important;
}

/* Tankempfehlung: the main card is glass; all second-level plates are removed. */
html[data-fd-theme] body #app .primary-station-card__insights {
  gap: 0 !important;
  padding: 16px !important;
}
html[data-fd-theme] body #app .primary-station-card__insights > div,
html[data-fd-theme] body #app .primary-station-card__facts > span {
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-fd-theme] body #app .primary-station-card__insights > div:first-child {
  padding: 0 0 16px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
}
html[data-fd-theme="light"] body #app .primary-station-card__insights > div:first-child {
  border-bottom-color: rgba(35,35,40,.10) !important;
}
html[data-fd-theme] body #app .primary-station-card__facts {
  gap: 0 !important;
  padding-top: 12px !important;
}
html[data-fd-theme] body #app .primary-station-card__facts > span {
  min-height: 58px !important;
  padding: 4px 10px 0 !important;
  border: 0 !important;
}
html[data-fd-theme] body #app .primary-station-card__facts > span:first-child {
  padding-left: 0 !important;
}
html[data-fd-theme] body #app .primary-station-card__facts > span + span {
  border-left: 1px solid rgba(255,255,255,.07) !important;
}
html[data-fd-theme="light"] body #app .primary-station-card__facts > span + span {
  border-left-color: rgba(35,35,40,.10) !important;
}
html[data-fd-theme] body #app .dashboard-advice-card .primary-station-card__insights > div:first-child {
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

@media (max-width: 370px) {
  html[data-fd-theme] body #app .primary-station-card__facts {
    grid-template-columns: 1fr !important;
  }
  html[data-fd-theme] body #app .primary-station-card__facts > span {
    min-height: 0 !important;
    padding: 10px 0 !important;
  }
  html[data-fd-theme] body #app .primary-station-card__facts > span + span {
    border-top: 1px solid rgba(255,255,255,.07) !important;
    border-left: 0 !important;
  }
  html[data-fd-theme="light"] body #app .primary-station-card__facts > span + span {
    border-top-color: rgba(35,35,40,.10) !important;
  }
}

/* ===== assets/r121-targeted-fixes.css ===== */
/* FuelDash R121 — five isolated corrections on top of accepted R120. */
:root {
  --fd-r121-gap: 16px;
  --fd-r121-tile-dark: var(--fd-r119-tile-dark);
  --fd-r121-tile-light: var(--fd-r119-tile-light);
  --fd-r121-border-dark: var(--fd-r119-border-dark);
  --fd-r121-border-light: var(--fd-r119-border-light);
  --fd-r121-radius-tile: var(--fd-r119-radius-tile);
}

/* Tank recommendation: copy stays in the main card; only the three facts are compact glass tiles. */
html[data-fd-theme] body #app .primary-station-card__insights > div:first-child {
  border: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-fd-theme] body #app .primary-station-card__facts {
  gap: 10px !important;
  padding-top: 14px !important;
}
html[data-fd-theme] body #app .primary-station-card__facts > span {
  box-sizing: border-box !important;
  min-height: 64px !important;
  padding: 11px 12px !important;
  border: 1px solid var(--fd-r121-border-dark) !important;
  border-radius: var(--fd-r121-radius-tile) !important;
  background-color: transparent !important;
  background-image: var(--fd-r121-tile-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045) !important;
  -webkit-backdrop-filter: blur(18px) saturate(122%) !important;
  backdrop-filter: blur(18px) saturate(122%) !important;
}
html[data-fd-theme] body #app .primary-station-card__facts > span:first-child {
  padding-left: 12px !important;
}
html[data-fd-theme] body #app .primary-station-card__facts > span + span {
  border-left: 1px solid var(--fd-r121-border-dark) !important;
}
html[data-fd-theme="light"] body #app .primary-station-card__facts > span {
  border-color: var(--fd-r121-border-light) !important;
  background-image: var(--fd-r121-tile-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 7px 17px rgba(35,35,42,.06) !important;
}

/* Startup wordmark: use the same shared class without changing the loaded header. */
.fd-startup-cover .brand-wordmark {
  gap: 7px !important;
}
.fd-startup-cover .brand-wordmark > span,
.fd-startup-cover .brand-wordmark > strong {
  display: block !important;
  line-height: 1 !important;
  letter-spacing: inherit !important;
}
.fd-startup-cover .brand-wordmark > strong { color: #ff3b30 !important; font-weight: bolder !important; }
html[data-fd-theme="light"] .fd-startup-cover .brand-wordmark > span { color: #151517 !important; }

/* Dashboard hero/map card: separate top outline cannot be hidden by map clipping. */
html body #app .fd-best {
  position: relative !important;
  isolation: isolate !important;
}
html body #app .fd-best::before {
  content: "" !important;
  position: absolute !important;
  z-index: 20 !important;
  inset: 0 !important;
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r121-border-dark) !important;
  border-radius: inherit !important;
  pointer-events: none !important;
}
html[data-fd-theme="light"] body #app .fd-best::before {
  border-color: var(--fd-r121-border-light) !important;
}

/* Favorites: exact interval between sorting control and the first station card. */
#app [data-sort-controls] + .result-list {
  margin-top: var(--fd-r121-gap) !important;
}

/* More: each direct card group is separated; no internal menu rows are affected. */
#app .app-content > :is(.fuel-preference,.nearby-radius,.menu-card) + :is(.fuel-preference,.nearby-radius,.menu-card) {
  margin-top: var(--fd-r121-gap) !important;
}

@media (max-width: 370px) {
  html[data-fd-theme] body #app .primary-station-card__facts {
    gap: 10px !important;
  }
  html[data-fd-theme] body #app .primary-station-card__facts > span {
    min-height: 56px !important;
    padding: 10px 12px !important;
  }
  html[data-fd-theme] body #app .primary-station-card__facts > span + span {
    border-top: 1px solid var(--fd-r121-border-dark) !important;
    border-left: 1px solid var(--fd-r121-border-dark) !important;
  }
}

/* ===== assets/r122-android-parity.css ===== */
/* FuelDash R122 — standards-based Android/iOS layout parity. */
:root {
  --fd-safe-top: env(safe-area-inset-top, 0px);
  --fd-safe-right: env(safe-area-inset-right, 0px);
  --fd-safe-bottom: env(safe-area-inset-bottom, 0px);
  --fd-safe-left: env(safe-area-inset-left, 0px);
  --fd-mobile-max: 480px;
}
html, body {
  min-height: 100%;
  min-height: 100svh;
  min-height: 100dvh;
  max-width: 100%;
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
#app, .fd-fast-shell, .fd-feature-shell, .fd-alert-sheet, .fd-account-sheet__panel {
  box-sizing: border-box;
  max-width: 100%;
}
@media (hover: none) and (pointer: coarse) {
  button, [role="button"], input, select, textarea, summary { touch-action: manipulation; }
  button, [role="button"] { -webkit-tap-highlight-color: transparent; }
  :where(.station-copy,.station-value,.fd-best__copy,.fd-feature-heading,.fd-feature-card,.menu-card,.fd-alert-row span) { min-width: 0; }
  :where(.station-copy strong,.station-copy small,.fd-feature-heading h1,.fd-feature-card h2,.menu-card button span) { overflow-wrap: anywhere; }
  #app .station-opening { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
}
@media (display-mode: standalone) {
  body { min-height: 100svh; min-height: 100dvh; }
  .fuel-tab-bar, .fd-fast-nav { bottom: calc(10px + var(--fd-safe-bottom)) !important; }
}
@media (max-width: 480px) {
  #app > main, .fd-fast-shell, .fd-feature-shell, .fd-alert-sheet { width: 100% !important; max-width: var(--fd-mobile-max) !important; margin-inline: auto !important; }
  .brand-header, .fd-fast-header { padding-inline: max(16px, var(--fd-safe-left)) max(16px, var(--fd-safe-right)); }
  .fuel-tab-bar, .fd-fast-nav { width: min(calc(100% - 32px), 448px) !important; }
}
@media (max-width: 380px) {
  .brand-wordmark, .brand-wordmark { font-size: clamp(25px, 7.6vw, 29px) !important; }
  .fuel-tab-bar, .fd-fast-nav { width: calc(100% - 24px) !important; padding-inline: 9px !important; gap: 4px !important; }
  .fuel-tab-bar button small, .fd-fast-nav > span > span { font-size: 9.5px !important; }
  .station-result, .favorite-station-card { padding-inline: 13px !important; }
}
@media (orientation: landscape) and (max-height: 520px) {
  .fuel-tab-bar, .fd-fast-nav { height: 62px !important; bottom: calc(6px + var(--fd-safe-bottom)) !important; }
  .fuel-tab-bar button, .fd-fast-nav > span { min-height: 46px !important; }
  .fd-fast-shell { padding-bottom: calc(82px + var(--fd-safe-bottom)) !important; }
}


/* ===== r124-ui-harmony.css ===== */
/* FuelDash R124 — final visual harmony layer for Dashboard, Search, Favorites and Tankbuch. */
:root {
  --fd-r124-card-dark: var(--fd-r119-card-dark);
  --fd-r124-card-light: var(--fd-r119-card-light);
  --fd-r124-tile-dark: var(--fd-r119-tile-dark);
  --fd-r124-tile-light: var(--fd-r119-tile-light);
  --fd-r124-control-dark: var(--fd-r119-control-dark);
  --fd-r124-control-light: var(--fd-r119-control-light);
  --fd-r124-border-dark: var(--fd-r119-border-dark);
  --fd-r124-border-light: var(--fd-r119-border-light);
  --fd-r124-shadow-dark: var(--fd-r119-card-shadow-dark);
  --fd-r124-shadow-light: var(--fd-r119-card-shadow-light);
  --fd-r124-control-shadow-dark: var(--fd-r119-control-shadow-dark);
  --fd-r124-control-shadow-light: var(--fd-r119-control-shadow-light);
  --fd-r124-radius-card: var(--fd-r119-radius-card);
  --fd-r124-radius-tile: var(--fd-r119-radius-tile);
  --fd-r124-radius-control: var(--fd-r119-radius-control);
  --fd-r124-gap: 16px;
  --fd-r124-control-height: 46px;
}

/* Dashboard: one fully closed outline stays above the clipped map layers. */
html body #app .fd-best {
  isolation: isolate !important;
  overflow: hidden !important;
  border: 1px solid var(--fd-r124-border-dark) !important;
  border-radius: var(--fd-r124-radius-card) !important;
  background-color: transparent !important;
  background-image: var(--fd-r124-card-dark) !important;
  box-shadow: var(--fd-r124-shadow-dark) !important;
}
html body #app .fd-best::before {
  content: "" !important;
  position: absolute !important;
  z-index: 100 !important;
  inset: 0 !important;
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r124-border-dark) !important;
  border-radius: inherit !important;
  pointer-events: none !important;
}
html[data-fd-theme="light"] body #app .fd-best,
html[data-fd-theme="light"] body #app .fd-best::before {
  border-color: var(--fd-r124-border-light) !important;
}
html[data-fd-theme="light"] body #app .fd-best {
  background-image: var(--fd-r124-card-light) !important;
  box-shadow: var(--fd-r124-shadow-light) !important;
}

/* Dashboard content cards now share the measured account/More silhouette. */
html body #app :is(.primary-station-card,.favorites-block) {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r124-border-dark) !important;
  border-radius: var(--fd-r124-radius-card) !important;
  background-color: transparent !important;
  background-image: var(--fd-r124-card-dark) !important;
  box-shadow: var(--fd-r124-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}
html[data-fd-theme="light"] body #app :is(.primary-station-card,.favorites-block) {
  border-color: var(--fd-r124-border-light) !important;
  background-image: var(--fd-r124-card-light) !important;
  box-shadow: var(--fd-r124-shadow-light) !important;
}

/* The Tankempfehlung facts are three tiles only — never a rectangular plate behind them. */
html body #app .primary-station-card__facts {
  gap: 10px !important;
  padding: 14px 0 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html body #app .primary-station-card__facts > span,
html body #app .primary-station-card__facts > span + span {
  min-width: 0 !important;
  min-height: 66px !important;
  padding: 12px !important;
  border: 1px solid var(--fd-r124-border-dark) !important;
  border-radius: var(--fd-r124-radius-tile) !important;
  background-color: transparent !important;
  background-image: var(--fd-r124-tile-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045) !important;
  -webkit-backdrop-filter: blur(18px) saturate(122%) !important;
  backdrop-filter: blur(18px) saturate(122%) !important;
}
html body #app .primary-station-card__facts > span small {
  font-size: 11px !important;
  line-height: 1.25 !important;
}
html body #app .primary-station-card__facts > span b {
  display: block !important;
  margin-top: 6px !important;
  font-size: 15px !important;
  line-height: 1.15 !important;
  letter-spacing: -.18px !important;
}
html[data-fd-theme="light"] body #app .primary-station-card__facts > span,
html[data-fd-theme="light"] body #app .primary-station-card__facts > span + span {
  border-color: var(--fd-r124-border-light) !important;
  background-image: var(--fd-r124-tile-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 7px 17px rgba(35,35,42,.06) !important;
}

/* Search uses the same compact control height and account-card surface. */
html body #app .search-field {
  min-height: var(--fd-r124-control-height) !important;
  height: var(--fd-r124-control-height) !important;
  padding-inline: 14px !important;
  border: 1px solid var(--fd-r124-border-dark) !important;
  border-radius: var(--fd-r124-radius-control) !important;
  background-color: transparent !important;
  background-image: var(--fd-r124-control-dark) !important;
  box-shadow: var(--fd-r124-control-shadow-dark) !important;
  -webkit-backdrop-filter: blur(20px) saturate(124%) !important;
  backdrop-filter: blur(20px) saturate(124%) !important;
}
html body #app .search-field input {
  font-size: 16px !important;
  font-weight: 500 !important;
}
html[data-fd-theme="light"] body #app .search-field {
  border-color: var(--fd-r124-border-light) !important;
  background-image: var(--fd-r124-control-light) !important;
  box-shadow: var(--fd-r124-control-shadow-light) !important;
}
html body #app :is([data-sort-controls] .station-sort button,.search-availability-filter button) {
  min-height: 42px !important;
  border-radius: var(--fd-r124-radius-control) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}
html body #app .result-list {
  gap: var(--fd-r124-gap) !important;
}
html body #app .result-list .station-result {
  overflow: hidden !important;
  margin: 0 !important;
  border: 1px solid var(--fd-r124-border-dark) !important;
  border-radius: var(--fd-r124-radius-card) !important;
  background-color: transparent !important;
  background-image: var(--fd-r124-card-dark) !important;
  box-shadow: var(--fd-r124-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}
html[data-fd-theme="light"] body #app .result-list .station-result {
  border-color: var(--fd-r124-border-light) !important;
  background-image: var(--fd-r124-card-light) !important;
  box-shadow: var(--fd-r124-shadow-light) !important;
}

/* Favorites cards use the same card edge, depth and compact content rhythm. */
html body #app .favorites-screen-card {
  overflow: hidden !important;
  border: 1px solid var(--fd-r124-border-dark) !important;
  border-radius: var(--fd-r124-radius-card) !important;
  background-color: transparent !important;
  background-image: var(--fd-r124-card-dark) !important;
  box-shadow: var(--fd-r124-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}
html[data-fd-theme="light"] body #app .favorites-screen-card {
  border-color: var(--fd-r124-border-light) !important;
  background-image: var(--fd-r124-card-light) !important;
  box-shadow: var(--fd-r124-shadow-light) !important;
}
html body #app :is(.dashboard-favorite-card,.favorites-screen-card) .station-copy strong {
  font-size: 15px !important;
  line-height: 1.2 !important;
  letter-spacing: -.22px !important;
}
html body #app :is(.dashboard-favorite-card,.favorites-screen-card) .station-value strong {
  font-size: 19px !important;
  line-height: 1 !important;
  letter-spacing: -.45px !important;
}

/* Tankbuch: balanced period picker, compact enough for the monthly statistics card. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
  width: min(100%, 178px) !important;
  margin: 0 !important;
  justify-items: start !important;
  align-self: flex-end !important;
  gap: 6px !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date > span:first-child {
  color: var(--fd-r119-muted-dark) !important;
  font-size: 10px !important;
  font-weight: 750 !important;
  letter-spacing: .09em !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 12px 0 39px !important;
  border: 1px solid rgba(255,59,48,.27) !important;
  border-radius: var(--fd-r124-radius-control) !important;
  background: linear-gradient(145deg, rgba(255,59,48,.15), rgba(54,13,16,.30)) !important;
  color: #ffe2df !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055), 0 7px 17px rgba(255,59,48,.07) !important;
  -webkit-backdrop-filter: blur(18px) saturate(122%) !important;
  backdrop-filter: blur(18px) saturate(122%) !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control > svg {
  left: 13px !important;
  width: 17px !important;
  height: 17px !important;
  color: #ff8179 !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__label {
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: -.16px !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control input {
  height: 100% !important;
  min-height: 44px !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date > span:first-child {
  color: var(--fd-r119-muted-light) !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  border-color: rgba(255,59,48,.23) !important;
  background: linear-gradient(145deg, rgba(255,59,48,.10), rgba(255,255,255,.84)) !important;
  color: #a52d27 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.96), 0 7px 17px rgba(255,59,48,.07) !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control > svg {
  color: #d34139 !important;
}

@media (max-width: 370px) {
  html body #app .primary-station-card__facts {
    grid-template-columns: 1fr !important;
  }
  html body #app .primary-station-card__facts > span,
  html body #app .primary-station-card__facts > span + span {
    min-height: 58px !important;
  }
  html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
    width: min(100%, 172px) !important;
    align-self: flex-start !important;
  }
}


/* ===== r125-ui-corrections.css ===== */
/* FuelDash R125 — detail parity and final display-mode corrections. */
:root {
  --fd-r125-page-dark: var(--fd-r119-page-dark, #050505);
  --fd-r125-page-light: var(--fd-r119-page-light, #f5f5f7);
  --fd-r125-card-dark: var(--fd-r119-card-dark);
  --fd-r125-card-light: var(--fd-r119-card-light);
  --fd-r125-tile-dark: var(--fd-r119-tile-dark);
  --fd-r125-tile-light: var(--fd-r119-tile-light);
  --fd-r125-border-dark: var(--fd-r119-border-dark);
  --fd-r125-border-light: var(--fd-r119-border-light);
  --fd-r125-card-shadow-dark: var(--fd-r119-card-shadow-dark);
  --fd-r125-card-shadow-light: var(--fd-r119-card-shadow-light);
  --fd-r125-red-glass: var(--fd-r119-red-glass);
  --fd-r125-red-glass-light: var(--fd-r119-red-glass-light);
  --fd-r125-radius-card: var(--fd-r119-radius-card);
  --fd-r125-radius-tile: var(--fd-r119-radius-tile);
  --fd-r125-radius-control: var(--fd-r119-radius-control);
  --fd-r125-text-dark: var(--fd-r119-text-dark);
  --fd-r125-text-light: var(--fd-r119-text-light);
  --fd-r125-muted-dark: var(--fd-r119-muted-dark);
  --fd-r125-muted-light: var(--fd-r119-muted-light);
}

/* Detail view: use the same top-level surface, radius and spacing as account/More. */
html body #app .detail-view {
  display: grid !important;
  gap: 16px !important;
}
html body #app .detail-view :is(
  .detail-card,
  .station-detail-card,
  .detail-prices,
  .detail-advice-card,
  .detail-chart
) {
  box-sizing: border-box !important;
  margin: 0 !important;
  border: 1px solid var(--fd-r125-border-dark) !important;
  border-radius: var(--fd-r125-radius-card) !important;
  background-color: transparent !important;
  background-image: var(--fd-r125-card-dark) !important;
  box-shadow: var(--fd-r125-card-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
  color: var(--fd-r125-text-dark) !important;
}
html[data-fd-theme="light"] body #app .detail-view :is(
  .detail-card,
  .station-detail-card,
  .detail-prices,
  .detail-advice-card,
  .detail-chart
) {
  border-color: var(--fd-r125-border-light) !important;
  background-image: var(--fd-r125-card-light) !important;
  box-shadow: var(--fd-r125-card-shadow-light) !important;
  color: var(--fd-r125-text-light) !important;
}

/* No rectangular wrapper is allowed around the three recommendation fact tiles. */
html[data-fd-theme] body #app .primary-station-card .primary-station-card__facts,
html[data-fd-theme] body #app .detail-advice-card .primary-station-card__facts {
  outline: 0 !important;
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-fd-theme] body #app .primary-station-card .primary-station-card__facts::before,
html[data-fd-theme] body #app .primary-station-card .primary-station-card__facts::after,
html[data-fd-theme] body #app .detail-advice-card .primary-station-card__facts::before,
html[data-fd-theme] body #app .detail-advice-card .primary-station-card__facts::after {
  content: none !important;
  display: none !important;
}
html[data-fd-theme] body #app .detail-advice-card .primary-station-card__insights {
  outline: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-fd-theme] body #app :is(.primary-station-card,.detail-advice-card) .primary-station-card__facts > span {
  border: 1px solid var(--fd-r125-border-dark) !important;
  border-radius: var(--fd-r125-radius-tile) !important;
  background-color: transparent !important;
  background-image: var(--fd-r125-tile-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045) !important;
}
html[data-fd-theme="light"] body #app :is(.primary-station-card,.detail-advice-card) .primary-station-card__facts > span {
  border-color: var(--fd-r125-border-light) !important;
  background-image: var(--fd-r125-tile-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 7px 17px rgba(35,35,42,.06) !important;
}

/* Selected fuel is a semantic red selection in every theme. */
html body #app .detail-price-grid .detail-price-card.is-selected {
  border-color: rgba(255,59,48,.74) !important;
  background-color: transparent !important;
  background-image: var(--fd-r125-red-glass) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.18), 0 10px 24px rgba(255,59,48,.14) !important;
  -webkit-backdrop-filter: blur(20px) saturate(135%) !important;
  backdrop-filter: blur(20px) saturate(135%) !important;
  color: #fff !important;
}
html body #app .detail-price-grid .detail-price-card.is-selected :is(span,strong,small) {
  color: #fff !important;
}
html[data-fd-theme="light"] body #app .detail-price-grid .detail-price-card.is-selected {
  border-color: rgba(255,59,48,.70) !important;
  background-image: var(--fd-r125-red-glass-light) !important;
  color: #fff !important;
}

/* Empfohlen / Preis / Entfernung is one segmented control, not three separate cards. */
html body #app .station-sort button:not(.is-active) {
  border: 0 !important;
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: var(--fd-r125-muted-dark) !important;
}
html[data-fd-theme="light"] body #app .station-sort button:not(.is-active) {
  border-color: transparent !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-r125-muted-light) !important;
}

/* Favorites empty state: normal site typography with breathing room inside the note card. */
html body #app [data-sort-controls] + .result-list > .empty-state {
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 16px 18px !important;
  color: var(--fd-r125-muted-dark) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  letter-spacing: -.08px !important;
}
html[data-fd-theme="light"] body #app [data-sort-controls] + .result-list > .empty-state {
  color: var(--fd-r125-muted-light) !important;
}

/* Tankbuch: one continuous scroller and one uninterrupted theme surface. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] {
  inset: 0 !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: none !important;
  border: 0 !important;
  outline: 0 !important;
  background-color: var(--fd-r125-page-dark) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-overflow-scrolling: touch !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-shell {
  width: min(100%, 480px) !important;
  height: auto !important;
  min-height: 100% !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 0 calc(28px + env(safe-area-inset-bottom)) !important;
  overflow: visible !important;
  border: 0 !important;
  outline: 0 !important;
  background-color: var(--fd-r125-page-dark) !important;
  background-image: none !important;
  box-shadow: none !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-feature-header,.fd-feature-content) {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"]::before,
html body .fd-feature-page[data-fd-feature-view="tankbook"]::after,
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-shell::before,
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-shell::after {
  content: none !important;
  display: none !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"],
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-shell {
  background-color: var(--fd-r125-page-light) !important;
}

/* Period control: an even title → label → control rhythm without squeezing. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
  column-gap: 14px !important;
  row-gap: 18px !important;
  align-items: flex-start !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
  width: min(100%, 178px) !important;
  align-self: flex-start !important;
  justify-items: start !important;
  gap: 9px !important;
  margin: 0 !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
}

@media (max-width: 520px) {
  html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    row-gap: 18px !important;
  }
}

@media (max-width: 370px) {
  html body #app :is(.primary-station-card,.detail-advice-card) .primary-station-card__facts {
    grid-template-columns: 1fr !important;
  }
}


/* ===== r126-visual-regression.css ===== */
/* FuelDash R126 — verified visual regression corrections. */
:root {
  --fd-r126-border-dark: var(--fd-r119-border-dark);
  --fd-r126-border-light: var(--fd-r119-border-light);
  --fd-r126-tile-dark: var(--fd-r119-tile-dark);
  --fd-r126-tile-light: var(--fd-r119-tile-light);
  --fd-r126-muted-dark: var(--fd-r119-muted-dark);
  --fd-r126-muted-light: var(--fd-r119-muted-light);
  --fd-r126-red-solid: linear-gradient(145deg, #ff3b30, #d92e26);
  --fd-r126-radius-card: var(--fd-r119-radius-card);
  --fd-r126-radius-tile: var(--fd-r119-radius-tile);
}

/* Günstigste Tankstelle: exactly one even outline, above the map but without a cast shadow. */
html body #app .fd-best {
  isolation: isolate !important;
  overflow: hidden !important;
  clip-path: none !important;
  contain: layout style !important;
  border: 0 !important;
  border-radius: var(--fd-r126-radius-card) !important;
  outline: 0 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055) !important;
}
html body #app .fd-best::before {
  content: "" !important;
  position: absolute !important;
  z-index: 2000 !important;
  inset: 0 !important;
  display: block !important;
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r126-border-dark) !important;
  border-radius: inherit !important;
  box-shadow: none !important;
  pointer-events: none !important;
}
html body #app .fd-best::after {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] body #app .fd-best::before {
  border-color: var(--fd-r126-border-light) !important;
}

/* Tankempfehlung: only the three compact tiles remain; no container line above or below them. */
html[data-fd-theme] body #app .primary-station-card__insights > .primary-station-card__facts {
  gap: 8px !important;
  padding: 12px 0 0 !important;
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-fd-theme] body #app .primary-station-card__insights > .primary-station-card__facts::before,
html[data-fd-theme] body #app .primary-station-card__insights > .primary-station-card__facts::after {
  content: none !important;
  display: none !important;
}
html[data-fd-theme] body #app .primary-station-card__facts > span {
  min-height: 58px !important;
  padding: 8px 9px !important;
  border: 1px solid var(--fd-r126-border-dark) !important;
  border-radius: var(--fd-r126-radius-tile) !important;
  background-color: transparent !important;
  background-image: var(--fd-r126-tile-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.04) !important;
  -webkit-backdrop-filter: blur(18px) saturate(122%) !important;
  backdrop-filter: blur(18px) saturate(122%) !important;
}
html[data-fd-theme] body #app .primary-station-card__facts > span small {
  min-height: 0 !important;
  font-size: 9px !important;
  line-height: 1.25 !important;
}
html[data-fd-theme] body #app .primary-station-card__facts > span b {
  margin-top: auto !important;
  font-size: 11px !important;
  line-height: 1.15 !important;
  letter-spacing: -.025em !important;
}
html[data-fd-theme="light"] body #app .primary-station-card__facts > span {
  border-color: var(--fd-r126-border-light) !important;
  background-image: var(--fd-r126-tile-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98) !important;
}

/* Sort order is one segmented control: only the selected segment is filled. */
html body #app .station-sort {
  display: flex !important;
  gap: 0 !important;
  padding: 4px !important;
  border: 1px solid var(--fd-r126-border-dark) !important;
  border-radius: 18px !important;
  background: rgba(23,23,26,.82) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055) !important;
}
html body #app .station-sort > button {
  min-height: 42px !important;
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 14px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: var(--fd-r126-muted-dark) !important;
}
html body #app .station-sort > button.is-active {
  border: 1px solid rgba(255,59,48,.72) !important;
  background-image: var(--fd-r126-red-solid) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
  text-shadow: none !important;
}
html[data-fd-theme="light"] body #app .station-sort {
  border-color: var(--fd-r126-border-light) !important;
  background: rgba(237,237,242,.92) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98) !important;
}
html[data-fd-theme="light"] body #app .station-sort > button { color: var(--fd-r126-muted-light) !important; }

/* Red remains a flat semantic colour: no bloom, halo or coloured cast shadow anywhere. */
html body #app .detail-price-card.is-selected,
html body #app .chart-range button.is-active,
html body #app .fuel-filter button.is-active,
html body #app .fuel-preference button.is-active,
html body #app .nearby-radius button.is-active,
html body #app .primary-station-action.is-active {
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  text-shadow: none !important;
  filter: none !important;
}
html body #app :is(.map-price-marker.is-selected,.user-location-dot) {
  box-shadow: 0 5px 12px rgba(0,0,0,.32) !important;
  filter: none !important;
}
html body #app :is(.fd-best__price,.fd-best__trend,.price-change,.station-value strong,.detail-price-card strong,.primary-station-card__price) {
  text-shadow: none !important;
}
html body #app .fuel-advice-card::before {
  display: none !important;
  box-shadow: none !important;
  filter: none !important;
}
html body #app :is(
  .comparison-row.is-lowest i b,
  .chart-line,
  .legend-today,
  .search-field svg,
  .station-meta .is-closed::before,
  .favorites-screen-card.is-primary-station
) {
  box-shadow: none !important;
  filter: none !important;
}

/* Tankbuch period selector: compact, evenly spaced and no longer stretched by older rules. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 18px !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
  width: 148px !important;
  min-width: 148px !important;
  justify-items: start !important;
  align-self: start !important;
  gap: 8px !important;
  margin: 0 !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  width: 148px !important;
  min-width: 148px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 10px 0 34px !important;
  border-radius: 13px !important;
  box-shadow: inset 0 1px rgba(255,255,255,.05) !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__label {
  font-size: 12px !important;
  font-weight: 650 !important;
}

/* The visible build marker is part of Über FuelDash in both themes. */
html body #app .about-build > em {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  color: var(--fd-r126-muted-dark) !important;
  font-size: 11px !important;
  font-style: normal !important;
  line-height: 1.25 !important;
  opacity: 1 !important;
}
html[data-fd-theme="light"] body #app .about-build > em { color: var(--fd-r126-muted-light) !important; }


/* ===== r129-recovery.css ===== */
/* FuelDash R129 — recovery from the over-broad R127/R128 selection rules. */

/* A checked availability option is a checkbox row, never a solid primary button. */
html body #app .search-availability-filter button.is-active {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: inherit !important;
}

/* Saved hearts stay neutral controls with a red icon, as in the stable dashboard. */
html body #app .favorite-toggle.is-favorite,
html body #app .detail-favorite.is-favorite {
  border-color: #2c2c31 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ff3b30 !important;
}
html[data-fd-theme="light"] body #app .favorite-toggle.is-favorite,
html[data-fd-theme="light"] body #app .detail-favorite.is-favorite {
  border-color: rgba(35,35,40,.16) !important;
}

/* Restore the normal header flow: no negative displacement or overlap. */
html body #app .brand-wordmark,
html body .fd-startup-cover .brand-wordmark {
  transform: none !important;
  margin-left: 0 !important;
}
html body #app .fd-main-header-actions { gap: 8px !important; }
html body #app .fd-profile-greeting {
  max-width: 64px !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
@media (max-width: 430px) {
  html body #app .fd-profile-greeting { display: none !important; }
}

/* Tankbuch period: compact neutral profile/reload material, not a red translucent exception. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
  width: 142px !important;
  min-width: 142px !important;
  gap: 8px !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  width: 142px !important;
  min-width: 142px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 10px 0 34px !important;
  border: 1px solid #2c2c31 !important;
  border-radius: 13px !important;
  background: var(--fd-r113-glass-dark) !important;
  background-image: var(--fd-r113-glass-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
  color: #f7f7f8 !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control > svg {
  left: 11px !important;
  width: 15px !important;
  height: 15px !important;
  color: currentColor !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__label {
  font-size: 11px !important;
  font-weight: 650 !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  border-color: rgba(35,35,40,.16) !important;
  background: var(--fd-r113-glass-light) !important;
  background-image: var(--fd-r113-glass-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
  color: #303036 !important;
}

/* Only the chosen detail fuel gets the solid search-selection red. */
html body #app .detail-price-grid .detail-price-card.is-selected {
  border-color: #ff3b30 !important;
  background: #ff3b30 !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
  text-shadow: none !important;
}
html body #app .detail-price-grid .detail-price-card.is-selected :is(span,strong,small) { color: #fff !important; }


/* ===== r130-control-restoration.css ===== */
/* FuelDash R130 — restore R127's intended control language without broad state leakage. */
:root {
  --fd-r130-control-dark: var(--fd-r113-glass-dark);
  --fd-r130-control-light: var(--fd-r113-glass-light);
}

/* Only real choice buttons inherit the profile/reload material when neutral. */
html body #app :is(
  .station-sort > button:not(.is-active),
  .fuel-filter button:not(.is-active),
  .fuel-preference button:not(.is-active),
  .nearby-radius button:not(.is-active),
  .chart-range button:not(.is-active),
  .detail-price-card:not(.is-selected),
  .primary-station-action:not(.is-active)
) {
  border: 1px solid #2c2c31 !important;
  background: var(--fd-r130-control-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r130-control-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
  color: #f7f7f8 !important;
}
html[data-fd-theme="light"] body #app :is(
  .station-sort > button:not(.is-active),
  .fuel-filter button:not(.is-active),
  .fuel-preference button:not(.is-active),
  .nearby-radius button:not(.is-active),
  .chart-range button:not(.is-active),
  .detail-price-card:not(.is-selected),
  .primary-station-action:not(.is-active)
) {
  border-color: rgba(35,35,40,.16) !important;
  background: var(--fd-r130-control-light) !important;
  background-image: var(--fd-r130-control-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
  color: #303036 !important;
}

/* Search is this same material at input scale. */
html body #app .search-field {
  border-color: #2c2c31 !important;
  background: var(--fd-r130-control-dark) !important;
  background-image: var(--fd-r130-control-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}
html[data-fd-theme="light"] body #app .search-field {
  border-color: rgba(35,35,40,.16) !important;
  background: var(--fd-r130-control-light) !important;
  background-image: var(--fd-r130-control-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
}

/* A selected choice is flat hero red; checkbox rows and saved hearts are intentionally not listed. */
html body #app :is(
  .station-sort > button.is-active,
  .fuel-filter button.is-active,
  .fuel-preference button.is-active,
  .nearby-radius button.is-active,
  .chart-range button.is-active,
  .primary-station-action.is-active
) {
  border-color: #ff3b30 !important;
  background: #ff3b30 !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
  text-shadow: none !important;
}

/* Guard the two stateful controls that must never become red-filled buttons. */
html body #app .search-availability-filter button.is-active {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: inherit !important;
}
html body #app .favorite-toggle.is-favorite,
html body #app .detail-favorite.is-favorite {
  border-color: #2c2c31 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ff3b30 !important;
}
html[data-fd-theme="light"] body #app .favorite-toggle.is-favorite,
html[data-fd-theme="light"] body #app .detail-favorite.is-favorite { border-color: rgba(35,35,40,.16) !important; }


/* ===== r131-startup-geometry.css ===== */
/* FuelDash R131 — reserve the final header and navigation geometry before first render. */
.fd-startup-cover .fd-fast-header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 90px !important;
  margin-left: auto !important;
}
.fd-startup-cover .fd-fast-profile-placeholder {
  box-sizing: border-box !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  border: 1px solid #2c2c31 !important;
  border-radius: 50% !important;
  background: var(--fd-r113-glass-dark) !important;
  color: #f7f7f8 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}
.fd-startup-cover .fd-fast-profile-placeholder svg {
  width: 19px !important;
  height: 19px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.fd-startup-cover .fd-fast-greeting-placeholder {
  display: block !important;
  flex: 0 0 64px !important;
  width: 64px !important;
  height: 12px !important;
}
html[data-fd-theme="light"] .fd-startup-cover .fd-fast-profile-placeholder {
  border-color: rgba(35,35,40,.16) !important;
  background: var(--fd-r113-glass-light) !important;
  color: #303036 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
}
@media (max-width: 430px) {
  .fd-startup-cover .fd-fast-greeting-placeholder { display: none !important; }
  .fd-startup-cover .fd-fast-header-actions { min-width: 84px !important; }
}

/* Same fixed dimensions and safe-area inset as the fully rendered bottom navigation. */
.fd-startup-cover .fd-fast-nav {
  box-sizing: border-box !important;
  width: min(calc(100% - 32px), 448px) !important;
  height: 72px !important;
  min-height: 72px !important;
  bottom: calc(10px + env(safe-area-inset-bottom)) !important;
  padding: 8px 14px !important;
}
@media (display-mode: standalone) {
  .fd-startup-cover .fd-fast-nav { bottom: calc(10px + env(safe-area-inset-bottom)) !important; }
}
@media (max-width: 380px) {
  .fd-startup-cover .fd-fast-nav { width: calc(100% - 24px) !important; padding-inline: 9px !important; gap: 4px !important; }
}
@media (orientation: landscape) and (max-height: 520px) {
  .fd-startup-cover .fd-fast-nav { height: 62px !important; min-height: 62px !important; bottom: calc(6px + env(safe-area-inset-bottom)) !important; }
}


/* ===== r132-final-alignment.css ===== */
/* FuelDash R132 — final shared geometry and grouped control alignment. */

/* The first frame and the rendered app use the same 20px content edge. */
html body #app .brand-header,
html body .fd-startup-cover .fd-fast-header {
  box-sizing: border-box !important;
  width: 100% !important;
  padding-inline: 0 !important;
}

/* Keep the fixed navigation on one exact viewport geometry from frame one. */
html body #app .fuel-tab-bar,
html body .fd-startup-cover .fd-fast-nav {
  box-sizing: border-box !important;
  left: 50% !important;
  width: min(calc(100% - 32px), 448px) !important;
  height: 72px !important;
  min-height: 72px !important;
  bottom: calc(10px + env(safe-area-inset-bottom)) !important;
  padding: 8px 14px !important;
  transform: translateX(-50%) !important;
}
@media (max-width: 380px) {
  html body #app .fuel-tab-bar,
  html body .fd-startup-cover .fd-fast-nav {
    width: calc(100% - 24px) !important;
    padding-inline: 9px !important;
    gap: 4px !important;
  }
}
@media (orientation: landscape) and (max-height: 520px) {
  html body #app .fuel-tab-bar,
  html body .fd-startup-cover .fd-fast-nav {
    height: 62px !important;
    min-height: 62px !important;
    bottom: calc(6px + env(safe-area-inset-bottom)) !important;
  }
}

/* Sorting is one segmented main control, never three adjacent glass cards. */
html body #app .station-sort {
  display: flex !important;
  gap: 0 !important;
  padding: 4px !important;
  border: 1px solid #2c2c31 !important;
  border-radius: 18px !important;
  background: var(--fd-r113-glass-dark) !important;
  background-image: var(--fd-r113-glass-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}
html body #app .station-sort > button,
html body #app .station-sort > button:not(.is-active) {
  min-height: 42px !important;
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 14px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: var(--fd-r126-muted-dark) !important;
}
html body #app .station-sort > button.is-active {
  border: 1px solid #ff3b30 !important;
  background: #ff3b30 !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
  text-shadow: none !important;
}
html[data-fd-theme="light"] body #app .station-sort {
  border-color: rgba(35,35,40,.16) !important;
  background: var(--fd-r113-glass-light) !important;
  background-image: var(--fd-r113-glass-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
}
html[data-fd-theme="light"] body #app .station-sort > button,
html[data-fd-theme="light"] body #app .station-sort > button:not(.is-active) {
  color: var(--fd-r126-muted-light) !important;
}

/* Recommendation facts retain their compact typography but use the profile/reload material. */
html body #app .primary-station-card__facts > span {
  border-color: #2c2c31 !important;
  background: var(--fd-r113-glass-dark) !important;
  background-image: var(--fd-r113-glass-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}
html[data-fd-theme="light"] body #app .primary-station-card__facts > span {
  border-color: rgba(35,35,40,.16) !important;
  background: var(--fd-r113-glass-light) !important;
  background-image: var(--fd-r113-glass-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
}


/* ===== r133-recommendation-facts.css ===== */
/* FuelDash R133 — only the three recommendation facts share the profile/reload glass. */
html[data-fd-theme] body #app .primary-station-card__facts > span {
  border-color: #2c2c31 !important;
  background-color: transparent !important;
  background-image: var(--fd-r113-glass-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}
html[data-fd-theme="light"] body #app .primary-station-card__facts > span {
  border-color: rgba(35,35,40,.16) !important;
  background-color: transparent !important;
  background-image: var(--fd-r113-glass-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11) !important;
}


/* ===== r134-feature-card-unification.css ===== */
/* FuelDash R134 — profile and Tankbuch content cards use the dashboard card surface. */
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="account"] :is(
  .fd-account-page-status,
  .fd-account-page-card,
  .fd-account-recovery-card
),
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-feature-card,
  .fd-overall-card,
  .fd-tank-form-card,
  .fd-tank-history,
  .fd-month-card,
  .fd-cloud-card,
  .fd-backup-card,
  .fd-account-card,
  .fd-tankbook-cloud-row
) {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r119-border-dark) !important;
  border-radius: var(--fd-r119-radius-card) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-card-dark) !important;
  box-shadow: var(--fd-r119-card-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
  color: var(--fd-r119-text-dark) !important;
}

html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="account"] :is(
  .fd-account-page-status,
  .fd-account-page-card,
  .fd-account-recovery-card
),
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-feature-card,
  .fd-overall-card,
  .fd-tank-form-card,
  .fd-tank-history,
  .fd-month-card,
  .fd-cloud-card,
  .fd-backup-card,
  .fd-account-card,
  .fd-tankbook-cloud-row
) {
  border-color: var(--fd-r119-border-light) !important;
  background-image: var(--fd-r119-card-light) !important;
  box-shadow: var(--fd-r119-card-shadow-light) !important;
  color: var(--fd-r119-text-light) !important;
}


/* ===== r135-header-location.css ===== */
/* FuelDash R135 — compact account note and a clear, touch-safe location refresh target. */
html body #app .fd-profile-greeting {
  display: block !important;
  flex: 0 1 52px !important;
  max-width: 52px !important;
  overflow: hidden !important;
  color: var(--fd-r119-muted-dark) !important;
  font-size: 9.5px !important;
  font-weight: 560 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
html[data-fd-theme="light"] body #app .fd-profile-greeting { color: var(--fd-r119-muted-light) !important; }
html body #app .fd-profile-greeting[hidden] { visibility: hidden !important; }

/* Reserve the exact same compact note width before the account state is ready. */
html body .fd-startup-cover .fd-fast-greeting-placeholder {
  display: block !important;
  flex: 0 0 52px !important;
  width: 52px !important;
}

/* The location line is already a button in the renderer; this only guarantees native touch handling. */
html body #app .location.location-request {
  cursor: pointer !important;
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
}
html body #app .location.location-request:focus-visible {
  outline: 1px solid var(--fd-r119-border-dark) !important;
  outline-offset: 4px !important;
}
html[data-fd-theme="light"] body #app .location.location-request:focus-visible {
  outline-color: var(--fd-r119-border-light) !important;
}

@media (max-width: 380px) {
  html body #app .fd-profile-greeting {
    flex-basis: 38px !important;
    max-width: 38px !important;
    font-size: 9px !important;
  }
  html body .fd-startup-cover .fd-fast-greeting-placeholder {
    flex-basis: 38px !important;
    width: 38px !important;
  }
}


/* ===== r137-final-polish.css ===== */
/* FuelDash R137 — final dark-mode surface, form and startup polish. */
/* The startup wordmark now uses the exact loaded-header word spacing; skeleton motion stays subdued. */
.fd-startup-cover .brand-wordmark { gap: 7px !important; }
.fd-startup-cover .fd-fast-card::after { opacity: .36 !important; }
.fd-startup-cover :is(.fd-fast-line,.fd-fast-kicker,.fd-fast-title) {
  background-image: linear-gradient(100deg, rgba(255,255,255,.045) 22%, rgba(255,255,255,.09) 46%, rgba(255,255,255,.045) 70%) !important;
}
.fd-startup-cover .fd-fast-line.is-price { background-image: linear-gradient(100deg, rgba(255,59,48,.08) 22%, rgba(255,59,48,.15) 46%, rgba(255,59,48,.08) 70%) !important; }

/* Tankbuch and alert content cards share the dashboard's card layer. */
html[data-fd-theme] body :is(
  .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-feature-card,.fd-overall-card,.fd-tank-form-card,.fd-tank-history,.fd-month-card,.fd-cloud-card,.fd-backup-card,.fd-account-card),
  .fd-alert-modal :is(.fd-alert-status,.fd-alert-row,.fd-alert-station,.fd-alert-empty)
) {
  border-color: var(--fd-r119-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r119-card-dark) !important;
  box-shadow: var(--fd-r119-card-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}

/* Form fields use the same darker search-control material. */
html[data-fd-theme] body :is(
  .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-field input,.fd-field select,.fd-field textarea),
  .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"])
) {
  border-color: #2c2c31 !important;
  background: var(--fd-r113-glass-dark) !important;
  background-image: var(--fd-r113-glass-dark) !important;
  color: #f7f7f8 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}

/* Primary save/activate actions use the flat active-choice red, without bloom. */
html body :is(
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form button[type="submit"],
  .fd-alert-modal .fd-alert-enable
) {
  border-color: #ff3b30 !important;
  background: #ff3b30 !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
}

/* Period selection is a full-width standard-red control with symmetric vertical rhythm. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 14px !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
  width: 100% !important;
  min-width: 0 !important;
  display: grid !important;
  gap: 8px !important;
  margin: 0 0 14px !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  width: 100% !important;
  min-width: 0 !important;
  height: 42px !important;
  min-height: 42px !important;
  border-color: #ff3b30 !important;
  background: #ff3b30 !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control > svg,
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control input { color: #fff !important; }

/* The duplicate account-state bubble has no information beyond the status card. */
html body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-card .fd-feature-card__head > span[data-cloud-tone] { display: none !important; }


/* ===== r138-surface-token-unification.css ===== */
/* FuelDash R138 — one neutral control material and one red accent token. */
:root {
  --fd-r138-red: #ff3b30;
  --fd-r138-control-dark: linear-gradient(145deg, rgba(27,27,31,.88), rgba(8,8,11,.96));
  --fd-r138-control-light: linear-gradient(145deg, rgba(255,255,255,.96), rgba(235,235,240,.80));
  --fd-r138-control-border-dark: #2c2c31;
  --fd-r138-control-border-light: rgba(35,35,40,.16);
  --fd-r138-control-shadow-dark: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38);
  --fd-r138-control-shadow-light: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11);
}

/* Every neutral action and compact information tile uses the same material as Liter. */
html body #app :is(
  .fd-feature-back,
  .round-button,
  .refresh-pill,
  .map-location-button,
  .route-trigger,
  .route-options a,
  .fd-auth-secondary,
  .fd-alert-modal .fd-alert-test,
  .fd-alert-modal .fd-alert-row,
  .fd-alert-modal .fd-alert-station,
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .primary-station-card__facts > span,
  .detail-price-card:not(.is-selected),
  .fuel-preference button:not(.is-active),
  .nearby-radius button:not(.is-active),
  .chart-range,
  .chart-range button:not(.is-active)
) {
  border-color: var(--fd-r138-control-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r138-control-dark) !important;
  box-shadow: var(--fd-r138-control-shadow-dark) !important;
  color: #f7f7f8 !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}

html[data-fd-theme="light"] body #app :is(
  .fd-feature-back,
  .round-button,
  .refresh-pill,
  .map-location-button,
  .route-trigger,
  .route-options a,
  .fd-auth-secondary,
  .fd-alert-modal .fd-alert-test,
  .fd-alert-modal .fd-alert-row,
  .fd-alert-modal .fd-alert-station,
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .primary-station-card__facts > span,
  .detail-price-card:not(.is-selected),
  .fuel-preference button:not(.is-active),
  .nearby-radius button:not(.is-active),
  .chart-range,
  .chart-range button:not(.is-active)
) {
  border-color: var(--fd-r138-control-border-light) !important;
  background-image: var(--fd-r138-control-light) !important;
  box-shadow: var(--fd-r138-control-shadow-light) !important;
  color: #303036 !important;
}

/* Feature pages are modal siblings of #app, so share the component token directly. */
html body .fd-feature-page :is(
  .fd-feature-back,
  .fd-app-reload,
  .fd-auth-secondary,
  .fd-tank-summary > article,
  .fd-month-grid > article
) {
  border-color: var(--fd-r138-control-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r138-control-dark) !important;
  box-shadow: var(--fd-r138-control-shadow-dark) !important;
  color: #f7f7f8 !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}
html[data-fd-theme="light"] body .fd-feature-page :is(
  .fd-feature-back,
  .fd-app-reload,
  .fd-auth-secondary,
  .fd-tank-summary > article,
  .fd-month-grid > article
) {
  border-color: var(--fd-r138-control-border-light) !important;
  background-image: var(--fd-r138-control-light) !important;
  box-shadow: var(--fd-r138-control-shadow-light) !important;
  color: #303036 !important;
}

/* Price alarm is mounted beside #app, so it receives the same material explicitly. */
html body .fd-alert-modal :is(.fd-alert-test,.fd-alert-row,.fd-alert-station,.fd-alert-empty) {
  border-color: var(--fd-r138-control-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r138-control-dark) !important;
  box-shadow: var(--fd-r138-control-shadow-dark) !important;
  color: #f7f7f8 !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}
html[data-fd-theme="light"] body .fd-alert-modal :is(.fd-alert-test,.fd-alert-row,.fd-alert-station,.fd-alert-empty) {
  border-color: var(--fd-r138-control-border-light) !important;
  background-image: var(--fd-r138-control-light) !important;
  box-shadow: var(--fd-r138-control-shadow-light) !important;
  color: #303036 !important;
}
html body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  border-color: var(--fd-r138-control-border-dark) !important;
  background: var(--fd-r138-control-dark) !important;
  color: #f7f7f8 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09) !important;
}
html[data-fd-theme="light"] body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  border-color: var(--fd-r138-control-border-light) !important;
  background: var(--fd-r138-control-light) !important;
  color: #303036 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98) !important;
}

/* Form focus is an exact, inset field border: no oversized rectangular halo. */
html body #app .fd-field-affix {
  border-radius: 13px !important;
}
html body #app .fd-field-affix > input,
html body #app .fd-field :is(input,select,textarea) {
  box-sizing: border-box !important;
  border-radius: 13px !important;
}
html body #app .fd-field :is(input,select,textarea):focus {
  border-color: var(--fd-r138-red) !important;
  border-radius: 13px !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09) !important;
  outline: none !important;
}
html body #app .fd-field-affix:focus-within > input {
  border-color: var(--fd-r138-red) !important;
  border-radius: inherit !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09) !important;
  outline: none !important;
}
html[data-fd-theme="light"] body #app .fd-field :is(input,select,textarea):focus,
html[data-fd-theme="light"] body #app .fd-field-affix:focus-within > input {
  box-shadow: inset 0 1px rgba(255,255,255,.98) !important;
}
html body .fd-feature-page .fd-field-affix {
  border-radius: 13px !important;
}
html body .fd-feature-page .fd-field-affix > input,
html body .fd-feature-page .fd-field :is(input,select,textarea) {
  box-sizing: border-box !important;
  border-radius: 13px !important;
}
html body .fd-feature-page .fd-field :is(input,select,textarea):focus {
  border-color: var(--fd-r138-red) !important;
  border-radius: 13px !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09) !important;
  outline: none !important;
}
html body .fd-feature-page .fd-field-affix:focus-within > input {
  border-color: var(--fd-r138-red) !important;
  border-radius: inherit !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09) !important;
  outline: none !important;
}
html[data-fd-theme="light"] body .fd-feature-page .fd-field :is(input,select,textarea):focus,
html[data-fd-theme="light"] body .fd-feature-page .fd-field-affix:focus-within > input {
  box-shadow: inset 0 1px rgba(255,255,255,.98) !important;
}

/* A selected choice, primary action and every price accent resolve to one red. */
html body #app {
  --brand-red: var(--fd-r138-red) !important;
  --fd-r90-red: var(--fd-r138-red) !important;
  --fd-r114-red: var(--fd-r138-red) !important;
}
html body :is(
  .fd-alert-kicker,
  .fd-feature-page .fd-feature-card__head > div > small,
  .fd-feature-page .fd-account-page-title > small,
  .fd-feature-page .fd-feature-heading > small
) {
  color: var(--fd-r138-red) !important;
}
html body #app :is(
  .fd-auth-primary,
  .fd-tank-submit,
  .fd-alert-enable,
  .station-sort > button.is-active,
  .fuel-preference button.is-active,
  .nearby-radius button.is-active,
  .chart-range button.is-active,
  .detail-price-card.is-selected,
  .primary-station-action.is-active
) {
  border-color: var(--fd-r138-red) !important;
  background-color: var(--fd-r138-red) !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
}
html body .fd-alert-modal .fd-alert-enable {
  border-color: var(--fd-r138-red) !important;
  background-color: var(--fd-r138-red) !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
}
html body .fd-feature-page :is(.fd-auth-primary,.fd-tank-submit) {
  border-color: var(--fd-r138-red) !important;
  background-color: var(--fd-r138-red) !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
}
html body #app :is(
  .station-value > strong,
  .station-value .price-change.is-higher,
  .station-detail-link,
  .favorites-screen-card .station-value > strong,
  .dashboard-favorite-card .station-value > strong,
  .favorite-toggle.is-favorite,
  .detail-favorite.is-favorite
) {
  color: var(--fd-r138-red) !important;
}

/* Search and detail maps share the same fully opaque selected marker. */
html body #app .map-price-marker.is-selected {
  border-color: var(--fd-r138-red) !important;
  background-color: var(--fd-r138-red) !important;
  background-image: none !important;
  color: #fff !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.68) !important;
}
html body #app .hero-map-layer .map-price-marker,
html body #app .hero-map-layer .map-price-marker.is-selected {
  background-color: var(--fd-r138-red) !important;
  opacity: 1 !important;
  box-shadow: 0 7px 18px rgba(0,0,0,.52) !important;
}

/* Cloud information uses the page's normal note typography instead of headline styling. */
html body .fd-feature-page[data-fd-feature-view="account"] :is(.fd-account-page-status,.fd-account-page-card) > p,
html body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status small {
  margin: 0 !important;
  color: #a8a8ae !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.48 !important;
  letter-spacing: 0 !important;
}
html body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status small {
  display: block !important;
  margin-top: 12px !important;
  font-size: 13px !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="account"] :is(.fd-account-page-status,.fd-account-page-card) > p,
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status small {
  color: #6c6c73 !important;
}


/* ===== r139-input-information-hierarchy.css ===== */
/* FuelDash R139 — inputs are interactable, information stays visually quiet. */
:root {
  --fd-r139-input-dark: linear-gradient(145deg, rgba(45,45,50,.88), rgba(31,31,36,.90));
  --fd-r139-input-light: linear-gradient(145deg, rgba(255,255,255,.98), rgba(235,235,240,.92));
  --fd-r139-input-border-dark: rgba(255,255,255,.10);
  --fd-r139-input-border-light: rgba(35,35,40,.14);
  --fd-r139-info-dark: linear-gradient(145deg, rgba(22,22,25,.94), rgba(9,9,11,.97));
  --fd-r139-info-light: linear-gradient(145deg, rgba(255,255,255,.96), rgba(237,237,241,.88));
}

/* Preisverlauf remains one segmented control; the inactive range has no individual tile. */
html body #app .chart-range {
  padding: 4px !important;
  border-color: #2c2c31 !important;
  background-image: var(--fd-r138-control-dark) !important;
  box-shadow: var(--fd-r138-control-shadow-dark) !important;
}
html body #app .chart-range > button:not(.is-active) {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #b9b9c0 !important;
}
html body #app .chart-range > button.is-disabled {
  opacity: .62 !important;
}
html[data-fd-theme="light"] body #app .chart-range {
  border-color: var(--fd-r138-control-border-light) !important;
  background-image: var(--fd-r138-control-light) !important;
  box-shadow: var(--fd-r138-control-shadow-light) !important;
}
html[data-fd-theme="light"] body #app .chart-range > button:not(.is-active) { color: #65656c !important; }

/* The profile password input is the single editable-field reference everywhere. */
html body .fd-feature-page :is(.fd-field input,.fd-field select,.fd-field textarea,.fd-auth-form input,.fd-account-card__password input),
html body .fd-account-sheet .fd-auth-form input,
html body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]),
html body #app .search-field {
  border-color: var(--fd-r139-input-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r139-input-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045) !important;
  color: #f7f7f8 !important;
  -webkit-backdrop-filter: blur(18px) saturate(122%) !important;
  backdrop-filter: blur(18px) saturate(122%) !important;
}
html[data-fd-theme="light"] body .fd-feature-page :is(.fd-field input,.fd-field select,.fd-field textarea,.fd-auth-form input,.fd-account-card__password input),
html[data-fd-theme="light"] body .fd-account-sheet .fd-auth-form input,
html[data-fd-theme="light"] body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]),
html[data-fd-theme="light"] body #app .search-field {
  border-color: var(--fd-r139-input-border-light) !important;
  background-image: var(--fd-r139-input-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98) !important;
  color: #303036 !important;
}

/* Input focus stays within the real field silhouette. */
html body .fd-feature-page :is(.fd-field input,.fd-field select,.fd-field textarea,.fd-auth-form input,.fd-account-card__password input):focus,
html body .fd-account-sheet .fd-auth-form input:focus,
html body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]):focus {
  border-color: var(--fd-r138-red) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045) !important;
  outline: none !important;
}

/* Tankbuch values and recommendation facts are information, not faux inputs. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-tank-summary > article,.fd-month-grid > article),
html body #app .primary-station-card__facts > span,
html body .fd-alert-modal :is(.fd-alert-row,.fd-alert-station,.fd-alert-empty) {
  border-color: var(--fd-r119-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r139-info-dark) !important;
  box-shadow: var(--fd-r119-card-shadow-dark) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-tank-summary > article,.fd-month-grid > article),
html[data-fd-theme="light"] body #app .primary-station-card__facts > span,
html[data-fd-theme="light"] body .fd-alert-modal :is(.fd-alert-row,.fd-alert-station,.fd-alert-empty) {
  border-color: var(--fd-r119-border-light) !important;
  background-image: var(--fd-r139-info-light) !important;
  box-shadow: var(--fd-r119-card-shadow-light) !important;
}

/* Login keeps its card, segmented switch and fields in the same hierarchy. */
html body .fd-feature-page[data-fd-feature-view="account"] .fd-auth-switch,
html body .fd-account-sheet .fd-auth-switch {
  border-color: #2c2c31 !important;
  background-image: var(--fd-r139-info-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055) !important;
}
html body :is(.fd-feature-page[data-fd-feature-view="account"],.fd-account-sheet) .fd-auth-switch button:not(.is-active) {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #d3d3d8 !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="account"] .fd-auth-switch,
html[data-fd-theme="light"] body .fd-account-sheet .fd-auth-switch {
  border-color: var(--fd-r119-border-light) !important;
  background-image: var(--fd-r139-info-light) !important;
}
html[data-fd-theme="light"] body :is(.fd-feature-page[data-fd-feature-view="account"],.fd-account-sheet) .fd-auth-switch button:not(.is-active) {
  color: #5f5f66 !important;
}


/* ===== r140-interactive-audit.css ===== */
/* FuelDash R140 — final component audit: actions, inputs and selected states. */
:root {
  --fd-r140-red: #ff3b30;
  --fd-r140-neutral-dark: linear-gradient(145deg, rgba(27,27,31,.88), rgba(8,8,11,.96));
  --fd-r140-neutral-light: linear-gradient(145deg, rgba(255,255,255,.96), rgba(235,235,240,.80));
  --fd-r140-neutral-border-dark: #2c2c31;
  --fd-r140-neutral-border-light: rgba(35,35,40,.16);
  --fd-r140-neutral-shadow-dark: inset 0 1px rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.38);
  --fd-r140-neutral-shadow-light: inset 0 1px rgba(255,255,255,.98), 0 9px 22px rgba(35,35,42,.11);
  --fd-r140-input-dark: linear-gradient(145deg, rgba(45,45,50,.88), rgba(31,31,36,.90));
  --fd-r140-input-light: linear-gradient(145deg, rgba(255,255,255,.98), rgba(235,235,240,.92));
  --fd-r140-input-border-dark: rgba(255,255,255,.10);
  --fd-r140-input-border-light: rgba(35,35,40,.14);
}

/* Neutral actions all resolve to the Profile/Reload material. */
html body #app :is(
  .round-button,
  .refresh-pill,
  .map-location-button,
  .route-trigger,
  .route-options a,
  .fd-live-location-button,
  .primary-station-action:not(.is-active),
  .detail-price-card:not(.is-selected),
  .fuel-preference button:not(.is-active),
  .nearby-radius button:not(.is-active)
),
html body .fd-feature-page :is(
  .fd-feature-back,
  .fd-app-reload,
  .fd-auth-secondary,
  .fd-backup-actions button,
  .fd-account-card__action,
  .fd-theme-choice:not(.is-selected)
),
html body .fd-account-sheet :is(.fd-account-sheet__close,.fd-auth-secondary),
html body .fd-alert-modal :is(.fd-alert-close,.fd-alert-test) {
  border-color: var(--fd-r140-neutral-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r140-neutral-dark) !important;
  box-shadow: var(--fd-r140-neutral-shadow-dark) !important;
  color: #f7f7f8 !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}

html[data-fd-theme="light"] body #app :is(
  .round-button,
  .refresh-pill,
  .map-location-button,
  .route-trigger,
  .route-options a,
  .fd-live-location-button,
  .primary-station-action:not(.is-active),
  .detail-price-card:not(.is-selected),
  .fuel-preference button:not(.is-active),
  .nearby-radius button:not(.is-active)
),
html[data-fd-theme="light"] body .fd-feature-page :is(
  .fd-feature-back,
  .fd-app-reload,
  .fd-auth-secondary,
  .fd-backup-actions button,
  .fd-account-card__action,
  .fd-theme-choice:not(.is-selected)
),
html[data-fd-theme="light"] body .fd-account-sheet :is(.fd-account-sheet__close,.fd-auth-secondary),
html[data-fd-theme="light"] body .fd-alert-modal :is(.fd-alert-close,.fd-alert-test) {
  border-color: var(--fd-r140-neutral-border-light) !important;
  background-image: var(--fd-r140-neutral-light) !important;
  box-shadow: var(--fd-r140-neutral-shadow-light) !important;
  color: #303036 !important;
}

/* Segmented ranges are one parent control, not a row of standalone glass tiles. */
html body #app :is(.chart-range,.station-sort,.fuel-tab-bar) {
  border-color: var(--fd-r140-neutral-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r140-neutral-dark) !important;
  box-shadow: var(--fd-r140-neutral-shadow-dark) !important;
}
html body #app :is(.chart-range,.station-sort,.fuel-tab-bar) > button:not(.is-active) {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
html[data-fd-theme="light"] body #app :is(.chart-range,.station-sort,.fuel-tab-bar) {
  border-color: var(--fd-r140-neutral-border-light) !important;
  background-image: var(--fd-r140-neutral-light) !important;
  box-shadow: var(--fd-r140-neutral-shadow-light) !important;
}

/* The Profile password field is the reference for every editable text/select/time field. */
html body .fd-feature-page :is(.fd-field input,.fd-field select,.fd-field textarea,.fd-auth-form input,.fd-account-card__password input),
html body .fd-account-sheet .fd-auth-form input,
html body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]),
html body #app .search-field {
  box-sizing: border-box !important;
  border-color: var(--fd-r140-input-border-dark) !important;
  background-color: transparent !important;
  background-image: var(--fd-r140-input-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045) !important;
  color: #f7f7f8 !important;
  -webkit-backdrop-filter: blur(18px) saturate(122%) !important;
  backdrop-filter: blur(18px) saturate(122%) !important;
}
html[data-fd-theme="light"] body .fd-feature-page :is(.fd-field input,.fd-field select,.fd-field textarea,.fd-auth-form input,.fd-account-card__password input),
html[data-fd-theme="light"] body .fd-account-sheet .fd-auth-form input,
html[data-fd-theme="light"] body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]),
html[data-fd-theme="light"] body #app .search-field {
  border-color: var(--fd-r140-input-border-light) !important;
  background-image: var(--fd-r140-input-light) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98) !important;
  color: #303036 !important;
}
html body .fd-feature-page :is(.fd-field input,.fd-field select,.fd-field textarea,.fd-auth-form input,.fd-account-card__password input):focus,
html body .fd-account-sheet .fd-auth-form input:focus,
html body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]):focus,
html body #app .search-field:focus-within {
  border-color: var(--fd-r140-red) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045) !important;
  outline: none !important;
}
html body .fd-feature-page :is(.fd-field input,.fd-field select,.fd-field textarea,.fd-auth-form input,.fd-account-card__password input)::placeholder,
html body .fd-account-sheet .fd-auth-form input::placeholder,
html body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"])::placeholder {
  color: currentColor !important;
  opacity: .46 !important;
}

/* The period is a selected date action, intentionally distinct from a free-text field. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  border-color: var(--fd-r140-red) !important;
  background-color: var(--fd-r140-red) !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control :is(svg,.fd-statistics-date__label,input) {
  color: #fff !important;
}

/* Selected actions share the standard red without a red halo. */
html body :is(
  .fd-feature-page .fd-auth-primary,
  .fd-feature-page .fd-tank-submit,
  .fd-account-sheet .fd-auth-primary,
  .fd-alert-modal .fd-alert-enable,
  #app .station-sort > button.is-active,
  #app .fuel-preference button.is-active,
  #app .nearby-radius button.is-active,
  #app .chart-range button.is-active,
  #app .detail-price-card.is-selected,
  #app .primary-station-action.is-active
) {
  border-color: var(--fd-r140-red) !important;
  background-color: var(--fd-r140-red) !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
  color: #fff !important;
}
html body .fd-feature-page .fd-theme-choice.is-selected {
  border-color: var(--fd-r140-red) !important;
  box-shadow: inset 0 0 0 1px rgba(255,59,48,.28) !important;
}


/* ===== r141-visual-harmony.css ===== */
/* FuelDash R141 — opaque field and information tokens for visual harmony. */
:root {
  --fd-r141-red: #ff3b30;
  --fd-r141-field-dark: linear-gradient(145deg, #2b2b30, #222227);
  --fd-r141-field-light: linear-gradient(145deg, #ffffff, #ececf0);
  --fd-r141-field-border-dark: #3a3a41;
  --fd-r141-field-border-light: #d2d2d8;
  --fd-r141-info-dark: linear-gradient(145deg, #161619, #0b0b0e);
  --fd-r141-info-light: linear-gradient(145deg, #ffffff, #f0f0f3);
  --fd-r141-info-border-dark: #28282e;
  --fd-r141-info-border-light: #d9d9de;
}

/*
 * Editable controls share one opaque surface. Opaque colors are intentional:
 * the same field must not become darker merely because its parent card is darker.
 */
html body #app .search-field,
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field :is(input,select,textarea),
html body .fd-feature-page[data-fd-feature-view="account"] :is(.fd-auth-form input,.fd-account-card__password input),
html body .fd-account-sheet .fd-auth-form input,
html body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  box-sizing: border-box !important;
  border-color: var(--fd-r141-field-border-dark) !important;
  background-color: #222227 !important;
  background-image: var(--fd-r141-field-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.07) !important;
  color: #f7f7f8 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="light"] body #app .search-field,
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field :is(input,select,textarea),
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="account"] :is(.fd-auth-form input,.fd-account-card__password input),
html[data-fd-theme="light"] body .fd-account-sheet .fd-auth-form input,
html[data-fd-theme="light"] body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  border-color: var(--fd-r141-field-border-light) !important;
  background-color: #ececf0 !important;
  background-image: var(--fd-r141-field-light) !important;
  box-shadow: inset 0 1px #fff !important;
  color: #28282e !important;
}

/* Search has one visible outer field; its internal native input remains transparent. */
html body #app .search-field :is(input,.search-field-action,.search-field-clear) {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Field focus follows the real rounded silhouette without a detached halo. */
html body #app .search-field:focus-within,
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field :is(input,select,textarea):focus,
html body .fd-feature-page[data-fd-feature-view="account"] :is(.fd-auth-form input,.fd-account-card__password input):focus,
html body .fd-account-sheet .fd-auth-form input:focus,
html body .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]):focus {
  border-color: var(--fd-r141-red) !important;
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.07), inset 0 0 0 1px var(--fd-r141-red) !important;
}

html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field :is(input,textarea)::placeholder,
html body .fd-feature-page[data-fd-feature-view="account"] :is(.fd-auth-form input,.fd-account-card__password input)::placeholder,
html body .fd-account-sheet .fd-auth-form input::placeholder {
  color: #a4a4ac !important;
  opacity: .72 !important;
}

/* The red full-width period control is an active date action, not a free-text field. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  border-color: var(--fd-r141-red) !important;
  background-color: var(--fd-r141-red) !important;
  background-image: none !important;
  color: #fff !important;
}

/* Tankbook values, history states and recommendation facts are quiet information surfaces. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry,
  .fd-tank-empty
),
html body #app .primary-station-card__facts > span,
html body #app .fuel-preference button:not(.is-active) {
  border-color: var(--fd-r141-info-border-dark) !important;
  background-color: #0b0b0e !important;
  background-image: var(--fd-r141-info-dark) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.035) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry,
  .fd-tank-empty
),
html[data-fd-theme="light"] body #app .primary-station-card__facts > span,
html[data-fd-theme="light"] body #app .fuel-preference button:not(.is-active) {
  border-color: var(--fd-r141-info-border-light) !important;
  background-color: #f0f0f3 !important;
  background-image: var(--fd-r141-info-light) !important;
  box-shadow: inset 0 1px #fff !important;
}

html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-empty {
  color: #f3f3f5 !important;
}
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-empty p {
  color: #92929a !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-empty {
  color: #28282e !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-empty p {
  color: #6c6c74 !important;
}

/* Price-alert operational status is prose only, with semantic text color. */
html body .fd-alert-modal .fd-alert-status {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 0 14px !important;
  padding: 0 2px 2px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  font-size: 13px !important;
  font-weight: 550 !important;
  line-height: 1.45 !important;
}
html body .fd-alert-modal .fd-alert-status[data-tone="active"] { color: #30d158 !important; }
html body .fd-alert-modal .fd-alert-status[data-tone="inactive"] { color: var(--fd-r141-red) !important; }
html body .fd-alert-modal .fd-alert-status:is([data-tone="error"],[data-tone="pending"]) { color: #ff9f43 !important; }

/* Account status follows the same kicker / title / note hierarchy as the feature cards. */
html body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status > div > small:first-child {
  display: block !important;
  margin: 0 !important;
  color: var(--fd-r141-red) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
html body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status h2 {
  margin: 6px 0 0 !important;
  font-size: 20px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  letter-spacing: -.018em !important;
}
html body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status p {
  margin: 8px 0 0 !important;
  color: #a8a8ae !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.46 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}
html body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status > div > small:last-child:not(:first-child) {
  display: block !important;
  margin: 9px 0 0 !important;
  color: #8f8f96 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status p {
  color: #66666e !important;
}
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-status > div > small:last-child:not(:first-child) {
  color: #777780 !important;
}


/* ===== r142-final-visual-fixes.css ===== */
/* FuelDash R142 — five final visual corrections without changing page structure. */
:root { --fd-r142-red: #ff3b30; }

/* Recommendation facts are information embedded in the parent card, not raised glass controls. */
html body #app .primary-station-card__facts > span {
  border-color: #232329 !important;
  background: #0c0c0f !important;
  background-color: #0c0c0f !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-fd-theme="light"] body #app .primary-station-card__facts > span {
  border-color: #dedee3 !important;
  background: #f3f3f5 !important;
  background-color: #f3f3f5 !important;
}

/* Only the rounded search shell owns the focus indication. */
html body #app .search-field input:is(:focus,:focus-visible) {
  border: 0 !important;
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
}
html body #app .search-field:focus-within {
  border-color: var(--fd-r142-red) !important;
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.07), inset 0 0 0 1px var(--fd-r142-red) !important;
}

/* Label-to-control and control-to-statistics spacing now share a deliberate rhythm. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date {
  gap: 12px !important;
  row-gap: 12px !important;
  margin-bottom: 14px !important;
}

/* Remove the alert status card itself; only its semantic copy remains in layout. */
html body:not(#fd-r142-status-scope) .fd-alert-modal .fd-alert-status {
  display: contents !important;
  border: 0 !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html body:not(#fd-r142-status-scope) .fd-alert-modal .fd-alert-status::before,
html body:not(#fd-r142-status-scope) .fd-alert-modal .fd-alert-status::after {
  content: none !important;
  display: none !important;
}
html body:not(#fd-r142-status-scope) .fd-alert-modal .fd-alert-status__text {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 0 14px !important;
  padding: 0 2px 2px !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: inherit !important;
  font: inherit !important;
}

/* The account note stays visible as a compact label immediately left of Profile. */
html body #app .fd-main-header-actions .fd-profile-greeting:not([hidden]) {
  display: block !important;
  visibility: visible !important;
  flex: 0 1 52px !important;
  max-width: 52px !important;
  margin: 0 -2px 0 0 !important;
  overflow: hidden !important;
  color: #8d8d95 !important;
  font-size: 9.5px !important;
  font-weight: 560 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-align: right !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
html[data-fd-theme="light"] body #app .fd-main-header-actions .fd-profile-greeting:not([hidden]) {
  color: #6f6f77 !important;
}


/* ===== r144-visible-build.css ===== */
/* FuelDash R144 — the build marker is always visible in the About row. */
html body #app .about-build > em[data-fd-visible-build] {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-width: max-content !important;
  color: #8d8d95 !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}
html body #app .about-build > em[data-fd-visible-build] small {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin-top: 2px !important;
  color: #6f6f77 !important;
  font-size: 10px !important;
}
html[data-fd-theme="light"] body #app .about-build > em[data-fd-visible-build] { color: #66666e !important; }
html[data-fd-theme="light"] body #app .about-build > em[data-fd-visible-build] small { color: #85858d !important; }


/* ===== r145-identical-input-surfaces.css ===== */
/* FuelDash R145 — one literal material for Search, Account and Tankbook inputs. */
:root {
  --fd-r145-input-dark: #17171c;
  --fd-r145-input-light: #eeeef2;
  --fd-r145-input-border-dark: #323239;
  --fd-r145-input-border-light: #d1d1d7;
  --fd-r145-input-text-dark: #f7f7f8;
  --fd-r145-input-text-light: #27272d;
}

html body:not(#fd-r145-input-scope) #app .search-field,
html body:not(#fd-r145-input-scope) .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field :is(input,select,textarea),
html body:not(#fd-r145-input-scope) .fd-feature-page[data-fd-feature-view="account"] :is(.fd-auth-form input,.fd-account-card__password input),
html body:not(#fd-r145-input-scope) .fd-account-sheet .fd-auth-form input {
  box-sizing: border-box !important;
  border-color: var(--fd-r145-input-border-dark) !important;
  background: var(--fd-r145-input-dark) !important;
  background-color: var(--fd-r145-input-dark) !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055) !important;
  color: var(--fd-r145-input-text-dark) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="light"] body:not(#fd-r145-input-scope) #app .search-field,
html[data-fd-theme="light"] body:not(#fd-r145-input-scope) .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field :is(input,select,textarea),
html[data-fd-theme="light"] body:not(#fd-r145-input-scope) .fd-feature-page[data-fd-feature-view="account"] :is(.fd-auth-form input,.fd-account-card__password input),
html[data-fd-theme="light"] body:not(#fd-r145-input-scope) .fd-account-sheet .fd-auth-form input {
  border-color: var(--fd-r145-input-border-light) !important;
  background: var(--fd-r145-input-light) !important;
  background-color: var(--fd-r145-input-light) !important;
  background-image: none !important;
  box-shadow: inset 0 1px #fff !important;
  color: var(--fd-r145-input-text-light) !important;
}

/* Search paints the material on its rounded shell; the native text input stays clear. */
html body:not(#fd-r145-input-scope) #app .search-field > input {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: inherit !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body:not(#fd-r145-input-scope) #app .search-field:focus-within,
html body:not(#fd-r145-input-scope) .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field :is(input,select,textarea):focus,
html body:not(#fd-r145-input-scope) .fd-feature-page[data-fd-feature-view="account"] :is(.fd-auth-form input,.fd-account-card__password input):focus,
html body:not(#fd-r145-input-scope) .fd-account-sheet .fd-auth-form input:focus {
  border-color: #ff3b30 !important;
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055), inset 0 0 0 1px #ff3b30 !important;
}


/* ===== r146-price-alert-input-surfaces.css ===== */
/* FuelDash R146 — Price-alert editors use the exact R145 input material. */
:root {
  --fd-r146-input-dark: #17171c;
  --fd-r146-input-light: #eeeef2;
  --fd-r146-input-border-dark: #323239;
  --fd-r146-input-border-light: #d1d1d7;
}

html body:not(#fd-r146-alert-input-scope) .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  box-sizing: border-box !important;
  border-color: var(--fd-r146-input-border-dark) !important;
  background: var(--fd-r146-input-dark) !important;
  background-color: var(--fd-r146-input-dark) !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055) !important;
  color: #f7f7f8 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="light"] body:not(#fd-r146-alert-input-scope) .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]) {
  border-color: var(--fd-r146-input-border-light) !important;
  background: var(--fd-r146-input-light) !important;
  background-color: var(--fd-r146-input-light) !important;
  background-image: none !important;
  box-shadow: inset 0 1px #fff !important;
  color: #27272d !important;
}

html body:not(#fd-r146-alert-input-scope) .fd-alert-modal .fd-alert-row :is(select,input[type="time"],input[type="number"]):focus {
  border-color: #ff3b30 !important;
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055), inset 0 0 0 1px #ff3b30 !important;
}


/* ===== r147-tankbook-dark-parity.css ===== */
/* FuelDash R147 — Tankbook top-level cards use the exact Preisalarm card material. */
html[data-fd-theme="dark"] body:not(#fd-r147-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-feature-content > .fd-feature-card,
html[data-fd-theme="dark"] body:not(#fd-r147-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-feature-content > .fd-tank-history,
html[data-fd-theme="dark"] body:not(#fd-r147-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-feature-content > .fd-account-card {
  border: 1px solid rgba(255,255,255,.09) !important;
  background: linear-gradient(145deg, rgba(22,22,25,.94), rgba(9,9,11,.97)) !important;
  background-image: linear-gradient(145deg, rgba(22,22,25,.94), rgba(9,9,11,.97)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055), 0 16px 36px rgba(0,0,0,.22) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}

html[data-fd-theme="light"] body:not(#fd-r147-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-feature-content > .fd-feature-card,
html[data-fd-theme="light"] body:not(#fd-r147-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-feature-content > .fd-tank-history,
html[data-fd-theme="light"] body:not(#fd-r147-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-feature-content > .fd-account-card {
  border: 1px solid rgba(35,35,40,.12) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(240,240,244,.94)) !important;
  background-image: linear-gradient(145deg, rgba(255,255,255,.98), rgba(240,240,244,.94)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.98), 0 12px 30px rgba(35,35,42,.09) !important;
  -webkit-backdrop-filter: blur(24px) saturate(126%) !important;
  backdrop-filter: blur(24px) saturate(126%) !important;
}


/* ===== r151-core-design.css ===== */
/* FuelDash R151 — Core: flat OLED-black-only design system. */
:root {
  --fd-page: #000000;
  --fd-surface: #0a0a0c;
  --fd-surface-raised: #111114;
  --fd-field: #17171b;
  --fd-border: #26262b;
  --fd-border-strong: #35353b;
  --fd-text: #f5f5f7;
  --fd-muted: #a1a1a8;
  --fd-subtle: #74747c;
  --fd-accent: #ff3b30;
  --fd-positive: #30d158;
  --fd-negative: #ff453a;
  --fd-warning: #ff9f0a;
  --fd-success-surface: #0b2113;
  --fd-error-surface: #29100f;
  --fd-focus-ring: #ff3b30;
  --brand-red: var(--fd-accent);
  --control-glass: var(--fd-field);
  --control-border: var(--fd-border-strong);
  --control-text: var(--fd-text);
  --control-active: var(--fd-accent);
  --control-active-border: var(--fd-accent);
  color-scheme: dark;
}

html,
body,
#app,
#app .app-shell,
#app .app-content,
#app .detail-view {
  background-color: var(--fd-page) !important;
  background-image: none !important;
  color: var(--fd-text) !important;
}

html,
body {
  min-height: 100%;
  overscroll-behavior-y: auto !important;
}

body {
  min-height: 100dvh;
}

/* Remove every legacy glass effect from active application surfaces. */
html body :is(#app, .fd-feature-page, .fd-account-sheet, .fd-alert-modal, .fd-startup-cover) :is(
  .glass-card,
  .price-hero,
  .dashboard-section,
  .chart-block,
  .favorites-block,
  .fuel-preference,
  .nearby-radius,
  .menu-card,
  .station-card,
  .station-result,
  .dashboard-favorite-card,
  .favorites-screen-card,
  .primary-station-card,
  .detail-card,
  .detail-price-card,
  .detail-prices,
  .detail-chart,
  .fuel-map,
  .search-field,
  .search-suggestion-panel,
  .route-options,
  .route-chooser,
  .chart-range,
  .station-sort,
  .fuel-tab-bar,
  .tab-stepper__controls,
  .fd-best,
  .fd-feature-card,
  .fd-theme-choice,
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry,
  .fd-account-card,
  .fd-account-page-status,
  .fd-auth-switch,
  .fd-alert-status,
  .fd-alert-row,
  .fd-alert-station,
  .fd-alert-empty,
  .bottom-nav,
  .round-button,
  .refresh-pill,
  .map-location-button,
  .route-trigger,
  .fd-live-location-button,
  .primary-station-action,
  .fd-feature-back,
  .fd-app-reload,
  .fd-auth-primary,
  .fd-auth-secondary,
  .fd-alert-enable,
  .fd-alert-test
) {
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  text-shadow: none !important;
}

/* Primary content cards. Existing radii, sizes and placement intentionally remain untouched. */
html body #app :is(
  .glass-card,
  .price-hero,
  .dashboard-section.glass-card,
  .chart-block,
  .favorites-block,
  .fuel-preference,
  .nearby-radius,
  .menu-card,
  .station-card,
  .station-result,
  .dashboard-favorite-card,
  .favorites-screen-card,
  .primary-station-card,
  .detail-card,
  .detail-prices,
  .detail-chart,
  .search-suggestion-panel,
  .fd-best
) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body #app :is(
  .detail-price-card,
  .primary-station-card__facts > span,
  .chart-selection-readout,
  .detail-history-status,
  .station-opening-hours > span,
  .tab-stepper__controls,
  .route-options,
  .fuel-tab-bar,
  .chart-range,
  .station-sort
) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Flat dashboard map card: preserve the live map, replace its decorative color wash. */
html body #app .fd-best__map {
  background-color: var(--fd-surface-raised) !important;
  opacity: 1 !important;
}

html body #app .fd-best::after {
  display: block !important;
  content: "" !important;
  background-color: #000000 !important;
  background-image: none !important;
  opacity: .68 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body #app .fd-best::before {
  border-color: var(--fd-border) !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body #app .fd-best__copy,
html body #app .fd-best__chevron {
  text-shadow: none !important;
}

html body #app .hero-map-layer::after {
  background-color: #000000 !important;
  background-image: none !important;
  opacity: .42 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body #app .fuel-advice-card::before,
html body #app .fuel-advice-card::after {
  display: none !important;
  content: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Neutral controls and compact actions. */
html body #app :is(
  .round-button,
  .refresh-pill,
  .map-location-button,
  .route-trigger,
  .route-options a,
  .fd-live-location-button,
  .primary-station-action:not(.is-active),
  .detail-price-card:not(.is-selected),
  .tab-stepper__toggle,
  .tab-stepper__controls button
),
html body .fd-feature-page :is(
  .round-button,
  .fd-feature-back,
  .fd-app-reload,
  .fd-auth-secondary,
  .fd-backup-actions button,
  .fd-account-card__action,
  .fd-theme-choice:not(.is-selected)
),
html body .fd-account-sheet :is(.fd-account-sheet__close, .fd-auth-secondary),
html body .fd-alert-modal :is(.fd-alert-close, .fd-alert-test) {
  border-color: var(--fd-border-strong) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

/* Segmented controls are one surface. Inactive buttons never become extra tiles. */
html body #app :is(
  .chart-range,
  .station-sort,
  .fuel-tab-bar,
  .fuel-filter,
  .favorites-filter,
  .favorite-filter
) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body #app :is(
  .chart-range,
  .station-sort,
  .fuel-tab-bar,
  .fuel-filter,
  .favorites-filter,
  .favorite-filter
) > button:not(.is-active):not([aria-pressed="true"]):not([aria-selected="true"]),
html body #app :is(.fuel-preference, .nearby-radius) button:not(.is-active):not([aria-pressed="true"]):not([aria-selected="true"]) {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-muted) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

/* Inputs: one material across Search, Preisalarm, Tankbuch and Konto. */
html body #app .search-field,
html body .fd-feature-page .fd-field :is(input, select, textarea),
html body .fd-feature-page :is(.fd-auth-form input, .fd-account-card__password input),
html body .fd-account-sheet .fd-auth-form input,
html body .fd-alert-modal .fd-alert-row :is(select, input[type="time"], input[type="number"]),
html body .fd-backup-input {
  box-sizing: border-box !important;
  border-color: var(--fd-border-strong) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body #app .search-field > input {
  border: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: inherit !important;
}

html body #app .search-field:focus-within,
html body .fd-feature-page .fd-field :is(input, select, textarea):focus,
html body .fd-feature-page :is(.fd-auth-form input, .fd-account-card__password input):focus,
html body .fd-account-sheet .fd-auth-form input:focus,
html body .fd-alert-modal .fd-alert-row :is(select, input[type="time"], input[type="number"]):focus {
  border-color: var(--fd-focus-ring) !important;
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-focus-ring) !important;
}

html body :is(input, textarea)::placeholder {
  color: var(--fd-subtle) !important;
  opacity: 1 !important;
}

/* Feature pages, account sheets and price-alert modal. */
html body .fd-feature-page,
html body .fd-account-sheet,
html body .fd-alert-modal {
  background-color: var(--fd-page) !important;
  background-image: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body :is(.fd-feature-header, .fd-account-page-header, .fd-alert-head) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-page) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body .fd-account-sheet__backdrop {
  background-color: #000000 !important;
  opacity: .72 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body .fd-account-sheet__panel,
html body .fd-feature-page :is(
  .fd-feature-card,
  .fd-theme-choice,
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry,
  .fd-account-card,
  .fd-account-page-status,
  .fd-tank-history
),
html body .fd-alert-modal :is(.fd-alert-status, .fd-alert-row, .fd-alert-station, .fd-alert-empty) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body .fd-feature-page :is(
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry__values > span,
  .fd-feature-card__head > span,
  .fd-tank-history__head > span,
  .fd-auth-switch
),
html body .fd-alert-modal :is(.fd-alert-row, .fd-alert-station, .fd-alert-empty) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .fd-feature-page .fd-auth-switch button:not(.is-active),
html body .fd-account-sheet .fd-auth-switch button:not(.is-active) {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-muted) !important;
}

html body .fd-theme-preview,
html body .fd-theme-preview.is-dark {
  border-color: var(--fd-border-strong) !important;
  background-color: #000000 !important;
  background-image: none !important;
  color: #f5f5f7 !important;
  box-shadow: none !important;
}

html body .fd-theme-preview__card {
  border-color: #26262b !important;
  background-color: #0a0a0c !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .fd-theme-preview__nav {
  background-color: #111114 !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Primary actions and selected states share one exact red. */
html body #app :is(
  .station-sort button.is-active,
  .fuel-tab-bar button.is-active,
  .fuel-filter button.is-active,
  .chart-range button.is-active,
  .fuel-preference button.is-active,
  .nearby-radius button.is-active,
  .favorites-filter button.is-active,
  .favorite-filter button.is-active,
  .detail-price-card.is-selected,
  .primary-station-action.is-active
),
html body .fd-feature-page :is(
  .fd-auth-primary,
  .fd-tank-submit,
  .fd-theme-choice.is-selected .fd-theme-choice__check,
  .fd-auth-switch button.is-active
),
html body .fd-account-sheet :is(.fd-auth-primary, .fd-auth-switch button.is-active),
html body .fd-alert-modal .fd-alert-enable {
  border-color: var(--fd-accent) !important;
  background-color: var(--fd-accent) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html body #app :is(
  .station-sort button.is-active,
  .fuel-tab-bar button.is-active,
  .fuel-filter button.is-active,
  .chart-range button.is-active,
  .fuel-preference button.is-active,
  .nearby-radius button.is-active,
  .detail-price-card.is-selected,
  .primary-station-action.is-active
) :is(span, strong, small, svg) {
  color: #ffffff !important;
  stroke: currentColor !important;
}

html body #app :is(.station-card.is-selected, .favorites-screen-card.is-primary-station),
html body .fd-feature-page .fd-theme-choice.is-selected {
  border-color: var(--fd-accent) !important;
  background-color: var(--fd-surface) !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 1px var(--fd-accent) !important;
}

html body #app :is(.search-availability-filter, .closed-stations-filter),
html body #app :is(.search-availability-filter, .closed-stations-filter) :is(button, label) {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body #app .search-availability-filter button.is-active .search-availability-filter__box {
  border-color: var(--fd-accent) !important;
  background-color: var(--fd-accent) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Brand, prices and semantic price changes. */
html body .brand-wordmark span {
  color: var(--fd-text) !important;
}

html body .brand-wordmark strong,
html body :is(
  .fd-alert-kicker,
  .fd-feature-heading > small,
  .fd-feature-card__head small,
  .fd-account-page-title > small,
  .fd-tank-history__head small
) {
  color: var(--fd-accent) !important;
}

html body .brand-wordmark img {
  filter: none !important;
}

html body #app :is(
  .fd-best__price,
  .station-value > strong,
  .detail-price-card > strong,
  .primary-station-card__price,
  .favorite-toggle.is-favorite,
  .detail-favorite.is-favorite,
  .station-detail-link
) {
  color: var(--fd-accent) !important;
  text-shadow: none !important;
}

html body #app :is(.price-change.is-lower, .fd-best__trend.is-lower) {
  color: var(--fd-positive) !important;
}

html body #app :is(.price-change.is-higher, .fd-best__trend.is-higher) {
  color: var(--fd-negative) !important;
}

html body #app :is(.price-change.is-steady, .fd-best__trend.is-steady) {
  color: var(--fd-muted) !important;
}

/* Typography stays readable in every nested surface. */
html body #app :is(
  h1, h2, h3,
  .location strong,
  .location-line strong,
  .station-copy strong,
  .station-identity h2,
  .primary-station-card__copy strong,
  .primary-station-card__facts b,
  .detail-price-card > strong,
  .station-opening-hours b,
  .menu-card button,
  .route-options a,
  .search-suggestion-panel strong
),
html body :is(.fd-feature-page, .fd-account-sheet, .fd-alert-modal) :is(h1, h2, h3, strong, label) {
  color: var(--fd-text) !important;
}

html body #app :is(
  .location small,
  .location-line small,
  .station-copy small,
  .station-location,
  .screen-lead,
  .empty-state,
  .detail-freshness,
  .freshness-copy,
  .primary-station-card__copy > span,
  .primary-station-card__facts small,
  .detail-history-attribution,
  .chart-context,
  .chart-legend,
  .chart-labels,
  .chart-scale,
  .menu-card em,
  .fd-best__meta,
  .fd-best__trend i
),
html body :is(.fd-feature-page, .fd-account-sheet, .fd-alert-modal) :is(p, small, .fd-alert-note, .fd-form-status) {
  color: var(--fd-muted) !important;
}

/* Map and chart accents remain functional, without glow. */
html body #app .map-price-marker {
  border-color: var(--fd-accent) !important;
  background-color: #4a1412 !important;
  background-image: none !important;
  box-shadow: 0 4px 12px #00000073 !important;
  color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
}

html body #app .map-price-marker.is-selected,
html body #app .hero-map-layer .map-price-marker {
  border-color: var(--fd-accent) !important;
  background-color: var(--fd-accent) !important;
  background-image: none !important;
  box-shadow: 0 4px 12px #00000073 !important;
  color: #ffffff !important;
}

html body #app .user-location-dot {
  background-color: var(--fd-accent) !important;
  box-shadow: 0 0 0 3px var(--fd-page) !important;
}

html body #app :is(.chart-line, .legend-today, .chart-selection-today) {
  color: var(--fd-accent) !important;
  stroke: var(--fd-accent) !important;
}

html body #app :is(.chart-grid, .chart-average, .legend-average, .chart-selection-average) {
  color: var(--fd-subtle) !important;
  stroke: var(--fd-subtle) !important;
}

/* Modal feedback uses opaque semantic surfaces. */
html body .fd-alert-modal .fd-alert-status[data-type="success"],
html body :is(.fd-feature-page, .fd-account-sheet) [data-type="success"] {
  border-color: var(--fd-positive) !important;
  background-color: var(--fd-success-surface) !important;
  color: var(--fd-positive) !important;
}

html body .fd-alert-modal .fd-alert-status[data-type="error"],
html body :is(.fd-feature-page, .fd-account-sheet) [data-type="error"] {
  border-color: var(--fd-negative) !important;
  background-color: var(--fd-error-surface) !important;
  color: var(--fd-negative) !important;
}

/* Bottom navigation and immediate startup paint share the final design. */
html body #app .bottom-nav,
html body .fd-fast-nav {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body #app .bottom-nav button,
html body .fd-fast-nav > span {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-muted) !important;
}

html body #app .bottom-nav button.is-active,
html body #app .bottom-nav button[aria-current="page"],
html body .fd-fast-nav > span:first-child {
  background-color: transparent !important;
  background-image: none !important;
  color: var(--fd-accent) !important;
}

html body .fd-startup-cover,
html body .fd-fast-shell {
  background-color: var(--fd-page) !important;
  background-image: none !important;
  color: var(--fd-text) !important;
}

html body .fd-fast-card {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .fd-startup-cover .fd-fast-card::after {
  display: none !important;
  content: none !important;
  background-image: none !important;
}

html body .fd-fast-line,
html body .fd-fast-kicker,
html body .fd-fast-title {
  background-color: var(--fd-surface-raised) !important;
  background-image: none !important;
}

html body .fd-fast-line.is-price {
  background-color: var(--fd-accent) !important;
  opacity: .42 !important;
}

/* Native and Android-browser consistency. */
html body :is(button, input, select, textarea) {
  -webkit-tap-highlight-color: transparent;
}

html body :is(select, input[type="date"], input[type="time"]) {
  color-scheme: inherit;
}

@media (hover: hover) {
  html body :is(#app, .fd-feature-page, .fd-account-sheet, .fd-alert-modal) button:hover {
    filter: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body :is(#app, .fd-feature-page, .fd-account-sheet, .fd-alert-modal) * {
    scroll-behavior: auto !important;
  }
}

/*
 * Final specificity seal.
 * R145–R147 deliberately used body:not(#release-scope) selectors. This later
 * release scope ensures Core also wins inside every deeply nested feature view.
 */
html[data-fd-theme],
html[data-fd-theme] body:not(#fd-r148-core-scope),
html[data-fd-theme] body:not(#fd-r148-core-scope) #app,
html[data-fd-theme] body:not(#fd-r148-core-scope) #app .app-shell,
html[data-fd-theme] body:not(#fd-r148-core-scope) #app .app-content,
html[data-fd-theme] body:not(#fd-r148-core-scope) #app .detail-view,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-feature-page,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-feature-shell,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-feature-content,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-alert-modal,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-account-sheet,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-startup-cover,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-fast-shell {
  background-color: var(--fd-page) !important;
  background-image: none !important;
  color: var(--fd-text) !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) :is(
  #app,
  .fd-feature-page,
  .fd-account-sheet,
  .fd-alert-modal,
  .fd-startup-cover
) :is(
  .glass-card,
  .price-hero,
  .dashboard-section.glass-card,
  .chart-block,
  .favorites-block,
  .fuel-preference,
  .nearby-radius,
  .menu-card,
  .station-card,
  .station-result,
  .dashboard-favorite-card,
  .favorites-screen-card,
  .primary-station-card,
  .detail-card,
  .detail-prices,
  .detail-chart,
  .search-suggestion-panel,
  .fd-best,
  .fd-feature-card,
  .fd-theme-choice,
  .fd-tank-entry,
  .fd-account-card,
  .fd-account-page-status,
  .fd-tank-history,
  .fd-alert-status,
  .fd-account-sheet__panel
) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  text-shadow: none !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) :is(
  #app,
  .fd-feature-page,
  .fd-account-sheet,
  .fd-alert-modal
) :is(
  .detail-price-card,
  .primary-station-card__facts > span,
  .chart-selection-readout,
  .detail-history-status,
  .station-opening-hours > span,
  .tab-stepper__controls,
  .route-options,
  .fuel-tab-bar,
  .chart-range,
  .station-sort,
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry__values > span,
  .fd-feature-card__head > span,
  .fd-tank-history__head > span,
  .fd-auth-switch,
  .fd-alert-row,
  .fd-alert-station,
  .fd-alert-empty
) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope)
  .fd-feature-page[data-fd-feature-view]
  .fd-feature-content > :is(.fd-feature-card, .fd-tank-history, .fd-account-card) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) #app .search-field,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-feature-page[data-fd-feature-view] .fd-field :is(input, select, textarea),
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-feature-page[data-fd-feature-view="account"] :is(.fd-auth-form input, .fd-account-card__password input),
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-account-sheet .fd-auth-form input,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-alert-modal .fd-alert-row :is(select, input[type="time"], input[type="number"]) {
  border-color: var(--fd-border-strong) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) #app :is(
  .round-button,
  .refresh-pill,
  .map-location-button,
  .route-trigger,
  .fd-live-location-button,
  .primary-station-action:not(.is-active),
  .tab-stepper__toggle
),
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-feature-page :is(
  .fd-feature-back,
  .fd-app-reload,
  .fd-auth-secondary,
  .fd-backup-actions button,
  .fd-account-card__action
),
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-account-sheet :is(.fd-account-sheet__close, .fd-auth-secondary),
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-alert-modal :is(.fd-alert-close, .fd-alert-test) {
  border-color: var(--fd-border-strong) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) #app :is(
  .chart-range,
  .station-sort,
  .fuel-tab-bar,
  .fuel-filter,
  .favorites-filter,
  .favorite-filter
) > button:not(.is-active):not([aria-pressed="true"]):not([aria-selected="true"]),
html[data-fd-theme] body:not(#fd-r148-core-scope) #app :is(.fuel-preference, .nearby-radius)
  button:not(.is-active):not([aria-pressed="true"]):not([aria-selected="true"]) {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-muted) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) #app :is(
  .station-sort button.is-active,
  .fuel-tab-bar button.is-active,
  .fuel-filter button.is-active,
  .chart-range button.is-active,
  .fuel-preference button.is-active,
  .nearby-radius button.is-active,
  .favorites-filter button.is-active,
  .favorite-filter button.is-active,
  .detail-price-card.is-selected,
  .primary-station-action.is-active
),
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-feature-page :is(.fd-auth-primary, .fd-tank-submit, .fd-auth-switch button.is-active),
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-account-sheet :is(.fd-auth-primary, .fd-auth-switch button.is-active),
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-alert-modal .fd-alert-enable {
  border-color: var(--fd-accent) !important;
  background-color: var(--fd-accent) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) #app .search-field:focus-within,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-feature-page[data-fd-feature-view] .fd-field :is(input, select, textarea):focus,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-feature-page[data-fd-feature-view="account"] :is(.fd-auth-form input, .fd-account-card__password input):focus,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-account-sheet .fd-auth-form input:focus,
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-alert-modal .fd-alert-row :is(select, input[type="time"], input[type="number"]):focus {
  border-color: var(--fd-focus-ring) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-focus-ring) !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) #app :is(.station-card.is-selected, .favorites-screen-card.is-primary-station),
html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-feature-page .fd-theme-choice.is-selected {
  border-color: var(--fd-accent) !important;
  background-color: var(--fd-surface) !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 1px var(--fd-accent) !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-alert-modal .fd-alert-status[data-type="success"],
html[data-fd-theme] body:not(#fd-r148-core-scope) :is(.fd-feature-page, .fd-account-sheet) [data-type="success"] {
  border-color: var(--fd-positive) !important;
  background-color: var(--fd-success-surface) !important;
  color: var(--fd-positive) !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) .fd-alert-modal .fd-alert-status[data-type="error"],
html[data-fd-theme] body:not(#fd-r148-core-scope) :is(.fd-feature-page, .fd-account-sheet) [data-type="error"] {
  border-color: var(--fd-negative) !important;
  background-color: var(--fd-error-surface) !important;
  color: var(--fd-negative) !important;
}

/* R149 audit seal: every Preisalarm and Tankbook state uses Core materials. */
html[data-fd-theme] body .fd-alert-modal,
html[data-fd-theme] body .fd-alert-sheet,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] {
  background-color: var(--fd-page) !important;
  background-image: none !important;
  color: var(--fd-text) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body .fd-alert-modal :is(
  .fd-alert-head,
  .fd-alert-grid,
  .fd-alert-station-section,
  .fd-alert-stations,
  .fd-alert-actions
),
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-tank-form,
  .fd-tank-list,
  .fd-backup-actions
) {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body .fd-alert-modal :is(
  .fd-alert-status,
  .fd-alert-row,
  .fd-alert-all,
  .fd-alert-station,
  .fd-alert-empty
),
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-tank-form-card,
  .fd-overall-card,
  .fd-month-card,
  .fd-tank-history,
  .fd-tank-entry,
  .fd-tank-empty,
  .fd-tankbook-cloud-row,
  .fd-backup-card
) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body .fd-alert-modal :is(
  .fd-alert-row,
  .fd-alert-station,
  .fd-alert-empty
),
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry__values > span,
  .fd-statistics-date__control,
  .fd-tank-extras,
  .fd-tank-extras > div
) {
  border-color: var(--fd-border) !important;
  background-color: var(--fd-surface-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-affix {
  border-color: var(--fd-border-strong) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-affix > input {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-month-head,
  .fd-month-grid__wide,
  .fd-statistics-date,
  .fd-tank-entry__head
) {
  color: var(--fd-text) !important;
  text-shadow: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tankbook-cloud-row > button {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-action__icon {
  color: var(--fd-text) !important;
  fill: none !important;
  stroke: currentColor !important;
  filter: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-affix > b,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-statistics-date__label,
  .fd-backup-status,
  .fd-tank-empty p
),
html[data-fd-theme] body .fd-alert-modal :is(
  .fd-alert-note,
  .fd-alert-status__text,
  .fd-alert-station-count,
  .fd-alert-station-section header small
) {
  color: var(--fd-muted) !important;
  text-shadow: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-backup-actions button,
  .fd-tank-delete,
  .fd-tank-extras summary
),
html[data-fd-theme] body .fd-alert-modal :is(
  .fd-alert-close,
  .fd-alert-test
) {
  border-color: var(--fd-border-strong) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  text-shadow: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-submit,
html[data-fd-theme] body .fd-alert-modal .fd-alert-enable {
  border-color: var(--fd-accent) !important;
  background-color: var(--fd-accent) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  text-shadow: none !important;
}

html[data-fd-theme] body :is(.fd-alert-modal, .fd-feature-page[data-fd-feature-view="tankbook"]) :is(
  input[type="checkbox"],
  input[type="radio"]
) {
  accent-color: var(--fd-accent) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-form-status,
  .fd-backup-status,
  .fd-auth-form-status
)[data-type="success"] {
  color: var(--fd-positive) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-form-status,
  .fd-backup-status,
  .fd-auth-form-status
)[data-type="error"] {
  color: var(--fd-negative) !important;
}

/* R151: the closed page stepper shows only its red line, without a hidden plate. */
html[data-fd-theme="dark"] body #app .tab-stepper,
html[data-fd-theme="dark"] body #app .tab-stepper__toggle {
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body #app .tab-stepper:not(.is-open) .tab-stepper__controls {
  display: none !important;
  visibility: hidden !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body #app .tab-stepper__toggle::before,
html[data-fd-theme="dark"] body #app .tab-stepper__toggle::after {
  content: none !important;
  display: none !important;
}

/* R151: native, same-color rubber-band overscroll in every scroll owner. */
html[data-fd-theme="dark"],
html[data-fd-theme="dark"] body,
html[data-fd-theme="dark"] #app,
html[data-fd-theme="dark"] #app .app-shell,
html[data-fd-theme="dark"] #app .app-content,
html[data-fd-theme="dark"] #app .detail-view,
html[data-fd-theme="dark"] .fd-feature-page,
html[data-fd-theme="dark"] .fd-feature-shell,
html[data-fd-theme="dark"] .fd-feature-content,
html[data-fd-theme="dark"] .fd-alert-modal,
html[data-fd-theme="dark"] .fd-alert-sheet {
  background-color: var(--fd-page) !important;
  background-image: none !important;
}

html[data-fd-theme="dark"] body #app :is(.app-shell, .app-content, .detail-view),
html[data-fd-theme="dark"] body .fd-feature-page,
html[data-fd-theme="dark"] body .fd-feature-content,
html[data-fd-theme="dark"] body .fd-alert-sheet {
  overscroll-behavior-y: auto !important;
}

/* R151: only the red line exists while the stepper is closed. */
html[data-fd-theme="dark"] body #app .tab-stepper:not(.is-open) {
  pointer-events: none !important;
}

html[data-fd-theme="dark"] body #app .tab-stepper:not(.is-open) .tab-stepper__toggle {
  pointer-events: auto !important;
}

html[data-fd-theme="dark"] body #app .tab-stepper__toggle > span {
  background-color: var(--fd-accent) !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* R151: route controls use the Core control material without an outer button plate. */
html[data-fd-theme="dark"] body #app .station-route,
html[data-fd-theme="dark"] body #app .route-chooser,
html[data-fd-theme="dark"] body #app .route-options,
html[data-fd-theme="dark"] body #app .route-options > span {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body #app .route-trigger,
html[data-fd-theme="dark"] body #app .route-options > a {
  border-color: var(--fd-border-strong) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

/* R151: opening-hour rows are text only; no haze or colored strip. */
html[data-fd-theme="dark"] body #app .station-opening-hours,
html[data-fd-theme="dark"] body #app .station-opening-hours > span {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

/* R151: every primary More-menu label has the same white hierarchy. */
html[data-fd-theme="dark"] body #app .menu-card.muted {
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body #app .menu-card button,
html[data-fd-theme="dark"] body #app .menu-card.muted button {
  color: var(--fd-text) !important;
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body #app .menu-card button > em {
  color: var(--fd-muted) !important;
  opacity: 1 !important;
}

/* R151: iOS/Android taps reach the real Preisalarm action buttons. */
html[data-fd-theme="dark"] body .fd-alert-modal,
html[data-fd-theme="dark"] body .fd-alert-sheet,
html[data-fd-theme="dark"] body .fd-alert-actions,
html[data-fd-theme="dark"] body .fd-alert-actions > button {
  pointer-events: auto !important;
}

html[data-fd-theme="dark"] body .fd-alert-actions {
  position: relative !important;
  z-index: 2 !important;
  isolation: isolate !important;
}

html[data-fd-theme="dark"] body .fd-alert-actions > button {
  position: relative !important;
  z-index: 1 !important;
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
}

html[data-fd-theme="dark"] body .fd-alert-action-feedback {
  min-height: 1.4em !important;
  margin: 10px 2px 0 !important;
  color: var(--fd-muted) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

html[data-fd-theme="dark"] body .fd-alert-action-feedback[data-type="success"] {
  color: var(--fd-positive) !important;
}

html[data-fd-theme="dark"] body .fd-alert-action-feedback[data-type="error"] {
  color: var(--fd-negative) !important;
}

/* R151: Tankbook labels are structure; only controls receive the field material. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field > span:first-child {
  color: var(--fd-muted) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field > :is(input, select, textarea, .fd-field-affix) {
  border-color: var(--fd-border-strong) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-affix > input {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > summary {
  border-color: var(--fd-border-strong) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}


/* ===== r152-final-seal.css ===== */
/* FuelDash R152 — rendered UI seal. Flat OLED surfaces only. */
:root {
  --fd-page: #000000;
  --fd-surface: #0a0a0c;
  --fd-surface-raised: #111114;
  --fd-field: #17171b;
  --fd-border: #26262b;
  --fd-border-strong: #35353b;
  --fd-text: #f5f5f7;
  --fd-muted: #a1a1a8;
  --fd-accent: #ff3b30;
  --fd-positive: #30d158;
  --fd-negative: #ff453a;
  --fd-page-bg: #000000;
  color-scheme: dark;
}

html[data-fd-theme="dark"],
html[data-fd-theme="dark"] body,
html[data-fd-theme="dark"] #app,
html[data-fd-theme="dark"] #app .app-shell,
html[data-fd-theme="dark"] #app .app-content,
html[data-fd-theme="dark"] #app .detail-view,
html[data-fd-theme="dark"] .fd-feature-page,
html[data-fd-theme="dark"] .fd-feature-shell,
html[data-fd-theme="dark"] .fd-feature-content,
html[data-fd-theme="dark"] .fd-alert-modal,
html[data-fd-theme="dark"] .fd-alert-sheet {
  background: var(--fd-page) !important;
  background-color: var(--fd-page) !important;
  background-image: none !important;
  color: var(--fd-text) !important;
}

html[data-fd-theme="dark"],
html[data-fd-theme="dark"] body {
  min-height: 100% !important;
  overscroll-behavior-y: auto !important;
}

html[data-fd-theme="dark"] body #app :is(.app-shell, .app-content, .detail-view),
html[data-fd-theme="dark"] body .fd-feature-page,
html[data-fd-theme="dark"] body .fd-feature-shell,
html[data-fd-theme="dark"] body .fd-feature-content,
html[data-fd-theme="dark"] body .fd-alert-modal,
html[data-fd-theme="dark"] body .fd-alert-sheet {
  overscroll-behavior-y: auto !important;
}

html[data-fd-theme="dark"] body :is(
  #app,
  .app-shell,
  .app-content,
  .detail-view,
  .fd-feature-page,
  .fd-feature-shell,
  .fd-feature-content,
  .fd-alert-modal,
  .fd-alert-sheet
)::before,
html[data-fd-theme="dark"] body :is(
  #app,
  .app-shell,
  .app-content,
  .detail-view,
  .fd-feature-page,
  .fd-feature-shell,
  .fd-feature-content,
  .fd-alert-modal,
  .fd-alert-sheet
)::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Closed tab stepper: the red handle is the only rendered element. */
html[data-fd-theme="dark"] body #app .tab-stepper:not(.is-open) {
  width: 58px !important;
  min-width: 58px !important;
  height: 14px !important;
  min-height: 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
  pointer-events: none !important;
}

html[data-fd-theme="dark"] body #app .tab-stepper:not(.is-open) .tab-stepper__controls {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

html[data-fd-theme="dark"] body #app .tab-stepper:not(.is-open) .tab-stepper__toggle {
  display: grid !important;
  place-items: center !important;
  width: 58px !important;
  min-width: 58px !important;
  height: 14px !important;
  min-height: 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
  pointer-events: auto !important;
}

html[data-fd-theme="dark"] body #app .tab-stepper__toggle::before,
html[data-fd-theme="dark"] body #app .tab-stepper__toggle::after {
  content: none !important;
  display: none !important;
}

html[data-fd-theme="dark"] body #app .tab-stepper__toggle > span {
  display: block !important;
  width: 36px !important;
  height: 4px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--fd-accent) !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* Route area: no outer plate; only the three real controls receive a surface. */
html[data-fd-theme="dark"] body #app :is(.station-route, .route-chooser, .route-options, .route-options > span) {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body #app :is(.station-route, .route-chooser, .route-options, .route-options > span)::before,
html[data-fd-theme="dark"] body #app :is(.station-route, .route-chooser, .route-options, .route-options > span)::after {
  content: none !important;
  display: none !important;
}

html[data-fd-theme="dark"] body #app .route-options {
  padding: 0 !important;
}

html[data-fd-theme="dark"] body #app .route-options[hidden] {
  display: none !important;
}

html[data-fd-theme="dark"] body #app :is(.route-trigger, .route-options > a) {
  border-color: var(--fd-border-strong) !important;
  background: var(--fd-field) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

/* Opening-hours content is text, never a card or haze. */
html[data-fd-theme="dark"] body #app .station-opening-hours,
html[data-fd-theme="dark"] body #app .station-opening-hours > span {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body #app .station-opening-hours::before,
html[data-fd-theme="dark"] body #app .station-opening-hours::after,
html[data-fd-theme="dark"] body #app .station-opening-hours > span::before,
html[data-fd-theme="dark"] body #app .station-opening-hours > span::after {
  content: none !important;
  display: none !important;
}

/* More: muted only applies to secondary state text, never to the menu label. */
html[data-fd-theme="dark"] body #app .menu-card.muted {
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body #app .menu-card button,
html[data-fd-theme="dark"] body #app .menu-card.muted button {
  color: var(--fd-text) !important;
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body #app .menu-card button > em {
  color: var(--fd-muted) !important;
  opacity: 1 !important;
}

/* Preisalarm: all controls are above decorative layers and remain real touch targets. */
html[data-fd-theme="dark"] body .fd-alert-modal,
html[data-fd-theme="dark"] body .fd-alert-sheet,
html[data-fd-theme="dark"] body .fd-alert-actions,
html[data-fd-theme="dark"] body .fd-alert-actions > button {
  pointer-events: auto !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal::before,
html[data-fd-theme="dark"] body .fd-alert-modal::after,
html[data-fd-theme="dark"] body .fd-alert-sheet::before,
html[data-fd-theme="dark"] body .fd-alert-sheet::after,
html[data-fd-theme="dark"] body .fd-alert-actions::before,
html[data-fd-theme="dark"] body .fd-alert-actions::after {
  content: none !important;
  display: none !important;
  pointer-events: none !important;
}

html[data-fd-theme="dark"] body .fd-alert-actions {
  position: relative !important;
  z-index: 20 !important;
  isolation: isolate !important;
}

html[data-fd-theme="dark"] body .fd-alert-actions > button {
  position: relative !important;
  z-index: 21 !important;
  min-height: 48px !important;
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
}

html[data-fd-theme="dark"] body .fd-alert-test {
  border-color: var(--fd-border-strong) !important;
  background: var(--fd-field) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-alert-enable {
  border-color: var(--fd-accent) !important;
  background: var(--fd-accent) !important;
  background-color: var(--fd-accent) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

/* Tankbuch: one card, field and nested-value hierarchy across every state. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-feature-card,
  .fd-tank-form-card,
  .fd-overall-card,
  .fd-month-card,
  .fd-tank-history,
  .fd-tank-entry,
  .fd-tankbook-cloud-row,
  .fd-backup-card,
  .fd-tank-empty
) {
  border-color: var(--fd-border) !important;
  background: var(--fd-surface) !important;
  background-color: var(--fd-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-feature-card,
  .fd-tank-form-card,
  .fd-overall-card,
  .fd-month-card,
  .fd-tank-history,
  .fd-tank-entry,
  .fd-tankbook-cloud-row,
  .fd-backup-card,
  .fd-tank-empty
)::before,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-feature-card,
  .fd-tank-form-card,
  .fd-overall-card,
  .fd-month-card,
  .fd-tank-history,
  .fd-tank-entry,
  .fd-tankbook-cloud-row,
  .fd-backup-card,
  .fd-tank-empty
)::after {
  content: none !important;
  display: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry__values > span,
  .fd-statistics-date__control
) {
  border-color: var(--fd-border) !important;
  background: var(--fd-surface-raised) !important;
  background-color: var(--fd-surface-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field > :is(input, select, textarea, .fd-field-affix),
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > summary,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-input,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions > button,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-delete {
  border-color: var(--fd-border-strong) !important;
  background: var(--fd-field) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-affix > input {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-submit {
  border-color: var(--fd-accent) !important;
  background: var(--fd-accent) !important;
  background-color: var(--fd-accent) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* FuelDash R153 — darker, fully opaque navigation in startup and runtime. */
:root {
  --fd-nav-bg: #050506;
  --fd-nav-border: #202024;
}

html[data-fd-theme="dark"] body #app .fuel-tab-bar,
html[data-fd-theme="dark"] body #app .bottom-nav,
html[data-fd-theme="dark"] body .fd-fast-nav {
  border-color: var(--fd-nav-border) !important;
  background: var(--fd-nav-bg) !important;
  background-color: var(--fd-nav-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* FuelDash R158 — Tankbook wrappers are layout only; controls own the field color. */
html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form,
html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field > :is(input, select, textarea, .fd-field-affix) {
  border-color: var(--fd-border-strong) !important;
  background: #17171b !important;
  background-color: #17171b !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-affix > input {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* FuelDash R158 — remove the remaining nested plates and align native date values. */
html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] :is(
    .fd-tank-extras,
    .fd-tank-extras[open],
    .fd-tank-extras > summary,
    .fd-tank-extras > div,
    .fd-tank-extras[open] > div
  ) {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] :is(
    .fd-tank-extras,
    .fd-tank-extras > summary,
    .fd-tank-extras > div
  )::before,
html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] :is(
    .fd-tank-extras,
    .fd-tank-extras > div
  )::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] input[name="filledAt"] {
  direction: ltr !important;
  text-align: left !important;
}

/* FuelDash R158 — the capture card is an outline, not a second colour plate. */
html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-card {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-card::before,
html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-card::after {
  content: none !important;
  display: none !important;
}

html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] input[name="filledAt"]::-webkit-date-and-time-value {
  text-align: left !important;
}

html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] input[name="filledAt"]::-webkit-datetime-edit {
  text-align: left !important;
}

html[data-fd-theme="dark"] body #app :is(
  .station-opening-hours,
  .station-opening-hours > span,
  .station-opening-hours b,
  .station-opening-hours em
) {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
  text-shadow: none !important;
}

html[data-fd-theme="dark"] body #app :is(
  .station-opening-hours,
  .station-opening-hours > span,
  .station-opening-hours b,
  .station-opening-hours em
)::before,
html[data-fd-theme="dark"] body #app :is(
  .station-opening-hours,
  .station-opening-hours > span,
  .station-opening-hours b,
  .station-opening-hours em
)::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* FuelDash R158 — Monatsstatistik date action follows the standard button rhythm. */
html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  justify-content: flex-start !important;
  text-align: left !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent !important;
}

html[data-fd-theme="dark"] body
  .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__label {
  display: block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}

/* FuelDash R161 — station detail controls share the search-filter hierarchy. */
html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app :is(
  .fuel-preference > [data-fuel-preference],
  .nearby-radius > [data-nearby-radius]
) {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 4px !important;
  width: 100% !important;
  margin-top: 14px !important;
  padding: 4px !important;
  border: 1px solid var(--fd-border) !important;
  border-radius: 18px !important;
  background: var(--fd-surface-raised) !important;
  background-color: var(--fd-surface-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app :is(
  .fuel-preference > [data-fuel-preference],
  .nearby-radius > [data-nearby-radius]
) > button {
  min-width: 0 !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 8px 6px !important;
  border: 1px solid transparent !important;
  border-radius: 14px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-muted) !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 620 !important;
  line-height: 1.15 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app :is(
  .fuel-preference > [data-fuel-preference],
  .nearby-radius > [data-nearby-radius]
) > button.is-active {
  border-color: var(--fd-accent) !important;
  background: var(--fd-accent) !important;
  background-color: var(--fd-accent) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .detail-price-card:not(.is-selected),
html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app :is(.route-trigger, .route-options > a) {
  border-color: var(--fd-border-strong) !important;
  background: var(--fd-field) !important;
  background-color: var(--fd-field) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app :is(
  .station-route,
  .route-chooser,
  .route-options,
  .route-options > span
) {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .station-detail-card .station-opening-hours,
html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .station-detail-card .station-opening-hours :is(span, b, em),
html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .station-detail-card .station-opening-hours::before,
html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .station-detail-card .station-opening-hours::after,
html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .station-detail-card .station-opening-hours :is(span, b, em)::before,
html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .station-detail-card .station-opening-hours :is(span, b, em)::after {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .station-detail-card .station-opening-hours::before,
html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .station-detail-card .station-opening-hours::after,
html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .station-detail-card .station-opening-hours :is(span, b, em)::before,
html[data-fd-theme="dark"] body:not(#fd-r161-station-scope) #app .station-detail-card .station-opening-hours :is(span, b, em)::after {
  content: none !important;
  display: none !important;
}

/* FuelDash R161 — compact More preferences match the search filter. */
html[data-fd-theme="dark"] body:not(#fd-r161-more-scope) #app :is(
  .fuel-preference > [data-fuel-preference],
  .nearby-radius > [data-nearby-radius]
) > button {
  min-height: 40px !important;
  padding: 6px 5px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
}

/* FuelDash R162 — account viewport has no inherited colour layer. */
.fd-feature-page[data-fd-feature-view="account"],
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell,
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  background: #000000 !important;
  background-color: #000000 !important;
  background-image: none !important;
}

.fd-feature-page[data-fd-feature-view="account"]::before,
.fd-feature-page[data-fd-feature-view="account"]::after,
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell::before,
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell::after,
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-content::before,
.fd-feature-page[data-fd-feature-view="account"] .fd-feature-content::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  padding-bottom: max(36px, env(safe-area-inset-bottom)) !important;
}

/* FuelDash R173 — compact chart readout without viewport expansion */
html body #app .chart-selection-readout {
  font-size: 9px;
  line-height: 1.35;
  column-gap: 0.35rem;
}
html body #app .chart-selection-readout strong {
  font-size: 11px;
}
html body #app .chart-selection-readout .chart-readout-separator {
  color: #f4513f;
  font-weight: 800;
  font-size: 11px;
  line-height: 1;
  margin-inline: 0.08rem;
}
html body #app .chart-selection-readout .chart-readout-separator::before,
html body #app .chart-selection-readout .chart-readout-yesterday::before {
  content: none;
  margin: 0;
}

/* Explain the selected push profile directly below its selector. */
html body .fd-alert-profile-description {
  grid-column: 1 / -1;
  margin: -4px 3px 2px;
  color: var(--fd-muted, #9b9ba3);
  font-size: 12px;
  line-height: 1.35;
}

html body .fd-alert-modal [hidden] {
  display: none !important;
}

html body .fd-alert-profile-favorite-detail {
  display: block;
  margin: 4px 3px 0;
  color: var(--fd-muted, #9b9ba3);
  font-size: 11px;
  line-height: 1.35;
}

/* The final alert-card theme rule sets display with !important; keep the
   native hidden state authoritative when a classic profile is selected. */
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-tank-chance[hidden],
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-price-alert-page .fd-alert-tank-chance[hidden] {
  display: none !important;
}

/* Source: /assets/r190-polish.css */
/* FuelDash R190 — compact dashboard and unified semantic green. */
:root {
  --fd-r190-accent: #ff3b30;
  --fd-r190-surface: #0a0a0c;
  --fd-r190-surface-raised: #121216;
  --fd-r190-border: #2b2b31;
  --fd-r190-muted: #9d9da5;
}

/* Keep below-fold sections out of the first layout/paint pass. */
html body #app :is(
  .favorites-block,
  .primary-station-card,
  .chart-block,
  .detail-chart,
  .detail-advice-card,
  .result-list,
  .menu-card
) {
  content-visibility: auto;
  contain-intrinsic-size: auto 220px;
}

/* FuelDash V480 — Android dashboard sections keep stable layout while scrolling. */
html[data-fd-platform="android"] body #app :is(
  .favorites-block,
  .primary-station-card
) {
  content-visibility: visible !important;
  contain: none !important;
  contain-intrinsic-size: none !important;
}

/* Dashboard hero: branded depth without reintroducing glass. */
html body #app .fd-best {
  min-height: 250px !important;
  background-color: #08080a !important;
}

html body #app .fd-best::after {
  background-color: rgba(0, 0, 0, .72) !important;
  background-image: none !important;
  background-size: auto !important;
  mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.82) 45%, rgba(0,0,0,.20) 100%);
  opacity: 1 !important;
}

/* Search map: a calm, solid location control instead of a floating glass button. */
html body #app .map-location-control {
  width: 38px !important;
  height: 38px !important;
  padding: 8px !important;
  border: 1px solid #303037 !important;
  border-radius: 12px !important;
  background: #151519 !important;
  color: #f4f4f6 !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, .42) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body #app .map-location-control svg {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.6 !important;
  opacity: .9;
}

html body #app .fd-best__copy {
  align-self: center !important;
  padding: 20px 8px 20px 22px !important;
}

html body #app .fd-best__station {
  margin-top: 12px !important;
}

html body #app .fd-best__trend,
html body #app .price-change {
  font-variant-numeric: tabular-nums;
  letter-spacing: .005em;
}

html body #app .fd-best__trend.fd-price-change-enter,
html body #app .price-change.fd-price-change-enter {
  animation: fd-r190-price-enter 440ms cubic-bezier(.2,.75,.2,1) both;
}

/* Tank recommendation: clearer hierarchy and larger brand identity. */
html body #app .primary-station-card__head .station-logo {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 10px !important;
}

html body #app .primary-station-card__facts > span {
  align-content: start;
  min-height: 72px !important;
  padding: 9px !important;
}


html body #app :is(
  .station-copy strong,
  .primary-station-card__copy strong,
  .fd-best__station,
  .detail-card h2
) {
  letter-spacing: -.015em;
}

html body #app :is(
  .station-logo,
  .favorite-toggle,
  .detail-favorite,
  .round-button,
  .map-location-control
) svg {
  width: 20px;
  height: 20px;
}

/* Favorite feedback: one short pulse only after a real tap. */
html body #app .favorite-toggle.fd-favorite-pulse,
html body #app .detail-favorite.fd-favorite-pulse {
  animation: fd-r190-favorite-pulse 420ms cubic-bezier(.2,.8,.2,1);
}

/* Map marker depth and selected-state precision. */
html body #app .fuel-map[data-map-state="ready"] .fuel-map-marker {
  animation: fd-r190-marker-enter 360ms cubic-bezier(.2,.8,.2,1) both;
}

html body #app .map-price-marker {
  box-shadow: 0 8px 22px rgba(0, 0, 0, .48), 0 0 0 1px rgba(255, 59, 48, .18) !important;
  transform-origin: 50% 100%;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

html body #app .map-price-marker.is-selected {
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 10px 26px rgba(0, 0, 0, .56), 0 0 0 2px rgba(255, 255, 255, .22) !important;
}

html body #app .fuel-map-canvas {
  background: #0a0a0c;
}

/* History: extrema and compact numerical summary. */
html body #app .fd-chart-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin: 10px 0 12px;
}

html body #app .fd-chart-summary > span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 9px 8px;
  border: 1px solid var(--fd-r190-border);
  border-radius: 13px;
  background: var(--fd-r190-surface-raised);
  text-align: center;
}

html body #app .fd-chart-summary small {
  color: var(--fd-r190-muted) !important;
  font-size: 9px;
  font-weight: 650;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: .055em;
}

html body #app .fd-chart-summary strong {
  color: #f5f5f7 !important;
  font-size: 12px;
  font-weight: 720;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}

html body #app .chart-extreme-marker {
  stroke: #050506;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

html body #app .chart-extreme-marker.is-low {
  fill: #30d158;
}

html body #app .chart-extreme-marker.is-high {
  fill: #ff453a;
}

html body #app .chart-selection-line {
  stroke-width: 1.25 !important;
  stroke-dasharray: 3 3;
}

html body #app .chart-selection-readout {
  min-height: 28px;
  padding: 6px 8px !important;
}

/* Consistent card rhythm and touch targets across iPhone and Android. */
html body #app .app-content > :is(section, div[data-search-map], div[data-sort-controls]) + :is(section, div[data-search-map], div[data-sort-controls]) {
  margin-top: 14px;
}

html body #app :is(button, a, input, select) {
  touch-action: manipulation;
}

@media (max-width: 370px) {
  html body #app .fd-best {
    min-height: 250px !important;
  }
}

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

@keyframes fd-r190-price-enter {
  from { opacity: .35; transform: translateY(3px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fd-r190-favorite-pulse {
  0% { transform: scale(1); }
  45% { transform: scale(1.18); }
  100% { transform: scale(1); }
}

@keyframes fd-r190-marker-enter {
  from { opacity: 0; transform: translateY(7px) scale(.92); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}


/* FuelDash R190 — dashboard card and recommendation refinements. */
html body #app .primary-station-card__head {
  grid-template-columns: 34px minmax(0, 1fr) auto 16px !important;
  min-height: 76px !important;
  padding: 12px 14px !important;
}
html body #app .primary-station-card .station-logo {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 10px !important;
}
html body #app .primary-station-card__facts > span {
  background: rgba(255,255,255,.035) !important;
  border-color: rgba(255,255,255,.07) !important;
}
html body #app .primary-station-card__facts > span b {
  color: #f5f5f7 !important;
}


/* R190: one semantic green across price decreases, sync/cloud and opening states. */
:root {
  --fd-r90-green: #30d158;
  --fd-r106-green: #30d158;
  --fd-r107-mint: #30d158;
  --fd-r114-mint: #30d158;
  --fd-r117-mint: #30d158;
  --fd-r119-mint: #30d158;
  --fd-positive: #30d158;
}
html body #app :is(
  .price-change.is-lower,
  .fd-best__trend.is-lower,
  .fd-best__trend.is-lower i,
  .station-opening.is-open,
  .station-meta .is-open,
  .detail-opening .opening-status strong.is-open,
  .fd-form-status[data-type="success"],
  .fd-auth-form-status[data-type="success"],
  .fd-cloud-message.is-success,
  .fd-cloud-badge.is-success,
  .fd-backup-status[data-type="success"]
),
html[data-fd-theme="light"] body #app :is(
  .price-change.is-lower,
  .fd-best__trend.is-lower,
  .fd-best__trend.is-lower i,
  .station-opening.is-open,
  .station-meta .is-open
),
html body :is(
  [data-cloud-tone="active"],
  .fd-account-page-status[data-cloud-tone="active"] h2,
  .fd-alert-status[data-tone="active"]
) {
  color: #30d158 !important;
  fill: #30d158 !important;
  stroke: #30d158 !important;
  text-shadow: none !important;
}
html body #app :is(.station-opening.is-open i, .station-meta .is-open::before) {
  background: #30d158 !important;
  box-shadow: 0 0 8px rgba(48,209,88,.48) !important;
}


/* FuelDash R190 — startup/runtime navigation parity and rounded search selection. */
:root {
  --fd-r190-nav-bg: #111113;
  --fd-r190-nav-border: #2b2b31;
}

html body #app .fuel-tab-bar,
html body .fd-startup-cover .fd-fast-nav {
  border-color: var(--fd-r190-nav-border) !important;
  background: var(--fd-r190-nav-bg) !important;
  background-color: var(--fd-r190-nav-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body #app .result-list .station-result.is-selected {
  border-color: var(--fd-accent) !important;
  box-shadow: inset 0 0 0 1px var(--fd-accent) !important;
}

html body #app .result-list .station-result.is-selected > .station-card.is-selected {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}


/* FuelDash R190 — search and header controls use the navigation surface. */
:root {
  --fd-r190-control-bg: #111113;
  --fd-r190-control-border: #2b2b31;
}

html:not([data-fd-theme="light"]) body #app .search-field,
html:not([data-fd-theme="light"]) body #app .fd-profile-button,
html:not([data-fd-theme="light"]) body #app .fd-app-reload,
html:not([data-fd-theme="light"]) body .fd-startup-cover .fd-fast-profile-placeholder,
html:not([data-fd-theme="light"]) body .fd-startup-cover .fd-app-reload {
  border-color: var(--fd-r190-control-border) !important;
  background: var(--fd-r190-control-bg) !important;
  background-color: var(--fd-r190-control-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}


/* FuelDash R190 — definitive cascade fix for shared dark controls and selected search cards. */
:root {
  --fd-r190-shared-control-bg: #111114;
  --fd-r190-shared-control-border: #26262b;
  --fd-r190-selection: #ff3b30;
}

/* Match the actual navigation/filter surface. The :not(#id) specificity intentionally
   outranks legacy release seals that also use !important. */
html[data-fd-theme] body:not(#fd-r190-control-scope) #app .fuel-tab-bar,
html[data-fd-theme] body:not(#fd-r190-control-scope) #app .station-sort,
html[data-fd-theme] body:not(#fd-r190-control-scope) #app .search-field,
html[data-fd-theme] body:not(#fd-r190-control-scope) #app .brand-header :is(.fd-profile-button, .fd-app-reload),
html[data-fd-theme] body:not(#fd-r190-control-scope) .fd-startup-cover .fd-fast-nav,
html[data-fd-theme] body:not(#fd-r190-control-scope) .fd-startup-cover .fd-fast-header :is(.fd-fast-profile-placeholder, .fd-app-reload) {
  border-color: var(--fd-r190-shared-control-border) !important;
  background: var(--fd-r190-shared-control-bg) !important;
  background-color: var(--fd-r190-shared-control-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

/* The outer result owns the complete rounded red selection border. */
html[data-fd-theme] body:not(#fd-r190-search-selection-scope) #app .result-list > .station-result.is-selected {
  border: 1px solid var(--fd-r190-selection) !important;
  border-color: var(--fd-r190-selection) !important;
  border-radius: 22px !important;
  box-shadow: inset 0 0 0 1px var(--fd-r190-selection) !important;
  overflow: hidden !important;
}

/* Remove every competing inner outline/shadow so the corners cannot be clipped. */
html[data-fd-theme] body:not(#fd-r190-search-selection-scope) #app .result-list > .station-result.is-selected > .station-card.is-selected {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* FuelDash R192 — final mobile interaction and surface alignment. */
:root {
  --fd-r192-control-bg: #09090b;
  --fd-r192-control-border: #202024;
}

/* Every neutral control that shared the old blue-grey navigation material now uses one darker surface. */
html[data-fd-theme="dark"] body :is(#app, .fd-feature-page, .fd-alert-modal) :is(
  .fuel-tab-bar,
  .station-sort,
  .search-field,
  .fd-profile-button,
  .fd-app-reload,
  .round-button,
  .refresh-pill,
  .map-location-control,
  .map-location-button,
  .route-trigger,
  .route-options > a,
  .fd-live-location-button,
  .fd-feature-back,
  .fd-auth-secondary,
  .fd-backup-actions > button,
  .fd-account-card__action,
  .fd-alert-close,
  .fd-alert-test
) {
  border-color: var(--fd-r192-control-border) !important;
  background-color: var(--fd-r192-control-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-field > :is(input, select, textarea),
  .fd-backup-input,
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry
),
html[data-fd-theme="dark"] body .fd-alert-modal :is(
  .fd-alert-row,
  .fd-alert-station,
  .fd-alert-empty,
  .fd-alert-row :is(select, input[type="time"], input[type="number"])
) {
  border-color: var(--fd-r192-control-border) !important;
  background-color: var(--fd-r192-control-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Station markers belong to every map, including the compact dashboard preview. */
html[data-fd-theme="dark"] body #app .fd-best__map .leaflet-marker-pane {
  display: block !important;
}

html[data-fd-theme="dark"] body #app .fd-best__map :is(.fuel-map-marker, .map-price-marker) {
  display: flex !important;
  opacity: 1 !important;
}

/* Keep the account page within exactly one visual viewport on Safari; only its content column scrolls. */
html[data-fd-theme="dark"] body.fd-feature-open {
  background-color: #050506 !important;
  overscroll-behavior: none !important;
}

.fd-feature-page[data-fd-feature-view="account"] {
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  touch-action: pan-y !important;
}

.fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell {
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

.fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  min-height: 0 !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal,
html[data-fd-theme="dark"] body .fd-feature-page {
  touch-action: pan-y !important;
}

/* FuelDash R193 — definitive neutral-black control cascade and map marker scope. */
:root {
  --fd-r193-control-bg: #080808;
  --fd-r193-control-border: #1e1e1e;
}

/* This selector deliberately matches the old R190 specificity so no grey-blue release rule can win. */
html[data-fd-theme="dark"] body:not(#fd-r193-control-scope) :is(#app, .fd-feature-page, .fd-alert-modal) :is(
  .fuel-tab-bar,
  .station-sort,
  .search-field,
  .fd-profile-button,
  .fd-app-reload,
  .round-button,
  .refresh-pill,
  .map-location-control,
  .map-location-button,
  .route-trigger,
  .route-options > a,
  .fd-live-location-button,
  .fd-feature-back,
  .fd-auth-secondary,
  .fd-backup-actions > button,
  .fd-account-card__action,
  .fd-alert-close,
  .fd-alert-test,
  .fuel-preference button:not(.is-active),
  .nearby-radius button:not(.is-active),
  .detail-price-card:not(.is-selected),
  .chart-range
) {
  border-color: var(--fd-r193-control-border) !important;
  background: var(--fd-r193-control-bg) !important;
  background-color: var(--fd-r193-control-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r193-control-scope) :is(.fd-feature-page, .fd-alert-modal) :is(
  .fd-field > :is(input, select, textarea),
  .fd-backup-input,
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry,
  .fd-alert-row,
  .fd-alert-station,
  .fd-alert-empty,
  .fd-alert-row :is(select, input[type="time"], input[type="number"])
) {
  border-color: var(--fd-r193-control-border) !important;
  background: var(--fd-r193-control-bg) !important;
  background-color: var(--fd-r193-control-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* The dashboard map is intentionally map-only. Station labels belong in Search and Details. */
html[data-fd-theme="dark"] body:not(#fd-r193-marker-scope) #app .fd-best__map :is(
  .leaflet-marker-pane,
  .leaflet-shadow-pane,
  .fuel-map-marker,
  .map-price-marker,
  .user-location-marker
) {
  display: none !important;
  visibility: hidden !important;
}

/* Search and station details own their markers explicitly, independent of compact-map styles. */
html[data-fd-theme="dark"] body:not(#fd-r193-marker-scope) #app :is([data-search-map], .station-mini-map) .leaflet-marker-pane {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 650 !important;
}

html[data-fd-theme="dark"] body:not(#fd-r193-marker-scope) #app :is([data-search-map], .station-mini-map) :is(.fuel-map-marker, .map-price-marker) {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* FuelDash R194 — marker visibility is a map contract, never a compact-map side effect. */
html[data-fd-theme="dark"] body #app .fuel-map[data-marker-mode="none"] :is(
  .leaflet-marker-pane,
  .leaflet-shadow-pane,
  .leaflet-marker-icon,
  .fuel-map-marker,
  .map-price-marker,
  .user-location-marker
) {
  display: none !important;
  visibility: hidden !important;
}

html[data-fd-theme="dark"] body #app .fuel-map[data-marker-mode="station"] .leaflet-marker-pane {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 650 !important;
}

html[data-fd-theme="dark"] body #app .fuel-map[data-marker-mode="station"] .leaflet-marker-icon.fuel-map-marker {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html[data-fd-theme="dark"] body #app .fuel-map[data-marker-mode="station"] .map-price-marker {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* The startup controls use the exact same neutral-black material as the ready app. */
html[data-fd-theme="dark"] body .fd-startup-cover :is(
  .fd-fast-profile-placeholder,
  .fd-app-reload,
  .fd-fast-nav
) {
  border-color: var(--fd-r193-control-border) !important;
  background: var(--fd-r193-control-bg) !important;
  background-color: var(--fd-r193-control-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* iOS must not enlarge the account view for small text inputs or expose an overscroll strip. */
html[data-fd-theme="dark"] body.fd-feature-open {
  background: #000000 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="account"] {
  inset: 0 !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  background: #000000 !important;
  overscroll-behavior: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="account"]::before,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="account"]::after {
  display: none !important;
  content: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="account"] :is(input, select, textarea) {
  font-size: 16px !important;
}

/* Source: /assets/r195-oled-surfaces.css */
/* FuelDash R195 — one neutral OLED surface system. */
:root {
  --fd-r195-page: #000000;
  --fd-r195-card: #0c0c0c;
  --fd-r195-control: #080808;
  --fd-r195-border: #1e1e1e;
  --fd-r195-text: #f5f5f7;
  --fd-r195-muted: #a1a1a8;

  /* Legacy tokens are redirected so late component rules inherit this palette too. */
  --fd-page: var(--fd-r195-page);
  --fd-surface: var(--fd-r195-card);
  --fd-surface-raised: var(--fd-r195-control);
  --fd-field: var(--fd-r195-control);
  --fd-border: var(--fd-r195-border);
  --fd-border-strong: var(--fd-r195-border);
  --fd-text: var(--fd-r195-text);
  --fd-muted: var(--fd-r195-muted);
  --fd-r190-surface: var(--fd-r195-card);
  --fd-r190-surface-raised: var(--fd-r195-control);
  --fd-r190-border: var(--fd-r195-border);
  --fd-r190-nav-bg: var(--fd-r195-control);
  --fd-r190-nav-border: var(--fd-r195-border);
  --fd-r190-control-bg: var(--fd-r195-control);
  --fd-r190-control-border: var(--fd-r195-border);
  --fd-r190-shared-control-bg: var(--fd-r195-control);
  --fd-r190-shared-control-border: var(--fd-r195-border);
  --fd-r192-control-bg: var(--fd-r195-control);
  --fd-r192-control-border: var(--fd-r195-border);
  --fd-r193-control-bg: var(--fd-r195-control);
  --fd-r193-control-border: var(--fd-r195-border);
}

html,
body,
#app,
#app .app-shell,
#app .app-content,
#app .detail-view,
.fd-startup-cover,
.fd-fast-shell,
.fd-feature-page,
.fd-alert-modal,
.fd-account-sheet {
  background: var(--fd-r195-page) !important;
  color: var(--fd-r195-text) !important;
}

/* Content remains legible against the page without introducing a blue or violet cast. */
html body :is(#app, .fd-feature-page, .fd-alert-modal, .fd-account-sheet) :is(
  .glass-card,
  .price-hero,
  .dashboard-section,
  .chart-block,
  .favorites-block,
  .fuel-preference,
  .nearby-radius,
  .menu-card,
  .station-card,
  .station-result,
  .dashboard-favorite-card,
  .favorites-screen-card,
  .primary-station-card,
  .detail-card,
  .detail-prices,
  .detail-chart,
  .search-suggestion-panel,
  .fd-best,
  .fd-feature-card,
  .fd-account-card,
  .fd-account-page-status,
  .fd-tank-history,
  .fd-account-sheet__panel
) {
  border-color: var(--fd-r195-border) !important;
  background: var(--fd-r195-card) !important;
  box-shadow: none !important;
}

/* Every compact interactive surface uses the exact same approved black. */
html body :is(#app, .fd-feature-page, .fd-alert-modal, .fd-account-sheet, .fd-startup-cover) :is(
  .fuel-tab-bar,
  .station-sort,
  .chart-range,
  .search-field,
  .round-button,
  .fd-profile-button,
  .fd-app-reload,
  .refresh-pill,
  .map-location-control,
  .map-location-button,
  .route-trigger,
  .route-options > a,
  .fd-live-location-button,
  .fd-feature-back,
  .fd-auth-secondary,
  .fd-backup-actions > button,
  .fd-account-card__action,
  .fd-alert-close,
  .fd-alert-test,
  .detail-price-card:not(.is-selected),
  .tab-stepper__controls,
  .fd-fast-nav,
  .fd-fast-profile-placeholder
) {
  border-color: var(--fd-r195-border) !important;
  background: var(--fd-r195-control) !important;
  box-shadow: none !important;
}

/* Search, account, tankbook and alert editors are one shared input material. */
html body :is(#app, .fd-feature-page, .fd-alert-modal, .fd-account-sheet) :is(
  .search-field,
  .fd-field > :is(input, select, textarea),
  .fd-auth-form input,
  .fd-account-card__password input,
  .fd-alert-row :is(select, input[type="time"], input[type="number"]),
  .fd-backup-input
) {
  border-color: var(--fd-r195-border) !important;
  background: var(--fd-r195-control) !important;
  box-shadow: none !important;
}

html body #app .search-field > input {
  background: transparent !important;
  box-shadow: none !important;
}

/* Price alert and feature rows are content cards; their controls above remain #080808. */
html body .fd-alert-modal :is(
  .fd-alert-status,
  .fd-alert-row,
  .fd-alert-station,
  .fd-alert-empty
),
html body .fd-feature-page :is(
  .fd-feature-card,
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry,
  .fd-account-card,
  .fd-account-page-status
) {
  border-color: var(--fd-r195-border) !important;
  background: var(--fd-r195-card) !important;
  box-shadow: none !important;
}

/* Small neutral cells inside cards follow the common control surface. */
html body .fd-feature-page :is(
  .fd-tank-entry__values > span,
  .fd-feature-card__head > span,
  .fd-tank-history__head > span,
  .fd-auth-switch
),
html body .fd-alert-modal :is(.fd-alert-row :is(select, input), .fd-alert-station-count) {
  border-color: var(--fd-r195-border) !important;
  background: var(--fd-r195-control) !important;
  box-shadow: none !important;
}

/* Preserve the live map pixels; only the surrounding controls and cards are recoloured. */
html body #app :is(.fuel-map, .fuel-map-canvas, .leaflet-container) {
  border-color: var(--fd-r195-border) !important;
}

html body .fd-theme-preview__card {
  border-color: var(--fd-r195-border) !important;
  background: var(--fd-r195-card) !important;
  box-shadow: none !important;
}

html body .fd-theme-preview__nav,
html body .fd-fast-kicker,
html body .fd-fast-title,
html body .fd-fast-line {
  background: var(--fd-r195-control) !important;
  box-shadow: none !important;
}

/* Source: /assets/r196-precision-surfaces.css */
/* FuelDash R196 — final precision layer for the remaining legacy visual islands. */
:root {
  --fd-r196-page: #000000;
  --fd-r196-card: #0c0c0c;
  --fd-r196-control: #080808;
  --fd-r196-border: #1e1e1e;
  --fd-r196-red: #ff3b30;
}

/* Preisalarm: page, content rows and the controls inside them have fixed roles. */
html body .fd-alert-modal,
html body .fd-alert-modal .fd-alert-sheet,
html body .fd-alert-modal .fd-alert-head {
  background: var(--fd-r196-page) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body .fd-alert-modal :is(.fd-alert-status, .fd-alert-row, .fd-alert-station, .fd-alert-empty) {
  border-color: var(--fd-r196-border) !important;
  background: var(--fd-r196-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body .fd-alert-modal :is(.fd-alert-close, .fd-alert-test, .fd-alert-row select, .fd-alert-row input[type="time"], .fd-alert-row input[type="number"]) {
  border-color: var(--fd-r196-border) !important;
  background: var(--fd-r196-control) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Native checkbox rendering was disabled earlier; draw the neutral and selected states explicitly. */
html body .fd-alert-modal .fd-alert-row input[type="checkbox"],
html body .fd-alert-modal .fd-alert-station input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-grid !important;
  place-content: center !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  border: 2px solid #2a2a2e !important;
  border-radius: 8px !important;
  background: #080808 !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
  cursor: pointer;
}

html body .fd-alert-modal .fd-alert-row input[type="checkbox"]::after,
html body .fd-alert-modal .fd-alert-station input[type="checkbox"]::after {
  width: 12px;
  height: 7px;
  content: "";
  border: solid currentColor;
  border-width: 0 0 2px 2px;
  opacity: 0;
  transform: rotate(-45deg) translate(1px, -1px);
}

html body .fd-alert-modal .fd-alert-row input[type="checkbox"]:checked,
html body .fd-alert-modal .fd-alert-station input[type="checkbox"]:checked {
  border-color: #ff3b30 !important;
  background: #ff3b30 !important;
}

html body .fd-alert-modal .fd-alert-row input[type="checkbox"]:checked::after,
html body .fd-alert-modal .fd-alert-station input[type="checkbox"]:checked::after {
  opacity: 1;
}

html body .fd-alert-modal :is(input, select, textarea) {
  color-scheme: dark;
}

/* Tankbuch: fields and their affix shells must be the exact same control, never a legacy graphite gradient. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-feature-card, .fd-tank-history) {
  border-color: var(--fd-r196-border) !important;
  background: var(--fd-r196-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-field > input, .fd-field > select, .fd-field > textarea, .fd-field-affix, .fd-field-affix > input, .fd-tank-summary > article, .fd-month-grid > article, .fd-tank-entry__values > span, .fd-backup-actions > button) {
  border-color: var(--fd-r196-border) !important;
  background: #080808 !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-affix > input {
  border-color: transparent !important;
  background: transparent !important;
}

/* The empty-favorites notice is a content card, matching the rest of the Favorites tab. */
html body #app .favorites-block .empty-state,
html body #app .result-list > .empty-state {
  border: 1px solid var(--fd-r196-border) !important;
  background: #0c0c0c !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #a1a1a8 !important;
}

/* Search and detail maps: reliable visible layer, dim red candidates, vivid selected station. */
html body #app .fuel-map[data-marker-mode="station"] .leaflet-marker-pane,
html body #app .fuel-map[data-marker-mode="station"] .leaflet-shadow-pane {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 650 !important;
}

html body #app .fuel-map[data-marker-mode="station"] .leaflet-marker-icon.fuel-map-marker {
  display: block !important;
  visibility: visible !important;
  overflow: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html body #app .fuel-map[data-marker-mode="station"] .map-price-marker:not(.is-selected) {
  display: flex !important;
  visibility: visible !important;
  opacity: .62 !important;
  border-color: #8d2824 !important;
  background: #3c1211 !important;
  box-shadow: 0 5px 14px rgba(0, 0, 0, .46) !important;
}

html body #app .fuel-map[data-marker-mode="station"] .map-price-marker.is-selected {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  border-color: #ff746d !important;
  background: #ff3b30 !important;
  box-shadow: 0 7px 18px rgba(0, 0, 0, .54), 0 0 0 2px rgba(255, 255, 255, .18) !important;
  transform: translateY(-2px) scale(1.05) !important;
}

html body #app .fuel-map[data-marker-mode="none"] :is(.leaflet-marker-pane, .leaflet-shadow-pane, .fuel-map-marker, .map-price-marker, .user-location-marker) {
  display: none !important;
  visibility: hidden !important;
}

/* Source: /assets/r197-marker-and-empty-favorites.css */
/* FuelDash R198 — geo-anchored price-and-brand pills and a text-only dashboard empty state. */
html body #app .fuel-map[data-marker-mode="station"] .leaflet-marker-icon.fuel-map-marker {
  width: 116px !important;
  height: 58px !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  pointer-events: auto !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fuel-map-marker .map-price-marker {
  box-sizing: border-box;
  width: 116px;
  min-width: 116px;
  height: 58px;
  padding: 8px 11px;
  justify-content: center;
  border-radius: 30px;
}

html body #app .fuel-map[data-marker-mode="station"] .fuel-map-marker .map-price-marker.is-selected {
  background: #ff3b30 !important;
  border-color: #ff625a !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .62), 0 0 18px rgba(255, 59, 48, .68) !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fuel-map-marker .map-price-marker:not(.is-selected) {
  background: #4a1412 !important;
  border-color: rgba(255, 116, 109, .56) !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, .56) !important;
}

html body #app .favorites-block .empty-state {
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #a1a1a8 !important;
}

/* Source: /assets/r199-map-navigation.css */
/* FuelDash R199 — compact bottom-anchored station pills and inverted main navigation. */
html body #app .fuel-map[data-marker-mode="station"] .leaflet-marker-icon.fuel-map-marker {
  width: 94px !important;
  height: 42px !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fuel-map-marker .map-price-marker {
  box-sizing: border-box !important;
  width: 94px !important;
  min-width: 94px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 5px 9px !important;
  border-radius: 22px !important;
  transform: none !important;
  transform-origin: 50% 100% !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fuel-map-marker .map-price-marker.is-selected {
  transform: none !important;
}

html[data-fd-theme="dark"] body #app .fuel-tab-bar {
  border-color: #ff625a !important;
  background: #ff3b30 !important;
  background-color: #ff3b30 !important;
  background-image: none !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .58) !important;
}

html[data-fd-theme="dark"] body #app .fuel-tab-bar > button:not(.is-active) {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #080808 !important;
}

html[data-fd-theme="dark"] body #app .fuel-tab-bar > button.is-active,
html[data-fd-theme="dark"] body #app .fuel-tab-bar > button[aria-current="page"] {
  border: 0 !important;
  background: #080808 !important;
  background-color: #080808 !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

/* Source: /assets/r200-map-and-form-controls.css */
/* FuelDash R200 — one real map pin layer and the final form-control parity layer. */

/* No legacy marker DOM may influence the new Leaflet marker layer. */
html body #app .fuel-map[data-marker-mode="station"] :is(.fuel-map-marker, .map-price-marker) {
  display: none !important;
}

html body #app .fuel-map[data-marker-mode="station"] .leaflet-marker-icon.fd-station-marker-icon {
  display: block !important;
  visibility: visible !important;
  width: 80px !important;
  height: 38px !important;
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
  pointer-events: auto !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fd-station-marker {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 1px !important;
  width: 80px !important;
  height: 32px !important;
  box-sizing: border-box !important;
  padding: 3px 5px 2px !important;
  overflow: visible !important;
  border: 1px solid #8d2824 !important;
  border-radius: 15px !important;
  background: #3c1211 !important;
  box-shadow: 0 5px 14px rgba(0, 0, 0, .46) !important;
  color: #ffffff !important;
  font: inherit !important;
  line-height: 1 !important;
  text-align: center !important;
  cursor: pointer !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  transform: none !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fd-station-marker::after {
  content: none !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fd-station-marker > :is(.fd-station-marker__price, .fd-station-marker__name) {
  position: relative !important;
  z-index: 1 !important;
}

/* The triangle ends at y=38 within the 80×38 Leaflet icon; its tip and iconAnchor are the same pixel. */
html body #app .fuel-map[data-marker-mode="station"] .fd-station-marker__tip {
  position: absolute !important;
  z-index: 0 !important;
  top: 27px !important;
  left: 35px !important;
  display: block !important;
  width: 10px !important;
  height: 11px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #3c1211 !important;
  clip-path: polygon(0 0, 100% 0, 50% 100%) !important;
  pointer-events: none !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fd-station-marker.is-selected {
  z-index: 2 !important;
  border-color: #ff746d !important;
  background: #ff3b30 !important;
  box-shadow: 0 7px 18px rgba(0, 0, 0, .54), 0 0 14px rgba(255, 59, 48, .48) !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fd-station-marker.is-selected .fd-station-marker__tip {
  background: #ff3b30 !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fd-station-marker.is-dimmed {
  opacity: .72 !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fd-station-marker__price {
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: -.25px !important;
  white-space: nowrap !important;
}

html body #app .fuel-map[data-marker-mode="station"] .fd-station-marker__name {
  min-width: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
  font-size: 8px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Tankbuch uses the exact black control material from Preisalarm, including WebKit date/select widgets. */
html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form :is(.fd-field > input, .fd-field > select, .fd-field > textarea, .fd-field-affix) {
  border-color: #1e1e1e !important;
  background: #080808 !important;
  background-color: #080808 !important;
  background-image: none !important;
  box-shadow: none !important;
  color-scheme: dark !important;
}

html body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form .fd-field-affix > input {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* The price-alert checkbox rows are one stable horizontal layout; the tick is geometrically centered. */
html body .fd-alert-modal .fd-alert-grid,
html body .fd-alert-modal .fd-alert-stations {
  grid-template-columns: minmax(0, 1fr) !important;
}

html body .fd-alert-modal :is(.fd-alert-row, .fd-alert-station) {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
}

html body .fd-alert-modal .fd-alert-row > span,
html body .fd-alert-modal .fd-alert-station > span {
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

html body .fd-alert-modal :is(.fd-alert-row, .fd-alert-station) input[type="checkbox"] {
  position: relative !important;
  display: grid !important;
  flex: 0 0 28px !important;
  place-items: center !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  margin: 0 0 0 16px !important;
  padding: 0 !important;
  border: 2px solid #2a2a2e !important;
  border-radius: 8px !important;
  background: #080808 !important;
  box-shadow: none !important;
}

html body .fd-alert-modal :is(.fd-alert-row, .fd-alert-station) input[type="checkbox"]::after {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: 8px !important;
  height: 13px !important;
  margin: 0 !important;
  content: "" !important;
  border: solid #ffffff !important;
  border-width: 0 2px 2px 0 !important;
  opacity: 0 !important;
  transform: translate(-50%, -57%) rotate(45deg) !important;
}

html body .fd-alert-modal :is(.fd-alert-row, .fd-alert-station) input[type="checkbox"]:checked {
  border-color: #ff3b30 !important;
  background: #ff3b30 !important;
}

html body .fd-alert-modal :is(.fd-alert-row, .fd-alert-station) input[type="checkbox"]:checked::after {
  opacity: 1 !important;
}

/* Source: /assets/r206-loading-and-controls.css */
/* FuelDash R206 — stable loading motion and final Tankbuch control parity. */

@keyframes fd-r206-skeleton-sweep {
  from { background-position: 115% 0; }
  to { background-position: -115% 0; }
}

@keyframes fd-r206-skeleton-shimmer {
  from { background-position: 115% 0; }
  to { background-position: -115% 0; }
}

@keyframes fd-r212-skeleton-travel {
  from { transform: translate3d(-125%, 0, 0); }
  to { transform: translate3d(125%, 0, 0); }
}

/* Keep the initial loading state visibly alive until the app shell takes over. */
html body .fd-startup-cover .fd-fast-card {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

html body .fd-startup-cover .fd-fast-card::after {
  position: absolute !important;
  z-index: 2 !important;
  inset: 0 !important;
  display: block !important;
  content: "" !important;
  pointer-events: none !important;
  background: linear-gradient(105deg, transparent 24%, rgba(255,255,255,.07) 43%, rgba(255,255,255,.18) 50%, rgba(255,255,255,.07) 57%, transparent 76%) !important;
  will-change: transform !important;
  animation: fd-r212-skeleton-travel 1.35s cubic-bezier(.4,0,.2,1) infinite !important;
}

html body .fd-startup-cover :is(.fd-fast-kicker, .fd-fast-title, .fd-fast-line) {
  position: relative !important;
  overflow: hidden !important;
  background-image: none !important;
}

html body .fd-startup-cover :is(.fd-fast-kicker, .fd-fast-title, .fd-fast-line)::after {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  content: "" !important;
  pointer-events: none !important;
  background: linear-gradient(100deg, transparent 18%, rgba(255,255,255,.08) 38%, rgba(255,255,255,.24) 50%, rgba(255,255,255,.08) 62%, transparent 82%) !important;
  will-change: transform !important;
  animation: fd-r212-skeleton-travel 1.35s cubic-bezier(.4,0,.2,1) infinite !important;
}

html body .fd-startup-cover .fd-fast-header-actions :is(.fd-fast-profile-placeholder, .fd-fast-price-alert-bell-placeholder) {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

html body .fd-startup-cover .fd-fast-header-actions :is(.fd-fast-profile-placeholder, .fd-fast-price-alert-bell-placeholder)::after {
  position: absolute !important;
  z-index: 2 !important;
  inset: 0 !important;
  display: block !important;
  content: "" !important;
  pointer-events: none !important;
  background: linear-gradient(105deg, transparent 20%, rgba(255,255,255,.06) 40%, rgba(255,255,255,.20) 50%, rgba(255,255,255,.06) 60%, transparent 80%) !important;
  will-change: transform !important;
  animation: fd-r212-skeleton-travel 1.35s cubic-bezier(.4,0,.2,1) infinite !important;
}

html body .fd-startup-cover .fd-fast-header-actions .fd-fast-price-alert-bell-placeholder::after {
  animation-delay: .11s !important;
}

html.fd-app-starting body .fd-startup-cover .fd-fast-nav {
  display: grid !important;
}

html body .fd-startup-cover .fd-fast-nav > span {
  position: relative !important;
  overflow: hidden !important;
  color: transparent !important;
}

html body .fd-startup-cover .fd-fast-nav > span > svg,
html body .fd-startup-cover .fd-fast-nav > span > span {
  opacity: 0 !important;
}

html body .fd-startup-cover .fd-fast-nav > span::before {
  position: absolute !important;
  inset: 8px 6px !important;
  display: block !important;
  content: "" !important;
  border-radius: 13px !important;
  background: linear-gradient(100deg, rgba(255,255,255,.06) 22%, rgba(255,255,255,.18) 46%, rgba(255,255,255,.06) 70%) !important;
  will-change: transform !important;
  animation: fd-r212-skeleton-travel 1.35s cubic-bezier(.4,0,.2,1) infinite !important;
}

html body .fd-startup-cover .fd-fast-nav > span:nth-child(2)::before { animation-delay: .11s !important; }
html body .fd-startup-cover .fd-fast-nav > span:nth-child(3)::before { animation-delay: .22s !important; }
html body .fd-startup-cover .fd-fast-nav > span:nth-child(4)::before { animation-delay: .33s !important; }

/* This final, dark-only rule intentionally wins over the late R158 field fill. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form .fd-field > :is(input, select, textarea, .fd-field-affix) {
  border-color: #1e1e1e !important;
  background: #080808 !important;
  background-color: #080808 !important;
  background-image: none !important;
  box-shadow: none !important;
  color-scheme: dark !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form .fd-field-affix > input {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html body .fd-startup-cover :is(
    .fd-fast-card::after,
    .fd-fast-kicker::after,
    .fd-fast-title::after,
    .fd-fast-line::after,
    .fd-fast-header-actions :is(.fd-fast-profile-placeholder, .fd-fast-price-alert-bell-placeholder)::after,
    .fd-fast-nav > span::before
  ) {
    animation-duration: 2.4s !important;
    animation-iteration-count: infinite !important;
  }
}

/* Source: /assets/r219-ui.css */
/* FuelDash R219 — sole owner of account-route and navigation geometry. */

html,
html body {
  background: #000000 !important;
  background-color: #000000 !important;
}

html body.fd-account-route-open {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  overflow-y: hidden !important;
  overscroll-behavior: none !important;
  background: #000000 !important;
}

html body.fd-account-route-open #app {
  display: none !important;
}

html body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] {
  position: fixed !important;
  z-index: 2147483646 !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 0 !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  overflow-y: hidden !important;
  overscroll-behavior: none !important;
  background: #000000 !important;
  background-image: none !important;
  opacity: 1 !important;
  transform: none !important;
}

html body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] > .fd-feature-shell {
  display: flex !important;
  flex-direction: column !important;
  width: min(100%, 480px) !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  overflow-y: hidden !important;
  overscroll-behavior: none !important;
  background: #000000 !important;
  background-image: none !important;
}

html body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
  padding: 0 16px calc(24px + env(safe-area-inset-bottom)) !important;
  background: #000000 !important;
  background-image: none !important;
}

html body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] :is(.fd-feature-shell, .fd-feature-content)::before,
html body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] :is(.fd-feature-shell, .fd-feature-content)::after,
html body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"]::before,
html body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"]::after {
  content: none !important;
  display: none !important;
}

html[data-fd-theme="dark"] body #app .fuel-tab-bar,
html body #app .fuel-tab-bar,
html body .fd-fast-nav {
  border: 1px solid #ff625a !important;
  background: #ff3b30 !important;
  background-color: #ff3b30 !important;
  background-image: none !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .58) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body #app .fuel-tab-bar > button,
html body .fd-fast-nav > span {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

html body #app .fuel-tab-bar > button.is-active,
html body #app .fuel-tab-bar > button[aria-current="page"],
html body .fd-fast-nav > span:first-child {
  background: #080808 !important;
  background-color: #080808 !important;
  color: #ffffff !important;
}

html body #app .fuel-tab-bar > button > svg {
  fill: none !important;
  stroke: currentColor !important;
}

html body #app .fuel-tab-bar > button > svg [fill="currentColor"] {
  fill: currentColor !important;
  stroke: none !important;
}

html body #app .fuel-tab-bar > button > small {
  color: currentColor !important;
}

/* Source: /assets/r222-ui.css */
/* FuelDash R222 — iOS-stable price input and final Tankbuch control material. */

html body .fd-alert-modal .fd-alert-row input[type="number"] {
  font-size: 16px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form :is(input, select, textarea, .fd-field-affix) {
  border-color: #1e1e1e !important;
  background: #080808 !important;
  background-color: #080808 !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #f5f5f7 !important;
  color-scheme: dark !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form .fd-field-affix > input {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* Source: /assets/r223-tankbook-oled.css */
/* FuelDash R223 — Tankbuch uses the same flat OLED hierarchy as Preisalarm. */
:root {
  --fd-r223-page: #000000;
  --fd-r223-card: #0c0c0c;
  --fd-r223-control: #080808;
  --fd-r223-border: #1e1e1e;
  --fd-r223-border-strong: #2a2a2e;
  --fd-r223-text: #f5f5f7;
  --fd-r223-muted: #92929a;
  --fd-r223-red: #ff3b30;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"],
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-shell,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-feature-header, .fd-feature-content) {
  background: var(--fd-r223-page) !important;
  background-color: var(--fd-r223-page) !important;
  background-image: none !important;
  color: var(--fd-r223-text) !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] {
  color-scheme: dark !important;
}

/* Primary content blocks match the Preisalarm content cards. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-feature-card,
  .fd-overall-card,
  .fd-tank-form-card,
  .fd-tank-history,
  .fd-month-card,
  .fd-backup-card,
  .fd-account-card
) {
  border-color: var(--fd-r223-border) !important;
  background: var(--fd-r223-card) !important;
  background-color: var(--fd-r223-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-feature-card__head > span,
  .fd-tank-history__head > span
) {
  border-color: var(--fd-r223-border) !important;
  background: var(--fd-r223-control) !important;
  background-image: none !important;
  color: var(--fd-r223-muted) !important;
  box-shadow: none !important;
}

/* Every editable control uses the exact dark Preisalarm material. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form :is(
  .fd-field > input,
  .fd-field > select,
  .fd-field > textarea,
  .fd-field-affix
) {
  border-color: var(--fd-r223-border) !important;
  background: var(--fd-r223-control) !important;
  background-color: var(--fd-r223-control) !important;
  background-image: none !important;
  color: var(--fd-r223-text) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color-scheme: dark !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form .fd-field-affix > input {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form .fd-field > :is(input, select, textarea):focus,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form .fd-field-affix:focus-within {
  border-color: var(--fd-r223-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r223-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form :is(input, textarea)::placeholder {
  color: #68686f !important;
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form :is(input[type="date"], input[type="datetime-local"])::-webkit-calendar-picker-indicator {
  opacity: .68 !important;
  filter: invert(1) !important;
}

/* Optional fields become one coherent dark disclosure block. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r223-border) !important;
  border-radius: 15px !important;
  padding: 0 12px !important;
  background: var(--fd-r223-control) !important;
  background-color: var(--fd-r223-control) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras summary {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-extras > div {
  padding: 4px 0 12px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Statistics, entries and file actions use quiet inset surfaces. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-tank-summary > article,
  .fd-month-grid > article,
  .fd-tank-entry,
  .fd-tank-entry__values > span,
  .fd-tank-empty,
  .fd-backup-actions > button,
  .fd-statistics-date__control
) {
  border-color: var(--fd-r223-border) !important;
  background: var(--fd-r223-control) !important;
  background-color: var(--fd-r223-control) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}


html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__values > span {
  background: var(--fd-r223-card) !important;
  background-color: var(--fd-r223-card) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control {
  color: var(--fd-r223-text) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control :is(svg, .fd-statistics-date__label, input) {
  color: var(--fd-r223-text) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-date__control input::-webkit-calendar-picker-indicator {
  opacity: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-field > span:first-child,
  .fd-statistics-date > span:first-child,
  .fd-feature-card > p,
  .fd-backup-card > p,
  .fd-tank-entry > p,
  .fd-tank-empty p
) {
  color: var(--fd-r223-muted) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-backup-actions > button:active {
  border-color: var(--fd-r223-border-strong) !important;
  transform: scale(.985);
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-submit {
  border-color: var(--fd-r223-red) !important;
  background: var(--fd-r223-red) !important;
  background-image: none !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker {
  grid-column: 1 / -1;
  display: grid;
  gap: 9px;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker > span,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker small {
  color: var(--fd-r223-muted) !important;
  font-size: 11px;
  font-weight: 700;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker section {
  display: grid;
  gap: 6px;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker section > div {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding-bottom: 2px;
  scrollbar-width: none;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker section > div::-webkit-scrollbar { display: none; }

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker button {
  flex: 0 0 auto;
  max-width: 248px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 9px 11px;
  border: 1px solid var(--fd-r223-border);
  border-radius: 12px;
  background: var(--fd-r223-control);
  color: var(--fd-r223-text);
  font: inherit;
  font-size: 12px;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker button.is-selected {
  border-color: var(--fd-r223-red);
  background: color-mix(in srgb, var(--fd-r223-red) 17%, var(--fd-r223-control));
  color: #fff;
}

/* Source: /assets/r224-price-history.css */
/* FuelDash R224 — honest partial-day price-history coverage. */
.detail-chart .chart-coverage-note {
  margin: 10px 0 2px;
  padding: 9px 11px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: #080808;
  color: rgba(245, 245, 247, 0.68);
  font-size: 12px;
  line-height: 1.35;
}

/* Source: /assets/r229-monitoring.css */
/* FuelDash R229 — explicit monitoring coverage in station details. */
#app .detail-monitoring-status {
  display: grid;
  gap: 3px;
  margin: 12px 0 2px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 13px;
  background: #090909;
  color: rgba(255, 255, 255, .68);
  font-size: 11px;
  line-height: 1.35;
}

#app .detail-monitoring-status strong {
  color: #f5f5f7;
  font-size: 12px;
}

#app .detail-monitoring-status.is-monitored {
  border-color: rgba(48, 209, 88, .25);
  background: rgba(48, 209, 88, .07);
}

#app .detail-monitoring-status.is-monitored strong { color: #30d158; }

#app .detail-monitoring-status.is-archive strong { color: rgba(255, 255, 255, .78); }

/* Source: /assets/r225-tankbook-alert-parity.css */
/* FuelDash R225 — exact Tankbuch input and Preisalarm card parity. */
:root {
  --fd-r225-card: #0c0c0c;
  --fd-r225-control: #080808;
  --fd-r225-border: #1e1e1e;
  --fd-r225-text: #f5f5f7;
}

/*
 * R158 still contains an ID-specific legacy rule that paints Tankbuch controls
 * #17171b. Match that selector weight and keep every editor equal to the dark
 * statistics date control.
 */
html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-tank-form
  .fd-field > :is(input, select, textarea, .fd-field-affix) {
  border-color: var(--fd-r225-border) !important;
  background: var(--fd-r225-control) !important;
  background-color: var(--fd-r225-control) !important;
  background-image: none !important;
  background-clip: padding-box !important;
  box-shadow: none !important;
  color: var(--fd-r225-text) !important;
  -webkit-text-fill-color: var(--fd-r225-text) !important;
  color-scheme: dark !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-tank-form
  .fd-field-affix > input {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-tank-form input[name="filledAt"]::-webkit-date-and-time-value,
html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-tank-form input[name="filledAt"]::-webkit-datetime-edit {
  background: transparent !important;
  color: var(--fd-r225-text) !important;
  -webkit-text-fill-color: var(--fd-r225-text) !important;
}

/*
 * R148 assigns alert rows to the raised control material. The row itself is a
 * content tile, while only select/time/number inputs remain #080808.
 */
html[data-fd-theme="dark"] body:not(#fd-r148-core-scope):not(#fd-r225-alert-scope)
  .fd-alert-modal :is(.fd-alert-row, .fd-alert-all, .fd-alert-station, .fd-alert-empty) {
  border-color: var(--fd-r225-border) !important;
  background: var(--fd-r225-card) !important;
  background-color: var(--fd-r225-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r148-core-scope):not(#fd-r225-alert-scope)
  .fd-alert-modal .fd-alert-row :is(select, input[type="time"], input[type="number"]) {
  border-color: var(--fd-r225-border) !important;
  background: var(--fd-r225-control) !important;
  background-color: var(--fd-r225-control) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-r225-text) !important;
  -webkit-text-fill-color: var(--fd-r225-text) !important;
  color-scheme: dark !important;
}

/* Source: /assets/r226-chart-loading.css */
/* FuelDash R226 — chart gesture ownership and visible view loading. */
#app .fuel-chart.is-detail,
#app .fuel-chart.is-detail .chart-canvas,
#app .fuel-chart.is-detail [data-chart-interactive] {
  overscroll-behavior-inline: contain;
  touch-action: pan-y !important;
  -webkit-user-select: none;
  user-select: none;
}

#app .fuel-chart.is-detail [data-chart-interactive] {
  cursor: crosshair;
}

#app .tab-loading {
  display: grid !important;
  min-height: 42dvh !important;
  place-items: center !important;
}

#app .tab-loading-spinner {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  box-sizing: border-box !important;
  width: 26px !important;
  height: 26px !important;
  border: 3px solid rgba(255, 59, 48, .22) !important;
  border-top-color: #ff3b30 !important;
  border-radius: 50% !important;
  animation: fd-r60-spin .72s linear infinite !important;
}

@media (prefers-reduced-motion: reduce) {
  #app .tab-loading-spinner { animation-duration: 1.8s !important; }
}

/* Source: /assets/r236-unified-form-typography.css */
/* FuelDash R236 — one quiet, readable type scale for every form. */
:root {
  --fd-form-heading: #f5f5f7;
  --fd-form-label: #a1a1a8;
  --fd-form-help: #75757d;
  --fd-form-placeholder: #72727a;
  --fd-form-control: #080808;
  --fd-form-card: #0c0c0c;
  --fd-form-border: #1e1e1e;
  --fd-form-focus: #ff3b30;
}

/* Titles orient first; labels remain useful without competing with values. */
html body :is(.fd-feature-page, .fd-account-sheet) :is(
  .fd-feature-card__head h2,
  .fd-account-page-title h1
) {
  color: var(--fd-form-heading) !important;
  font-weight: 740 !important;
  letter-spacing: -.028em !important;
  line-height: 1.12 !important;
}

html body :is(.fd-feature-page, .fd-account-sheet) :is(
  .fd-feature-card__head small,
  .fd-account-page-title small
) {
  color: var(--fd-form-label) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .14em !important;
}

html body :is(.fd-feature-page, .fd-account-sheet) :is(
  .fd-field > span:first-child,
  .fd-auth-form > label > span,
  .fd-account-card__password > label > span,
  .fd-tank-station-picker > span
) {
  color: var(--fd-form-label) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  letter-spacing: .01em !important;
  line-height: 1.25 !important;
}

html body :is(.fd-feature-page, .fd-account-sheet) :is(
  .fd-field > small,
  .fd-auth-form > label > small,
  .fd-auth-explanation
) {
  color: var(--fd-form-help) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1.42 !important;
}

/* All editable values use a 16 px text size so iOS does not zoom a form. */
html body :is(.fd-feature-page, .fd-account-sheet) :is(
  .fd-tank-form .fd-field > input,
  .fd-tank-form .fd-field > select,
  .fd-tank-form .fd-field > textarea,
  .fd-tank-form .fd-field-affix > input,
  .fd-auth-form input,
  .fd-account-card__password input
) {
  border-color: var(--fd-form-border) !important;
  background: var(--fd-form-control) !important;
  color: var(--fd-form-heading) !important;
  -webkit-text-fill-color: var(--fd-form-heading) !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  box-shadow: none !important;
}

html body :is(.fd-feature-page, .fd-alert-modal, .fd-account-sheet) :is(
  .fd-tank-form .fd-field-affix,
  .fd-tank-extras,
  .fd-alert-row,
  .fd-alert-station,
  .fd-alert-empty
) {
  border-color: var(--fd-form-border) !important;
  background: var(--fd-form-card) !important;
  box-shadow: none !important;
}

/* Examples are intentionally quieter than actual values, including in Safari. */
html body :is(.fd-feature-page, .fd-alert-modal, .fd-account-sheet) :is(
  .fd-tank-form input,
  .fd-tank-form textarea,
  .fd-auth-form input,
  .fd-account-card__password input
)::placeholder {
  color: var(--fd-form-placeholder) !important;
  -webkit-text-fill-color: var(--fd-form-placeholder) !important;
  opacity: 1 !important;
}

/* Red stays reserved for a field the person is actively editing. */
html body :is(.fd-feature-page, .fd-alert-modal, .fd-account-sheet) :is(
  .fd-tank-form .fd-field > input,
  .fd-tank-form .fd-field > select,
  .fd-tank-form .fd-field > textarea,
  .fd-auth-form input,
  .fd-account-card__password input,
  .fd-alert-row :is(select, input[type="time"], input[type="number"])
):focus,
html body .fd-feature-page .fd-tank-form .fd-field-affix:focus-within {
  border-color: var(--fd-form-focus) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-form-focus) !important;
}

html[data-fd-theme="light"] {
  --fd-form-heading: #17171a;
  --fd-form-label: #62626a;
  --fd-form-help: #7b7b84;
  --fd-form-placeholder: #8c8c95;
  --fd-form-control: #ffffff;
  --fd-form-card: #f7f7f8;
  --fd-form-border: #dedee3;
}

/* Source: /assets/r237-vehicles.css */
/* FuelDash R237 — vehicle profiles and active-vehicle tankbook selector. */
:root {
  --fd-r237-page: #000000;
  --fd-r237-card: #0c0c0c;
  --fd-r237-control: #080808;
  --fd-r237-border: #1e1e1e;
  --fd-r237-border-strong: #2a2a2e;
  --fd-r237-text: #f5f5f7;
  --fd-r237-muted: #92929a;
  --fd-r237-placeholder: #68686f;
  --fd-r237-red: #ff3b30;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
  .fd-feature-shell,
  .fd-feature-header,
  .fd-feature-content
),
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] {
  background: var(--fd-r237-page) !important;
  background-color: var(--fd-r237-page) !important;
  background-image: none !important;
  color: var(--fd-r237-text) !important;
  color-scheme: dark !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
  .fd-feature-card,
  .fd-vehicle-card,
  .fd-vehicle-selector-card
),
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector-card {
  border: 1px solid var(--fd-r237-border) !important;
  background: var(--fd-r237-card) !important;
  background-color: var(--fd-r237-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-content,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector-card {
  display: grid;
  gap: 14px;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-intro,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card p,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-selector__meta,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card small,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector-card small,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector__meta {
  color: var(--fd-r237-muted) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-intro {
  margin: -4px 0 2px !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.fd-vehicle-list {
  display: grid;
  gap: 10px;
}

.fd-vehicle-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.fd-vehicle-form .fd-form-status,
.fd-vehicle-form .fd-tank-submit { grid-column: 1 / -1; }

.fd-vehicle-form .fd-tank-submit {
  width: 100%;
  min-height: 46px;
  border: 1px solid var(--fd-r237-red);
  border-radius: 13px;
  background: var(--fd-r237-red);
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
}

.fd-vehicle-card {
  display: grid;
  gap: 13px;
  padding: 14px !important;
  border-radius: 16px !important;
}

.fd-vehicle-card.is-active {
  border-color: color-mix(in srgb, var(--fd-r237-red) 62%, var(--fd-r237-border)) !important;
  box-shadow: inset 2px 0 0 var(--fd-r237-red) !important;
}

.fd-vehicle-card__head,
.fd-vehicle-card__stats,
.fd-vehicle-card__actions,
.fd-vehicle-selector-card .fd-feature-card__head {
  display: flex;
  align-items: center;
  gap: 9px;
}

.fd-vehicle-card__head {
  justify-content: space-between;
  align-items: flex-start;
}

.fd-vehicle-card__head h3 {
  margin: 4px 0 0 !important;
  color: var(--fd-r237-text) !important;
  font-size: 17px !important;
  line-height: 1.15 !important;
}

.fd-vehicle-card__head p {
  margin: 5px 0 0 !important;
  font-size: 12px !important;
}

.fd-vehicle-card__fuel,
.fd-vehicle-card__default {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid var(--fd-r237-border);
  border-radius: 999px;
  background: var(--fd-r237-control);
  color: var(--fd-r237-muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.fd-vehicle-card__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.fd-vehicle-card__stats span {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 9px 8px;
  border: 1px solid var(--fd-r237-border);
  background: var(--fd-r237-control);
}

.fd-vehicle-card__stats span:first-child { border-radius: 11px 0 0 11px; }
.fd-vehicle-card__stats span:last-child { border-radius: 0 11px 11px 0; }
.fd-vehicle-card__stats span + span { border-left: 0; }

.fd-vehicle-card__stats strong {
  overflow: hidden;
  color: var(--fd-r237-text);
  font-size: 12px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fd-vehicle-card__actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.fd-vehicle-card__actions button,
.fd-inline-action {
  min-height: 34px !important;
  padding: 7px 11px !important;
  border: 1px solid var(--fd-r237-border) !important;
  border-radius: 10px !important;
  background: var(--fd-r237-control) !important;
  color: var(--fd-r237-text) !important;
  font: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.fd-vehicle-card__actions button:hover,
.fd-inline-action:hover {
  border-color: var(--fd-r237-border-strong) !important;
}

.fd-vehicle-card__actions .fd-vehicle-card__delete {
  color: #ff8b84 !important;
}

.fd-inline-action {
  flex: 0 0 auto;
  color: #ff8b84 !important;
}

.fd-vehicle-selector-card {
  gap: 12px !important;
  padding: 14px !important;
}

.fd-vehicle-selector-card .fd-feature-card__head {
  justify-content: space-between;
}

.fd-vehicle-selector-card .fd-feature-card__head h2 {
  margin-top: 4px !important;
}

.fd-vehicle-selector {
  display: grid;
  gap: 6px;
}

.fd-vehicle-selector > span,
.fd-vehicle-form .fd-field > span:first-child {
  color: var(--fd-r237-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

.fd-vehicle-selector select,
.fd-vehicle-form :is(input, select, textarea),
.fd-vehicle-form .fd-field-affix {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--fd-r237-border) !important;
  border-radius: 12px;
  background: var(--fd-r237-control) !important;
  background-color: var(--fd-r237-control) !important;
  background-image: none !important;
  color: var(--fd-r237-text) !important;
  color-scheme: dark !important;
  box-shadow: none !important;
}

.fd-vehicle-selector select,
.fd-vehicle-form :is(input, select, textarea) {
  padding: 10px 12px;
  font: inherit;
  font-size: 14px;
}

.fd-vehicle-form :is(input, select, textarea)::placeholder {
  color: var(--fd-r237-placeholder) !important;
  opacity: 1 !important;
}

.fd-vehicle-form .fd-field-affix {
  display: flex;
  align-items: center;
  padding-right: 11px;
}

.fd-vehicle-form .fd-field-affix input {
  min-height: 42px;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.fd-vehicle-form .fd-field-affix b {
  color: var(--fd-r237-muted);
  font-size: 12px;
}

.fd-vehicle-selector select:focus,
.fd-vehicle-form :is(input, select, textarea):focus,
.fd-vehicle-form .fd-field-affix:focus-within {
  border-color: var(--fd-r237-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r237-red) !important;
}

.fd-vehicle-form :is(input, select, textarea)[aria-invalid="true"] {
  border-color: var(--fd-r237-red) !important;
}

.fd-vehicle-form .fd-form-status:empty {
  display: none;
}

.fd-vehicle-form .fd-form-status {
  margin: 0;
  color: var(--fd-r237-muted);
  font-size: 12px;
}

.fd-vehicle-form .fd-form-status[data-type="error"] { color: #ff8b84; }
.fd-vehicle-form .fd-form-status[data-type="success"] { color: #8ce3a5; }

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector__meta {
  margin: 0 !important;
  font-size: 12px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-summary-optional,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__stats strong {
  color: var(--fd-r237-text) !important;
}

@media (max-width: 430px) {
  .fd-vehicle-form { grid-template-columns: minmax(0, 1fr); }
  .fd-vehicle-form .fd-form-status,
  .fd-vehicle-form .fd-tank-submit { grid-column: auto; }
  .fd-vehicle-card__actions { justify-content: stretch; }
  .fd-vehicle-card__actions button,
  .fd-vehicle-card__actions .fd-vehicle-card__default { flex: 1 1 auto; text-align: center; }
  .fd-vehicle-card__stats strong { font-size: 11px; }
}

/* Source: /assets/r238-vehicles.css */
/* FuelDash R238 — vehicle controls follow the Tankbuch rhythm. */
:root {
  --fd-r238-page: #000000;
  --fd-r238-card: #0c0c0c;
  --fd-r238-control: #080808;
  --fd-r238-border: #1e1e1e;
  --fd-r238-border-strong: #2a2a2e;
  --fd-r238-text: #f5f5f7;
  --fd-r238-muted: #92929a;
  --fd-r238-red: #ff3b30;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-content {
  display: grid !important;
  gap: 16px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
  .fd-vehicles-list-card,
  .fd-vehicle-editor-card
) {
  box-sizing: border-box !important;
  padding: 18px !important;
  border-radius: 21px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicles-list-card .fd-feature-card__head,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-editor-card .fd-feature-card__head {
  margin-bottom: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-intro {
  max-width: 34rem;
  margin: 10px 0 0 !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add-action {
  box-sizing: border-box !important;
  display: flex !important;
  width: 100% !important;
  min-height: 46px !important;
  height: 46px !important;
  margin: 2px 0 0 !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 14px !important;
  border: 1px solid var(--fd-r238-border-strong) !important;
  border-radius: 14px !important;
  background: var(--fd-r238-control) !important;
  background-image: none !important;
  color: var(--fd-r238-text) !important;
  font: inherit !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add-action:hover,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions .fd-auth-secondary:hover,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector__manage:hover {
  border-color: var(--fd-r238-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-list {
  display: grid !important;
  gap: 14px !important;
  margin-top: 2px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card {
  display: grid !important;
  gap: 16px !important;
  padding: 16px !important;
  border-radius: 18px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__head {
  gap: 12px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__head small {
  color: var(--fd-r238-red) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .14em !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__head h3 {
  margin-top: 5px !important;
  font-size: 19px !important;
  font-weight: 740 !important;
  letter-spacing: -.02em !important;
  line-height: 1.15 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__head p {
  margin-top: 6px !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__fuel {
  padding: 6px 9px !important;
  border-color: var(--fd-r238-border-strong) !important;
  background: var(--fd-r238-control) !important;
  color: var(--fd-r238-muted) !important;
  font-size: 10px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__stats span,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__stats span:first-child,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__stats span:last-child {
  min-width: 0 !important;
  min-height: 62px !important;
  box-sizing: border-box !important;
  padding: 10px 9px !important;
  border: 1px solid var(--fd-r238-border) !important;
  border-radius: 13px !important;
  background: var(--fd-r238-control) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__stats span + span {
  border-left: 1px solid var(--fd-r238-border) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__stats small {
  color: var(--fd-r238-muted) !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__stats strong {
  overflow-wrap: anywhere !important;
  white-space: normal !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions {
  display: grid !important;
  gap: 8px !important;
  margin-top: 0 !important;
  align-items: stretch !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions > button,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__default {
  box-sizing: border-box !important;
  display: flex !important;
  width: 100% !important;
  min-height: 44px !important;
  height: 44px !important;
  max-height: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
  border: 1px solid var(--fd-r238-border-strong) !important;
  border-radius: 14px !important;
  background: var(--fd-r238-control) !important;
  background-image: none !important;
  color: var(--fd-r238-text) !important;
  font: inherit !important;
  font-size: 14px !important;
  font-weight: 680 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__default {
  color: var(--fd-r238-muted) !important;
  font-size: 12px !important;
  font-weight: 760 !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions .fd-vehicle-card__delete {
  justify-self: center !important;
  width: auto !important;
  min-height: 34px !important;
  height: 34px !important;
  padding: 4px 8px !important;
  border: 0 !important;
  background: transparent !important;
  color: #ff8b84 !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-editor-card .fd-vehicle-form {
  gap: 14px !important;
  margin-top: 4px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-field > span:first-child,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector > span {
  color: var(--fd-r238-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form :is(input, select, textarea) {
  min-height: 46px !important;
  border-radius: 14px !important;
  font-size: 15px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-tank-submit {
  height: 46px !important;
  min-height: 46px !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector-card {
  display: grid !important;
  gap: 14px !important;
  padding: 18px !important;
  border-radius: 21px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector-card .fd-feature-card__head {
  margin-bottom: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector {
  gap: 7px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector select {
  box-sizing: border-box !important;
  min-height: 46px !important;
  padding: 0 12px !important;
  border-radius: 14px !important;
  font-size: 15px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector__meta {
  margin: -3px 0 0 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector__manage {
  box-sizing: border-box !important;
  display: flex !important;
  width: 100% !important;
  min-height: 44px !important;
  height: 44px !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 0 !important;
  padding: 0 12px !important;
  border: 1px solid var(--fd-r238-border-strong) !important;
  border-radius: 14px !important;
  background: var(--fd-r238-control) !important;
  background-image: none !important;
  color: var(--fd-r238-text) !important;
  font: inherit !important;
  font-size: 14px !important;
  font-weight: 680 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
}

html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
  .fd-vehicles-list-card,
  .fd-vehicle-editor-card,
  .fd-vehicle-card
),
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector-card {
  border-color: #dedee3 !important;
  background: #ffffff !important;
  color: #17171a !important;
}

html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
  .fd-vehicle-add-action,
  .fd-vehicle-card__actions > button,
  .fd-vehicle-card__default
),
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-selector__manage {
  border-color: #dedee3 !important;
  background: #f4f5f7 !important;
  color: #17171a !important;
}

html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions .fd-vehicle-card__delete {
  border-color: transparent !important;
  background: transparent !important;
  color: #c52b23 !important;
}

@media (max-width: 430px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__stats {
    gap: 6px !important;
  }

  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__stats span {
    padding-inline: 8px !important;
  }
}

/* Source: /assets/r239-single-vehicle.css */
/* FuelDash R239 — one calm vehicle profile, aligned with the Tankbuch rhythm. */
:root {
  --fd-r239-page: #000000;
  --fd-r239-card: #0c0c0c;
  --fd-r239-control: #080808;
  --fd-r239-border: #1e1e1e;
  --fd-r239-border-strong: #2a2a2e;
  --fd-r239-text: #f5f5f7;
  --fd-r239-muted: #92929a;
  --fd-r239-placeholder: #68686f;
  --fd-r239-red: #ff3b30;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-content {
  display: grid !important;
  gap: 18px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-card,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
  box-sizing: border-box !important;
  display: grid !important;
  gap: 16px !important;
  padding: 22px !important;
  border: 1px solid var(--fd-r239-border) !important;
  border-radius: 22px !important;
  background: var(--fd-r239-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-r239-text) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-card .fd-feature-card__head,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card .fd-feature-card__head {
  align-items: flex-start !important;
  margin-bottom: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-card .fd-feature-card__head small,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card .fd-feature-card__head small {
  color: var(--fd-r239-red) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .14em !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-card h2,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card h2 {
  margin-top: 6px !important;
  color: var(--fd-r239-text) !important;
  font-size: 22px !important;
  font-weight: 740 !important;
  letter-spacing: -.025em !important;
  line-height: 1.15 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-intro,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__meta {
  max-width: 34rem;
  margin: -2px 0 0 !important;
  color: var(--fd-r239-muted) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 16px !important;
  margin-top: 2px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form .fd-field {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form .fd-field > span:first-child {
  color: var(--fd-r239-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form :is(input, select) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 46px !important;
  padding: 11px 13px !important;
  border: 1px solid var(--fd-r239-border) !important;
  border-radius: 14px !important;
  background: var(--fd-r239-control) !important;
  background-image: none !important;
  color: var(--fd-r239-text) !important;
  color-scheme: dark !important;
  font: inherit !important;
  font-size: 15px !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form input::placeholder {
  color: var(--fd-r239-placeholder) !important;
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form :is(input, select):focus {
  border-color: var(--fd-r239-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r239-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form :is(input, select)[aria-invalid="true"] {
  border-color: var(--fd-r239-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form .fd-form-status:empty {
  display: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form .fd-form-status {
  margin: -2px 0 0 !important;
  color: var(--fd-r239-muted) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form .fd-form-status[data-type="error"] {
  color: #ff8b84 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-form .fd-tank-submit {
  width: 100% !important;
  min-height: 48px !important;
  height: 48px !important;
  margin-top: 2px !important;
  border-radius: 15px !important;
  box-shadow: none !important;
  font-size: 15px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
  gap: 14px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__fuel {
  flex: 0 0 auto;
  align-self: flex-start;
  padding: 6px 10px !important;
  border: 1px solid var(--fd-r239-border-strong) !important;
  border-radius: 999px !important;
  background: var(--fd-r239-control) !important;
  color: var(--fd-r239-muted) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__edit {
  display: flex !important;
  width: 100% !important;
  min-height: 44px !important;
  height: 44px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 13px !important;
  border: 1px solid var(--fd-r239-border-strong) !important;
  border-radius: 14px !important;
  background: var(--fd-r239-control) !important;
  background-image: none !important;
  color: var(--fd-r239-text) !important;
  font: inherit !important;
  font-size: 14px !important;
  font-weight: 680 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page :is(.fd-vehicle-profile-card__edit, .fd-single-vehicle-form .fd-tank-submit):active {
  transform: translateY(1px);
}

@media (min-width: 720px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-single-vehicle-card,
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
    padding: 24px !important;
  }
}

/* Source: /assets/r240-vehicles.css */
/* FuelDash R240 — multiple vehicles and account settings in the Tankbuch rhythm. */
:root {
  --fd-r240-page: #000000;
  --fd-r240-card: #0c0c0c;
  --fd-r240-control: #080808;
  --fd-r240-border: #1e1e1e;
  --fd-r240-border-strong: #2a2a2e;
  --fd-r240-text: #f5f5f7;
  --fd-r240-muted: #92929a;
  --fd-r240-placeholder: #68686f;
  --fd-r240-red: #ff3b30;
  --fd-r240-success: #8ce3a5;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-content {
  display: grid !important;
  gap: 20px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
  .fd-vehicles-overview-card,
  .fd-vehicle-editor-card,
  .fd-vehicle-card
),
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r240-border) !important;
  background: var(--fd-r240-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-r240-text) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
  .fd-vehicles-overview-card,
  .fd-vehicle-editor-card
) {
  display: grid !important;
  gap: 20px !important;
  padding: 22px !important;
  border-radius: 22px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-card__head {
  align-items: flex-start !important;
  margin-bottom: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
  .fd-vehicles-overview-card .fd-feature-card__head small,
  .fd-vehicle-editor-card .fd-feature-card__head small
) {
  color: var(--fd-r240-red) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .14em !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
  .fd-vehicles-overview-card h2,
  .fd-vehicle-editor-card h2
) {
  margin-top: 6px !important;
  color: var(--fd-r240-text) !important;
  font-size: 22px !important;
  font-weight: 740 !important;
  letter-spacing: -.025em !important;
  line-height: 1.15 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicles-intro {
  max-width: 34rem;
  margin: -4px 0 0 !important;
  color: var(--fd-r240-muted) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-list {
  display: grid !important;
  gap: 16px !important;
  margin: -2px 0 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card {
  display: grid !important;
  gap: 18px !important;
  padding: 18px !important;
  border-radius: 19px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__identity,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__identity {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page :is(.fd-vehicle-type-icon, .fd-vehicle-type-option__icon) {
  display: grid !important;
  flex: 0 0 auto !important;
  place-items: center !important;
  color: var(--fd-r240-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page .fd-vehicle-type-icon {
  width: 44px !important;
  height: 44px !important;
  border: 1px solid var(--fd-r240-border-strong) !important;
  border-radius: 14px !important;
  background: var(--fd-r240-control) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page :is(.fd-vehicle-type-icon, .fd-vehicle-type-option__icon) svg {
  width: 23px !important;
  height: 23px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 1.7 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__identity > div,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__identity > div {
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__identity small,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__identity small {
  color: var(--fd-r240-muted) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .13em !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__identity h3,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__identity h2 {
  margin: 6px 0 0 !important;
  overflow-wrap: anywhere !important;
  color: var(--fd-r240-text) !important;
  font-size: 20px !important;
  font-weight: 740 !important;
  letter-spacing: -.02em !important;
  line-height: 1.16 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__identity p,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__identity p {
  margin: 7px 0 0 !important;
  color: var(--fd-r240-muted) !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}

/* The global auth buttons are intentionally reset here: vehicle actions are full-width, but never cramped into one row. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
  align-items: stretch !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions > :is(button, .fd-vehicle-card__default),
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-cancel {
  box-sizing: border-box !important;
  display: flex !important;
  width: 100% !important;
  min-height: 46px !important;
  height: 46px !important;
  max-height: none !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid var(--fd-r240-border-strong) !important;
  border-radius: 14px !important;
  background: var(--fd-r240-control) !important;
  background-image: none !important;
  color: var(--fd-r240-text) !important;
  font: inherit !important;
  font-size: 14px !important;
  font-weight: 680 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add {
  margin-top: 0 !important;
  border-color: var(--fd-r240-red) !important;
  background: var(--fd-r240-red) !important;
  color: #ffffff !important;
  font-weight: 760 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__default {
  color: var(--fd-r240-muted) !important;
  font-size: 11px !important;
  font-weight: 760 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions .fd-vehicle-card__delete {
  justify-self: center !important;
  width: auto !important;
  min-height: 34px !important;
  height: 34px !important;
  padding: 4px 8px !important;
  border: 0 !important;
  background: transparent !important;
  color: #ff8b84 !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions > button:hover,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add:hover,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__edit:hover {
  border-color: var(--fd-r240-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 18px !important;
  margin-top: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-field,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-field > span:first-child,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field legend {
  padding: 0 !important;
  color: var(--fd-r240-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form :is(input:not([type="radio"]), select) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 48px !important;
  padding: 11px 13px !important;
  border: 1px solid var(--fd-r240-border) !important;
  border-radius: 14px !important;
  background: var(--fd-r240-control) !important;
  background-image: none !important;
  color: var(--fd-r240-text) !important;
  color-scheme: dark !important;
  font: inherit !important;
  font-size: 16px !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form input::placeholder {
  color: var(--fd-r240-placeholder) !important;
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form :is(input:not([type="radio"]), select):focus {
  border-color: var(--fd-r240-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r240-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field {
  border: 0 !important;
  padding: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option {
  position: relative !important;
  display: grid !important;
  min-height: 78px !important;
  padding: 12px !important;
  place-items: center !important;
  align-content: center !important;
  gap: 7px !important;
  border: 1px solid var(--fd-r240-border) !important;
  border-radius: 15px !important;
  background: var(--fd-r240-control) !important;
  color: var(--fd-r240-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  text-align: center !important;
  cursor: pointer !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option:last-child {
  grid-column: 1 / -1 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  clip-path: inset(50%) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option:has(input:checked) {
  border-color: var(--fd-r240-red) !important;
  background: color-mix(in srgb, var(--fd-r240-red) 10%, var(--fd-r240-control)) !important;
  color: var(--fd-r240-text) !important;
  box-shadow: inset 0 0 0 1px var(--fd-r240-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option:focus-within {
  outline: 1px solid var(--fd-r240-red) !important;
  outline-offset: 2px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option__icon {
  width: 25px !important;
  height: 25px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-form-status:empty {
  display: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-form-status {
  margin: -2px 0 0 !important;
  color: var(--fd-r240-muted) !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-form-status[data-type="success"] {
  color: var(--fd-r240-success) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-form-status[data-type="error"] {
  color: #ff8b84 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-tank-submit {
  width: 100% !important;
  min-height: 50px !important;
  height: 50px !important;
  margin: 0 !important;
  border-radius: 15px !important;
  box-shadow: none !important;
  font-size: 15px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
  display: grid !important;
  gap: 18px !important;
  padding: 22px !important;
  border-radius: 22px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__identity h2 {
  font-size: 21px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-select-field {
  display: grid !important;
  gap: 7px !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-select-field > span:first-child {
  color: var(--fd-r240-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-select-field select {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 48px !important;
  padding: 11px 13px !important;
  border: 1px solid var(--fd-r240-border) !important;
  border-radius: 14px !important;
  background: var(--fd-r240-control) !important;
  background-image: none !important;
  color: var(--fd-r240-text) !important;
  color-scheme: dark !important;
  font: inherit !important;
  font-size: 16px !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-select-field select:focus {
  border-color: var(--fd-r240-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r240-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__edit {
  display: flex !important;
  width: 100% !important;
  min-height: 46px !important;
  height: 46px !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid var(--fd-r240-border-strong) !important;
  border-radius: 14px !important;
  background: var(--fd-r240-control) !important;
  background-image: none !important;
  color: var(--fd-r240-text) !important;
  font: inherit !important;
  font-size: 14px !important;
  font-weight: 680 !important;
  box-shadow: none !important;
}

html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
  .fd-vehicles-overview-card,
  .fd-vehicle-editor-card,
  .fd-vehicle-card
),
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
  border-color: #dedee3 !important;
  background: #ffffff !important;
  color: #17171a !important;
}

html[data-fd-theme="light"] body .fd-feature-page :is(
  .fd-vehicle-card__actions > button,
  .fd-vehicle-card__default,
  .fd-vehicle-add,
  .fd-vehicle-cancel,
  .fd-vehicle-profile-card__edit,
  .fd-vehicle-type-option,
  .fd-vehicle-form :is(input:not([type="radio"]), select),
  .fd-vehicle-select-field select
) {
  border-color: #dedee3 !important;
  background: #f7f7f8 !important;
  color: #17171a !important;
}

html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add {
  border-color: var(--fd-r240-red) !important;
  background: var(--fd-r240-red) !important;
  color: #ffffff !important;
}

html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions .fd-vehicle-card__delete {
  border-color: transparent !important;
  background: transparent !important;
  color: #c52b23 !important;
}

@media (min-width: 620px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }

  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option:last-child {
    grid-column: auto !important;
  }
}

@media (min-width: 720px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] :is(
    .fd-vehicles-overview-card,
    .fd-vehicle-editor-card
  ),
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
    padding: 24px !important;
  }
}

/* Source: /assets/r242-vehicles.css */
/* FuelDash R242 — final vehicle/tankbook visual layer. */
:root {
  --fd-r242-page: #000000;
  --fd-r242-card: #0c0c0c;
  --fd-r242-control: #080808;
  --fd-r242-border: #1e1e1e;
  --fd-r242-border-strong: #2a2a2e;
  --fd-r242-text: #f5f5f7;
  --fd-r242-muted: #92929a;
  --fd-r242-placeholder: #68686f;
  --fd-r242-red: #ff3b30;
  --fd-r242-success: #8ce3a5;
  --fd-r242-section-gap: 28px;
  --fd-r242-content-gap: 24px;
  --fd-r242-label-gap: 10px;
}

/* R242 matches both theme-attribute locations used during startup and runtime. */
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"],
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"],
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"],
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] {
  color-scheme: dark !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-content,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-content {
  display: grid !important;
  gap: var(--fd-r242-section-gap) !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card, .fd-vehicle-editor-card),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card, .fd-vehicle-editor-card),
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r242-border) !important;
  border-radius: 22px !important;
  background: var(--fd-r242-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-r242-text) !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card, .fd-vehicle-editor-card),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card, .fd-vehicle-editor-card) {
  display: grid !important;
  gap: var(--fd-r242-content-gap) !important;
  padding: 24px !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-card__head,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-card__head {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-card__head > div,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-card__head > div {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card .fd-feature-card__head small, .fd-vehicle-editor-card .fd-feature-card__head small),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card .fd-feature-card__head small, .fd-vehicle-editor-card .fd-feature-card__head small) {
  color: var(--fd-r242-red) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .14em !important;
  line-height: 1.2 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card h2, .fd-vehicle-editor-card h2),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card h2, .fd-vehicle-editor-card h2) {
  margin: 0 !important;
  color: var(--fd-r242-text) !important;
  font-size: 22px !important;
  font-weight: 740 !important;
  letter-spacing: -.025em !important;
  line-height: 1.15 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicles-count,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicles-count {
  flex: 0 0 auto !important;
  align-self: flex-start !important;
  margin: 2px 0 0 auto !important;
  color: var(--fd-r242-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicles-intro,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicles-intro {
  max-width: 34rem !important;
  margin: 0 !important;
  color: var(--fd-r242-muted) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-list,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-list {
  display: grid !important;
  gap: var(--fd-r242-content-gap) !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card {
  display: grid !important;
  gap: var(--fd-r242-content-gap) !important;
  padding: 22px !important;
  border: 1px solid var(--fd-r242-border) !important;
  border-radius: 20px !important;
  background: var(--fd-r242-card) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card.is-default,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card.is-default {
  border-left: 2px solid var(--fd-r242-red) !important;
}

html[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-card__identity, .fd-vehicle-profile-card__identity),
body[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-card__identity, .fd-vehicle-profile-card__identity) {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-card__identity > div, .fd-vehicle-profile-card__identity > div),
body[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-card__identity > div, .fd-vehicle-profile-card__identity > div) {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] .fd-feature-page .fd-vehicle-type-icon,
body[data-fd-theme="dark"] .fd-feature-page .fd-vehicle-type-icon {
  display: grid !important;
  flex: 0 0 52px !important;
  align-self: flex-start !important;
  align-items: center !important;
  justify-items: center !important;
  width: 52px !important;
  height: 52px !important;
  margin-top: 1px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r242-border-strong) !important;
  border-radius: 15px !important;
  background: var(--fd-r242-control) !important;
  color: var(--fd-r242-red) !important;
}

html[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-type-icon, .fd-vehicle-type-option__icon) svg,
body[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-type-icon, .fd-vehicle-type-option__icon) svg {
  width: 23px !important;
  height: 23px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 1.7 !important;
}

html[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-card__identity small, .fd-vehicle-profile-card__identity small),
body[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-card__identity small, .fd-vehicle-profile-card__identity small) {
  color: var(--fd-r242-muted) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .13em !important;
  line-height: 1.2 !important;
}

html[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-card__identity h3, .fd-vehicle-profile-card__identity h2),
body[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-card__identity h3, .fd-vehicle-profile-card__identity h2) {
  margin: 0 !important;
  overflow-wrap: anywhere !important;
  color: var(--fd-r242-text) !important;
  font-size: 20px !important;
  font-weight: 740 !important;
  letter-spacing: -.02em !important;
  line-height: 1.16 !important;
}

html[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-card__identity p, .fd-vehicle-profile-card__identity p),
body[data-fd-theme="dark"] .fd-feature-page :is(.fd-vehicle-card__identity p, .fd-vehicle-profile-card__identity p) {
  margin: 0 !important;
  color: var(--fd-r242-muted) !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}

/* Older markup cannot reintroduce the removed status tile/text. */
html[data-fd-theme="dark"] .fd-feature-page .fd-vehicle-card__status,
body[data-fd-theme="dark"] .fd-feature-page .fd-vehicle-card__status,
html[data-fd-theme="dark"] .fd-feature-page .fd-vehicle-card__default,
body[data-fd-theme="dark"] .fd-feature-page .fd-vehicle-card__default {
  display: none !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions {
  display: grid !important;
  gap: 12px !important;
  margin: 0 !important;
  align-items: stretch !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions > button,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions > button,
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add,
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-cancel,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-cancel {
  box-sizing: border-box !important;
  display: flex !important;
  width: 100% !important;
  min-height: 48px !important;
  height: 48px !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid var(--fd-r242-border-strong) !important;
  border-radius: 15px !important;
  background: var(--fd-r242-control) !important;
  background-image: none !important;
  color: var(--fd-r242-text) !important;
  font: inherit !important;
  font-size: 14px !important;
  font-weight: 680 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add {
  min-height: 52px !important;
  height: 52px !important;
  border-color: var(--fd-r242-red) !important;
  background: var(--fd-r242-red) !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 760 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions .fd-vehicle-card__delete,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__actions .fd-vehicle-card__delete {
  justify-self: center !important;
  width: auto !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 4px 8px !important;
  border-color: transparent !important;
  background: transparent !important;
  color: #ff8b84 !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 20px !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-field,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-field,
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field {
  display: grid !important;
  gap: var(--fd-r242-label-gap) !important;
  min-width: 0 !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-field > span:first-child,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-field > span:first-child,
html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field legend,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field legend {
  padding: 0 !important;
  color: var(--fd-r242-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form :is(input:not([type="radio"]), select),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form :is(input:not([type="radio"]), select) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 50px !important;
  padding: 11px 14px !important;
  border: 1px solid var(--fd-r242-border) !important;
  border-radius: 15px !important;
  background: var(--fd-r242-control) !important;
  background-image: none !important;
  color: var(--fd-r242-text) !important;
  color-scheme: dark !important;
  font: inherit !important;
  font-size: 16px !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option {
  min-height: 84px !important;
  padding: 13px !important;
  gap: 8px !important;
  border: 1px solid var(--fd-r242-border) !important;
  border-radius: 16px !important;
  background: var(--fd-r242-control) !important;
  color: var(--fd-r242-muted) !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option:has(input:checked),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option:has(input:checked) {
  border-color: var(--fd-r242-red) !important;
  background: color-mix(in srgb, var(--fd-r242-red) 10%, var(--fd-r242-control)) !important;
  color: var(--fd-r242-text) !important;
  box-shadow: inset 0 0 0 1px var(--fd-r242-red) !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-form-status,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-form-status {
  margin: 0 !important;
  color: var(--fd-r242-muted) !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-form-status[data-type="success"],
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-form-status[data-type="success"] {
  color: var(--fd-r242-success) !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-tank-submit,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-tank-submit {
  width: 100% !important;
  min-height: 52px !important;
  height: 52px !important;
  margin: 0 !important;
  border-radius: 15px !important;
  box-shadow: none !important;
  font-size: 15px !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
  display: grid !important;
  gap: var(--fd-r242-content-gap) !important;
  padding: 24px !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r242-vehicle-select-field,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r242-vehicle-select-field {
  display: grid !important;
  gap: var(--fd-r242-label-gap) !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r242-vehicle-select-field > span:first-child,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r242-vehicle-select-field > span:first-child {
  color: var(--fd-r242-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r242-vehicle-select-field select,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r242-vehicle-select-field select {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 50px !important;
  padding: 11px 14px !important;
  border: 1px solid var(--fd-r242-border) !important;
  border-radius: 15px !important;
  background: #080808 !important;
  background-color: #080808 !important;
  background-image: none !important;
  color: var(--fd-r242-text) !important;
  color-scheme: dark !important;
  font: inherit !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r242-vehicle-select-field select:focus,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r242-vehicle-select-field select:focus {
  border-color: var(--fd-r242-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r242-red) !important;
}

html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__edit,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__edit {
  width: 100% !important;
  min-height: 48px !important;
  height: 48px !important;
  margin: 0 !important;
  border: 1px solid var(--fd-r242-border-strong) !important;
  border-radius: 15px !important;
  background: var(--fd-r242-control) !important;
  background-image: none !important;
  color: var(--fd-r242-text) !important;
  font: inherit !important;
  font-size: 14px !important;
  font-weight: 680 !important;
  box-shadow: none !important;
}

html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card, .fd-vehicle-editor-card, .fd-vehicle-card),
body[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card, .fd-vehicle-editor-card, .fd-vehicle-card),
html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card,
body[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
  border-color: #dedee3 !important;
  background: #ffffff !important;
  color: #17171a !important;
}

html[data-fd-theme="light"] .fd-feature-page :is(.fd-vehicle-type-icon, .fd-vehicle-card__actions > button, .fd-vehicle-add, .fd-vehicle-cancel, .fd-vehicle-profile-card__edit, .fd-vehicle-type-option, .fd-vehicle-form :is(input:not([type="radio"]), select), .fd-r242-vehicle-select-field select),
body[data-fd-theme="light"] .fd-feature-page :is(.fd-vehicle-type-icon, .fd-vehicle-card__actions > button, .fd-vehicle-add, .fd-vehicle-cancel, .fd-vehicle-profile-card__edit, .fd-vehicle-type-option, .fd-vehicle-form :is(input:not([type="radio"]), select), .fd-r242-vehicle-select-field select) {
  border-color: #dedee3 !important;
  background: #f7f7f8 !important;
  color: #17171a !important;
}

html[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add,
body[data-fd-theme="light"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-add {
  border-color: var(--fd-r242-red) !important;
  background: var(--fd-r242-red) !important;
  color: #ffffff !important;
}

html[data-fd-theme="light"] .fd-feature-page .fd-vehicle-card__status,
body[data-fd-theme="light"] .fd-feature-page .fd-vehicle-card__status,
html[data-fd-theme="light"] .fd-feature-page .fd-vehicle-card__default,
body[data-fd-theme="light"] .fd-feature-page .fd-vehicle-card__default {
  display: none !important;
}

@media (min-width: 620px) {
  html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid,
  body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 720px) {
  html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card, .fd-vehicle-editor-card),
  body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card, .fd-vehicle-editor-card),
  html[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card,
  body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
    padding: 28px !important;
  }
}

/* Source: /assets/r243-vehicles.css */
/* FuelDash R243 — final vehicle hierarchy, strict 2×2 tiles and OLED controls. */
:root {
  --fd-r243-card: #0c0c0c;
  --fd-r243-control: #080808;
  --fd-r243-border: #1e1e1e;
  --fd-r243-border-strong: #2a2a2e;
  --fd-r243-text: #f5f5f7;
  --fd-r243-muted: #92929a;
  --fd-r243-red: #ff3b30;
  --fd-r243-success: #8ce3a5;
}

/* The page uses one spacing rhythm for both the vehicle overview and editor. */
:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-content {
  display: grid !important;
  gap: 30px !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card, .fd-vehicle-editor-card) {
  display: grid !important;
  gap: 24px !important;
  padding: 26px !important;
  border: 1px solid var(--fd-r243-border) !important;
  border-radius: 22px !important;
  background: var(--fd-r243-card) !important;
  background-image: none !important;
  box-shadow: none !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-card__head {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  margin: 0 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-card__head > div {
  display: grid !important;
  gap: 9px !important;
  min-width: 0 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-card__head small {
  color: var(--fd-r243-red) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .14em !important;
  line-height: 1.2 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] :is(.fd-vehicles-overview-card h2, .fd-vehicle-editor-card h2) {
  margin: 0 !important;
  color: var(--fd-r243-text) !important;
  font-size: 22px !important;
  font-weight: 740 !important;
  letter-spacing: -.025em !important;
  line-height: 1.15 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicles-count {
  flex: 0 0 auto !important;
  align-self: flex-start !important;
  margin: 2px 0 0 auto !important;
  color: var(--fd-r243-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicles-intro {
  max-width: 34rem !important;
  margin: 0 !important;
  color: var(--fd-r243-muted) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-list {
  display: grid !important;
  gap: 18px !important;
  margin: 0 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card {
  display: grid !important;
  gap: 20px !important;
  padding: 22px !important;
  border: 1px solid var(--fd-r243-border) !important;
  border-radius: 20px !important;
  background: var(--fd-r243-card) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* The icon square is centered against the name block, not pinned to its top edge. */
:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page :is(.fd-vehicle-card__identity, .fd-vehicle-profile-card__identity) {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  min-width: 0 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page :is(.fd-vehicle-card__identity > div, .fd-vehicle-profile-card__identity > div) {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page .fd-vehicle-type-icon {
  display: grid !important;
  flex: 0 0 52px !important;
  place-items: center !important;
  align-self: center !important;
  width: 52px !important;
  height: 52px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r243-border-strong) !important;
  border-radius: 15px !important;
  background: var(--fd-r243-control) !important;
  color: var(--fd-r243-red) !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page :is(.fd-vehicle-type-icon, .fd-vehicle-type-option__icon) svg {
  display: block !important;
  width: 23px !important;
  height: 23px !important;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 1.7 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page :is(.fd-vehicle-card__identity small, .fd-vehicle-profile-card__identity small) {
  color: var(--fd-r243-muted) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .13em !important;
  line-height: 1.2 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page :is(.fd-vehicle-card__identity h3, .fd-vehicle-profile-card__identity h2) {
  margin: 0 !important;
  overflow-wrap: anywhere !important;
  color: var(--fd-r243-text) !important;
  font-size: 20px !important;
  font-weight: 740 !important;
  letter-spacing: -.02em !important;
  line-height: 1.16 !important;
}

/* The old R240 selector made the last tile full width. Every tile is a normal grid cell now. */
:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 12px !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option {
  display: grid !important;
  grid-column: auto !important;
  grid-template-rows: 28px auto !important;
  align-content: center !important;
  justify-items: center !important;
  place-items: center !important;
  min-height: 94px !important;
  padding: 13px !important;
  gap: 9px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r243-border) !important;
  border-radius: 16px !important;
  background: var(--fd-r243-control) !important;
  color: var(--fd-r243-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option__icon {
  display: grid !important;
  place-items: center !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  color: var(--fd-r243-red) !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-option:has(input:checked) {
  border-color: var(--fd-r243-red) !important;
  background: color-mix(in srgb, var(--fd-r243-red) 10%, var(--fd-r243-control)) !important;
  color: var(--fd-r243-text) !important;
  box-shadow: inset 0 0 0 1px var(--fd-r243-red) !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form {
  display: grid !important;
  gap: 22px !important;
  margin: 0 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-field,
:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form .fd-field > span:first-child,
:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field legend {
  padding: 0 !important;
  color: var(--fd-r243-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-form :is(input:not([type="radio"]), select) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 50px !important;
  padding: 11px 14px !important;
  border: 1px solid var(--fd-r243-border) !important;
  border-radius: 15px !important;
  background: var(--fd-r243-control) !important;
  background-image: none !important;
  color: var(--fd-r243-text) !important;
  color-scheme: dark !important;
  font: inherit !important;
  font-size: 16px !important;
  box-shadow: none !important;
}

/* This selector is intentionally stronger and loaded last so old blue-gray select rules cannot win. */
:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r243-vehicle-select-field select {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 50px !important;
  padding: 11px 44px 11px 14px !important;
  border: 1px solid var(--fd-r243-border) !important;
  border-radius: 15px !important;
  background: #080808 !important;
  background-color: #080808 !important;
  background-image: none !important;
  color: var(--fd-r243-text) !important;
  color-scheme: dark !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  font: inherit !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  box-shadow: none !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r243-vehicle-select-field {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r243-vehicle-select-field > span:first-child {
  color: var(--fd-r243-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r243-vehicle-select-field select:focus {
  border-color: var(--fd-r243-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r243-red) !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card {
  display: grid !important;
  gap: 24px !important;
  padding: 26px !important;
  border: 1px solid var(--fd-r243-border) !important;
  border-radius: 22px !important;
  background: var(--fd-r243-card) !important;
  background-image: none !important;
  box-shadow: none !important;
}

:is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__edit {
  width: 100% !important;
  min-height: 48px !important;
  height: 48px !important;
  margin: 0 !important;
  border: 1px solid var(--fd-r243-border-strong) !important;
  border-radius: 15px !important;
  background: var(--fd-r243-control) !important;
  background-image: none !important;
  color: var(--fd-r243-text) !important;
  box-shadow: none !important;
}

@media (min-width: 620px) {
  :is(html[data-fd-theme="dark"], body[data-fd-theme="dark"]) .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Source: /assets/r244-vehicles.css */
/* FuelDash R244 — final vehicle field and strict two-by-two vehicle type grid. */
:root {
  --fd-r244-control: #080808;
  --fd-r244-card: #0c0c0c;
  --fd-r244-border: #1e1e1e;
  --fd-r244-border-strong: #2a2a2e;
  --fd-r244-text: #f5f5f7;
  --fd-r244-muted: #92929a;
  --fd-r244-red: #ff3b30;
}

/* The direct html/body form is intentionally more specific than the legacy R240 last-child rule. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(94px, auto)) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: minmax(94px, auto) !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option {
  display: grid !important;
  grid-column: auto !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 94px !important;
  padding: 13px !important;
  align-content: center !important;
  justify-items: center !important;
  place-items: center !important;
  gap: 9px !important;
  border: 1px solid var(--fd-r244-border) !important;
  border-radius: 16px !important;
  background: var(--fd-r244-control) !important;
  color: var(--fd-r244-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

/* Explicitly neutralize the old full-width last tile and preserve Moped/Roller | Transporter. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:last-child,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:last-child,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(4),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(4) {
  grid-column: auto !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid .fd-vehicle-type-option__icon,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid .fd-vehicle-type-option__icon {
  display: grid !important;
  place-items: center !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  color: var(--fd-r244-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid .fd-vehicle-type-option__icon svg,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid .fd-vehicle-type-option__icon svg {
  display: block !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r244-vehicle-select-field,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r244-vehicle-select-field {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r244-vehicle-select-field > span:first-child,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r244-vehicle-select-field > span:first-child {
  color: var(--fd-r244-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}

/* R244 uses the same OLED-dark surface as the other Tankbuch input fields. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r244-vehicle-select-field select,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r244-vehicle-select-field select {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 50px !important;
  padding: 11px 44px 11px 14px !important;
  border: 1px solid var(--fd-r244-border) !important;
  border-radius: 15px !important;
  background: #080808 !important;
  background-color: #080808 !important;
  background-image: none !important;
  color: var(--fd-r244-text) !important;
  color-scheme: dark !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  font: inherit !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r244-vehicle-select-field select:focus,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r244-vehicle-select-field select:focus {
  border-color: var(--fd-r244-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r244-red) !important;
}

@media (max-width: 360px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid,
  body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
    gap: 10px !important;
  }

  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option,
  body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option {
    padding-inline: 8px !important;
    font-size: 11px !important;
  }
}

/* Source: /assets/r245-vehicle-final.css */
/* FuelDash R245 — final fieldset spacing and OLED vehicle selector override. */
:root {
  --fd-r245-control: #080808;
  --fd-r245-card: #0c0c0c;
  --fd-r245-border: #1e1e1e;
  --fd-r245-text: #f5f5f7;
  --fd-r245-muted: #92929a;
  --fd-r245-red: #ff3b30;
}

/* Reset the native fieldset/legend geometry so the label-to-grid gap is exact. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field legend,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field legend {
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.25 !important;
}

/* Preserve the approved Auto | Motorrad / Moped-Roller | Transporter order. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(94px, auto)) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: minmax(94px, auto) !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option {
  grid-column: auto !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* The Tankbuch selector uses the same flat OLED surface as the other controls. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r245-vehicle-select-field,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r245-vehicle-select-field {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r245-vehicle-select-field select,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r245-vehicle-select-field select {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 50px !important;
  padding: 11px 44px 11px 14px !important;
  border: 1px solid var(--fd-r245-border) !important;
  border-radius: 15px !important;
  background: #080808 !important;
  background-color: #080808 !important;
  background-image: none !important;
  background-clip: padding-box !important;
  color: var(--fd-r245-text) !important;
  -webkit-text-fill-color: var(--fd-r245-text) !important;
  color-scheme: dark !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  font: inherit !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r245-vehicle-select-field select:focus,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r245-vehicle-select-field select:focus {
  border-color: var(--fd-r245-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r245-red) !important;
}

/* Source: /assets/r246-vehicle-layout.css */
/* FuelDash R246 — final vehicle editor geometry and Tankbuch selector material. */
:root {
  --fd-r246-control: #080808;
  --fd-r246-border: #1e1e1e;
  --fd-r246-text: #f5f5f7;
  --fd-r246-muted: #92929a;
  --fd-r246-red: #ff3b30;
}

/* A normal group is intentional: native fieldset/legend layout is browser-dependent. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  row-gap: 12px !important;
  column-gap: 0 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-label,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-label {
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--fd-r246-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(94px, auto)) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: minmax(94px, auto) !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

/* Pin every tile to its intended cell so a legacy :last-child rule cannot stretch it. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option {
  box-sizing: border-box !important;
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 94px !important;
  grid-column: auto !important;
  grid-row: auto !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(1),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(1) {
  grid-area: 1 / 1 / 2 / 2 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(2),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(2) {
  grid-area: 1 / 2 / 2 / 3 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(3),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(3) {
  grid-area: 2 / 1 / 3 / 2 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(4),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(4) {
  grid-area: 2 / 2 / 3 / 3 !important;
}

/* Keep the Tankbuch selector on the same OLED-dark surface as the other fields. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r246-vehicle-select-field],
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r246-vehicle-select-field] {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r246-vehicle-select-field] > select,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r246-vehicle-select-field] > select {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 50px !important;
  padding: 11px 44px 11px 14px !important;
  border: 1px solid var(--fd-r246-border) !important;
  border-radius: 15px !important;
  background: #080808 !important;
  background-color: #080808 !important;
  background-image: none !important;
  background-clip: padding-box !important;
  color: var(--fd-r246-text) !important;
  -webkit-text-fill-color: var(--fd-r246-text) !important;
  color-scheme: dark !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  font: inherit !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r246-vehicle-select-field] > select:focus,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r246-vehicle-select-field] > select:focus {
  border-color: var(--fd-r246-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r246-red) !important;
}

/* Source: /assets/r247-vehicle-polish.css */
/* FuelDash R247 — final vehicle copy, identity spacing, and Tankbuch selector material. */
:root {
  --fd-r247-control: #080808;
  --fd-r247-border: #1e1e1e;
  --fd-r247-text: #f5f5f7;
  --fd-r247-muted: #92929a;
  --fd-r247-red: #ff3b30;
}

/* Keep the vehicle label and model name visually together without changing card spacing. */
html[data-fd-theme="dark"] body .fd-feature-page :is(
  .fd-vehicle-card__identity > div,
  .fd-vehicle-profile-card__identity > div
),
body[data-fd-theme="dark"] .fd-feature-page :is(
  .fd-vehicle-card__identity > div,
  .fd-vehicle-profile-card__identity > div
) {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}

/* The Tankbuch vehicle selector must use the same flat OLED surface as the date field. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r247-vehicle-select-field,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r247-vehicle-select-field,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r247-vehicle-select-field],
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r247-vehicle-select-field] {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r247-vehicle-select-field > select,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r247-vehicle-select-field > select,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r247-vehicle-select-field] > select,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r247-vehicle-select-field] > select,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] select[data-fd-r247-vehicle-select],
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] select[data-fd-r247-vehicle-select] {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 50px !important;
  padding: 11px 44px 11px 14px !important;
  border: 1px solid var(--fd-r247-border) !important;
  border-radius: 15px !important;
  background: var(--fd-r247-control) !important;
  background-color: var(--fd-r247-control) !important;
  background-image: none !important;
  background-clip: padding-box !important;
  -webkit-background-clip: padding-box !important;
  color: var(--fd-r247-text) !important;
  -webkit-text-fill-color: var(--fd-r247-text) !important;
  color-scheme: dark !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  font: inherit !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r247-vehicle-select-field > select:focus,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-r247-vehicle-select-field > select:focus,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r247-vehicle-select-field] > select:focus,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-r247-vehicle-select-field] > select:focus {
  border-color: var(--fd-r247-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r247-red) !important;
}

/* Source: /assets/r248-vehicle-final.css */
/* FuelDash R248 — final vehicle copy, identity spacing, grid, and Tankbuch selector material. */
:root {
  --fd-r248-control: #080808;
  --fd-r248-border: #1e1e1e;
  --fd-r248-text: #f5f5f7;
  --fd-r248-muted: #92929a;
  --fd-r248-red: #ff3b30;
}

/* The R240 heading margin was !important. Reset it at the same final layer so the 3px gap is real. */
html[data-fd-theme="dark"] body .fd-feature-page :is(
  .fd-vehicle-card__identity > div,
  .fd-vehicle-profile-card__identity > div
),
body[data-fd-theme="dark"] .fd-feature-page :is(
  .fd-vehicle-card__identity > div,
  .fd-vehicle-profile-card__identity > div
) {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__identity > div > h3,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__identity > div > h3,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__identity > div > h2,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__identity > div > h2 {
  margin: 0 !important;
}

/* Re-pin every tile so the old last-child full-width rule cannot return. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(94px, auto)) !important;
  grid-auto-flow: row !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option,
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option {
  box-sizing: border-box !important;
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 94px !important;
  grid-column: auto !important;
  grid-row: auto !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(1),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(1) {
  grid-area: 1 / 1 / 2 / 2 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(2),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(2) {
  grid-area: 1 / 2 / 2 / 3 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(3),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(3) {
  grid-area: 2 / 1 / 3 / 2 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(4),
body[data-fd-theme="dark"] .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option:nth-child(4) {
  grid-area: 2 / 2 / 3 / 3 !important;
}

/* Match the ID-specific R158 selector weight and force the profile selector to the date-field OLED surface. */
html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-vehicle-profile-card
  .fd-r248-vehicle-select-field,
body[data-fd-theme="dark"]:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-vehicle-profile-card
  .fd-r248-vehicle-select-field,
html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  [data-fd-r248-vehicle-select-field],
body[data-fd-theme="dark"]:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  [data-fd-r248-vehicle-select-field] {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-vehicle-profile-card
  .fd-r248-vehicle-select-field > select,
body[data-fd-theme="dark"]:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-vehicle-profile-card
  .fd-r248-vehicle-select-field > select,
html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  [data-fd-r248-vehicle-select-field] > select,
body[data-fd-theme="dark"]:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  [data-fd-r248-vehicle-select-field] > select {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 50px !important;
  padding: 11px 44px 11px 14px !important;
  border: 1px solid var(--fd-r248-border) !important;
  border-radius: 15px !important;
  background: var(--fd-r248-control) !important;
  background-color: var(--fd-r248-control) !important;
  background-image: none !important;
  background-clip: padding-box !important;
  -webkit-background-clip: padding-box !important;
  color: var(--fd-r248-text) !important;
  -webkit-text-fill-color: var(--fd-r248-text) !important;
  color-scheme: dark !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  font: inherit !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-r248-vehicle-select-field > select:focus,
body[data-fd-theme="dark"]:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  .fd-r248-vehicle-select-field > select:focus,
html[data-fd-theme="dark"] body:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  [data-fd-r248-vehicle-select-field] > select:focus,
body[data-fd-theme="dark"]:not(#fd-r158-tankbook-scope)
  .fd-feature-page[data-fd-feature-view="tankbook"]
  [data-fd-r248-vehicle-select-field] > select:focus {
  border-color: var(--fd-r248-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r248-red) !important;
}

/* Source: /assets/r254-design-system.css */
/* FuelDash R254 — the document owns the OLED background; feature views do not paint viewport caps. */

html[data-fd-theme="dark"] {
  --fd-r251-page: #000000;
  --fd-r251-card: #0c0c0c;
  --fd-r251-control: #080808;
  --fd-r251-border: #1e1e1e;
  --fd-r251-border-strong: #2a2a2e;
  --fd-r251-text: #f5f5f7;
  --fd-r251-muted: #92929a;
  --fd-r251-help: #75757d;
  --fd-r251-placeholder: #68686f;
  --fd-r251-red: #ff3b30;
  --fd-r251-success: #8ce3a5;
  --fd-r251-space-section: 16px;
  --fd-r251-space-card: 16px;
  --fd-r251-space-field: 10px;
  --fd-r251-radius-card: 19px;
  --fd-r251-radius-tile: 14px;
  --fd-r251-radius-control: 13px;
}

html[data-fd-theme="dark"],
html[data-fd-theme="dark"] body,
html[data-fd-theme="dark"] body #app,
html[data-fd-theme="dark"] body.fd-feature-open,
html[data-fd-theme="dark"] body.fd-alert-open,
html[data-fd-theme="dark"].fd-alert-open body {
  min-height: 100%;
  background: #000000 !important;
  background-color: #000000 !important;
  background-image: none !important;
  color: var(--fd-r251-text) !important;
}

/* The document remains the single scroll owner while a feature is open. */
html[data-fd-theme="dark"],
html[data-fd-theme="dark"] body,
html[data-fd-theme="dark"] body.fd-feature-open,
html[data-fd-theme="dark"] body.fd-alert-open,
html[data-fd-theme="dark"].fd-alert-open body {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

/* Hide the dashboard underneath without adding a second painted viewport. */
html[data-fd-theme="dark"] body.fd-feature-open #app,
html[data-fd-theme="dark"].fd-alert-open body #app {
  display: none !important;
}

/* Tankbuch and Meine Fahrzeuge are normal document sections, not fixed dark overlays. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"],
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] {
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100dvh !important;
  max-height: none !important;
  margin: 0 !important;
  overflow: visible !important;
  overscroll-behavior-y: auto !important;
  touch-action: pan-y !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: var(--fd-r251-text) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-shell,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-shell {
  display: block !important;
  width: min(100%, 720px) !important;
  min-width: 0 !important;
  min-height: 100dvh !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 0 calc(34px + env(safe-area-inset-bottom)) !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-content {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--fd-r251-space-section) !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  box-sizing: border-box !important;
  padding: 16px 20px 0 !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-header,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-header {
  position: static !important;
  inset: auto !important;
  z-index: auto !important;
  display: grid !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: calc(18px + env(safe-area-inset-top)) 20px 14px !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transform: none !important;
}

/* Preisalarm follows the same normal document flow and shares the root surface. */
html[data-fd-theme="dark"] body .fd-alert-modal {
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100dvh !important;
  max-height: none !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  overscroll-behavior-y: auto !important;
  touch-action: pan-y !important;
  padding: calc(16px + env(safe-area-inset-top)) 14px calc(34px + env(safe-area-inset-bottom)) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: var(--fd-r251-text) !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-sheet {
  display: block !important;
  width: min(100%, 720px) !important;
  min-height: 100dvh !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  padding-top: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-head {
  position: static !important;
  inset: auto !important;
  top: auto !important;
  left: auto !important;
  z-index: auto !important;
  width: auto !important;
  height: auto !important;
  box-sizing: border-box !important;
  transform: none !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 16px !important;
  padding: 0 0 14px !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* No feature element may paint an end cap over the root page surface. */
html[data-fd-theme="dark"] body :is(.fd-feature-page, .fd-feature-shell, .fd-feature-header, .fd-feature-content, .fd-alert-modal, .fd-alert-sheet, .fd-alert-head)::before,
html[data-fd-theme="dark"] body :is(.fd-feature-page, .fd-feature-shell, .fd-feature-header, .fd-feature-content, .fd-alert-modal, .fd-alert-sheet, .fd-alert-head)::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

/* The visual hierarchy follows Mehr: compact, light-weight, and quiet. */
html[data-fd-theme="dark"] body .fd-feature-page {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif !important;
  font-weight: 400 !important;
}

html[data-fd-theme="dark"] body :is(.fd-feature-heading > small, .fd-feature-card__head small, .fd-tank-history__head small) {
  color: var(--fd-r251-red) !important;
  font-size: 9px !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

html[data-fd-theme="dark"] body .fd-feature-heading h1 {
  margin: 0 !important;
  color: var(--fd-r251-text) !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  letter-spacing: -.025em !important;
  line-height: 1.1 !important;
}

html[data-fd-theme="dark"] body .fd-feature-heading p {
  margin: 4px 0 0 !important;
  color: var(--fd-r251-muted) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}

html[data-fd-theme="dark"] body :is(.fd-feature-card__head h2, .fd-tank-history__head h2) {
  margin: 0 !important;
  color: var(--fd-r251-text) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: -.012em !important;
  line-height: 1.2 !important;
}

html[data-fd-theme="dark"] body :is(.fd-feature-card p, .fd-tank-empty p, .fd-form-status) {
  margin: 0 !important;
  color: var(--fd-r251-muted) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.42 !important;
}

html[data-fd-theme="dark"] body :is(.fd-field > span, .fd-statistics-date > span, .fd-vehicle-type-label) {
  color: var(--fd-r251-muted) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

html[data-fd-theme="dark"] body :is(.fd-feature-card, .fd-tank-history) {
  box-sizing: border-box !important;
  display: grid !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: var(--fd-r251-space-card) !important;
  border: 1px solid var(--fd-r251-border) !important;
  border-radius: var(--fd-r251-radius-card) !important;
  background: var(--fd-r251-card) !important;
  background-color: var(--fd-r251-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal :is(.fd-alert-status, .fd-alert-row, .fd-alert-station, .fd-alert-empty) {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-r251-border) !important;
  border-radius: var(--fd-r251-radius-tile) !important;
  background: var(--fd-r251-card) !important;
  background-color: var(--fd-r251-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: var(--fd-r251-text) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page :is(.fd-feature-card__head, .fd-tank-history__head) {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page :is(.fd-feature-card__head > div, .fd-tank-history__head > div) {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

/* Shared form rhythm and dark controls. */
html[data-fd-theme="dark"] body :is(.fd-tank-form, .fd-vehicle-form, .fd-field, .fd-vehicle-type-field) {
  gap: var(--fd-r251-space-field) !important;
}

html[data-fd-theme="dark"] body :is(.fd-field, .fd-vehicle-type-field, .fd-statistics-date) {
  display: grid !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body :is(.fd-feature-page .fd-field > input, .fd-feature-page .fd-field > select, .fd-feature-page .fd-field > textarea, .fd-feature-page .fd-field-affix) {
  box-sizing: border-box !important;
  min-height: 46px !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: var(--fd-r251-radius-control) !important;
  background: var(--fd-r251-control) !important;
  background-color: var(--fd-r251-control) !important;
  background-image: none !important;
  color: var(--fd-r251-text) !important;
  -webkit-text-fill-color: var(--fd-r251-text) !important;
  color-scheme: dark !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  font: inherit !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  opacity: 1 !important;
}

/* Preisalarm geometry stays here; its final visual boundary is loaded in V333. */
html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-row > :is(select, input[type="time"], input[type="number"]) {
  box-sizing: border-box !important;
  min-height: 46px !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: var(--fd-r251-radius-control) !important;
  background: var(--fd-r251-control) !important;
  background-color: var(--fd-r251-control) !important;
  background-image: none !important;
  color: var(--fd-r251-text) !important;
  -webkit-text-fill-color: var(--fd-r251-text) !important;
  color-scheme: dark !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page :is(.fd-field > input, .fd-field > select, .fd-field > textarea) {
  width: 100% !important;
  padding: 11px 14px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page :is(.fd-field > input, .fd-field > select, .fd-field > textarea)::placeholder {
  color: var(--fd-r251-placeholder) !important;
  -webkit-text-fill-color: var(--fd-r251-placeholder) !important;
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page :is(.fd-field > input, .fd-field > select, .fd-field > textarea):focus,
html[data-fd-theme="dark"] body .fd-alert-row :is(select, input[type="time"], input[type="number"]):focus {
  border-color: var(--fd-r251-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r251-red) !important;
}

/* Price-alert controls are deliberately identical in width and height. */
html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-grid,
html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-station-section,
html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-stations,
html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-actions {
  display: grid !important;
  gap: var(--fd-r251-space-field) !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-height: 60px !important;
  margin: 0 !important;
  padding: 11px 12px !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-row > span {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-row > :is(select, input[type="time"], input[type="number"]) {
  flex: 0 0 128px !important;
  width: 128px !important;
  min-width: 128px !important;
  max-width: 128px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 9px 10px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-row > input[type="checkbox"],
html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-station > input[type="checkbox"] {
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: 7px !important;
  background: var(--fd-r251-control) !important;
  background-color: var(--fd-r251-control) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-row > input[type="checkbox"]:checked,
html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-station > input[type="checkbox"]:checked {
  border-color: var(--fd-r251-red) !important;
  background: var(--fd-r251-red) !important;
  background-color: var(--fd-r251-red) !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-row--threshold {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  transform: none !important;
  border-left: 1px solid var(--fd-r251-border) !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-row--threshold.is-disabled {
  opacity: .55 !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-row--threshold > input:disabled {
  pointer-events: none !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-station-section {
  margin-top: var(--fd-r251-space-section) !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-station-section > header {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 0 4px !important;
  padding: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page .fd-tank-submit,
html[data-fd-theme="dark"] body .fd-feature-page .fd-auth-primary {
  min-height: 46px !important;
  border-radius: var(--fd-r251-radius-control) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-actions > button {
  min-height: 46px !important;
  border-radius: var(--fd-r251-radius-control) !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-actions > button:first-child,
html[data-fd-theme="dark"] body .fd-feature-page .fd-tank-submit,
html[data-fd-theme="dark"] body .fd-feature-page .fd-auth-primary {
  border-color: var(--fd-r251-red) !important;
  background: var(--fd-r251-red) !important;
  color: #ffffff !important;
}

html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-actions > button:not(:first-child),
html[data-fd-theme="dark"] body .fd-feature-page .fd-auth-secondary {
  border: 1px solid var(--fd-r251-border-strong) !important;
  background: var(--fd-r251-control) !important;
  color: var(--fd-r251-text) !important;
}

/* Keep the established full-width vehicle list and two-by-two type grid. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-list {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: var(--fd-r251-space-field) !important;
  width: 100% !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(90px, auto)) !important;
  grid-auto-flow: row !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid > .fd-vehicle-type-option {
  display: grid !important;
  grid-column: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 90px !important;
  box-sizing: border-box !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 8px !important;
  padding: 11px !important;
  border: 1px solid var(--fd-r251-border) !important;
  border-radius: var(--fd-r251-radius-tile) !important;
  background: var(--fd-r251-control) !important;
  color: var(--fd-r251-muted) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid .fd-vehicle-type-option__icon {
  display: grid !important;
  place-items: center !important;
  width: 26px !important;
  height: 26px !important;
  margin: 0 !important;
  color: var(--fd-r251-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-type-grid .fd-vehicle-type-option__icon svg {
  display: block !important;
  width: 23px !important;
  height: 23px !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  min-width: 0 !important;
  gap: 10px !important;
  padding: 14px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-vehicle-card__identity > div,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__identity > div {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page :is(.fd-vehicle-card__identity h3, .fd-vehicle-profile-card__identity h2) {
  margin: 0 !important;
  color: var(--fd-r251-text) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  overflow-wrap: anywhere !important;
}

html[data-fd-theme="dark"] body .fd-feature-page .fd-vehicle-card__identity small {
  color: var(--fd-r251-muted) !important;
  font-size: 9px !important;
  font-weight: 500 !important;
  letter-spacing: .12em !important;
}

html[data-fd-theme="dark"] body .fd-feature-page .fd-r248-vehicle-select-field select,
html[data-fd-theme="dark"] body .fd-feature-page [data-fd-r248-vehicle-select-field] select {
  background: var(--fd-r251-control) !important;
  background-color: var(--fd-r251-control) !important;
  background-image: none !important;
  color: var(--fd-r251-text) !important;
  -webkit-text-fill-color: var(--fd-r251-text) !important;
}

@media (min-width: 620px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-content,
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-content,
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-header,
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-header {
    padding-right: 24px !important;
    padding-left: 24px !important;
  }

  html[data-fd-theme="dark"] body .fd-alert-modal {
    padding-right: 24px !important;
    padding-left: 24px !important;
  }
}

@media (max-width: 360px) {
  html[data-fd-theme="dark"] body .fd-alert-modal .fd-alert-row > :is(select, input[type="time"], input[type="number"]) {
    flex-basis: 116px !important;
    width: 116px !important;
    min-width: 116px !important;
    max-width: 116px !important;
  }
}

/* R254: the legacy Preisalarm rules use body:not(#scope), so the final
   document-flow reset must carry the same specificity or it is ignored. */
html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-modal {
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100dvh !important;
  max-height: none !important;
  margin: 0 !important;
  overflow: visible !important;
  overscroll-behavior-y: auto !important;
  touch-action: pan-y !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-sheet {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: min(100%, 720px) !important;
  height: auto !important;
  min-height: 100dvh !important;
  max-height: none !important;
  margin: 0 auto !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-modal .fd-alert-head {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-modal::before,
html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-modal::after,
html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-sheet::before,
html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-sheet::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

/* R254: keep the Preisalarm content on one predictable spacing rhythm. */
html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-modal .fd-alert-sheet {
  display: grid !important;
  grid-auto-flow: row !important;
  align-content: start !important;
  row-gap: 10px !important;
}

html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-modal .fd-alert-station-section {
  margin-top: 0 !important;
}

html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-modal .fd-alert-stations {
  gap: 10px !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-modal .fd-alert-actions,
html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-modal .fd-alert-action-feedback,
html[data-fd-theme="dark"] body:not(#fd-r254-price-alert-scope) .fd-alert-modal .fd-alert-note {
  margin: 0 !important;
}

/* R263: keep the existing five-tab navigation usable while a nested view is open. */
html[data-fd-theme] body.fd-feature-open #app,
html[data-fd-theme].fd-alert-open body #app {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147482900 !important;
  display: block !important;
  width: 100% !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: visible !important;
  pointer-events: none !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme] body.fd-feature-open #app > .app-shell,
html[data-fd-theme].fd-alert-open body #app > .app-shell {
  height: 0 !important;
  min-height: 0 !important;
  pointer-events: none !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme] body.fd-feature-open #app > .app-shell > .app-content,
html[data-fd-theme].fd-alert-open body #app > .app-shell > .app-content {
  display: none !important;
}

html[data-fd-theme] body.fd-feature-open #app > .app-shell > .fuel-tab-bar,
html[data-fd-theme].fd-alert-open body #app > .app-shell > .fuel-tab-bar {
  position: fixed !important;
  z-index: 2147483001 !important;
  pointer-events: auto !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-shell,
html[data-fd-theme] body .fd-alert-modal {
  padding-bottom: calc(112px + env(safe-area-inset-bottom)) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  padding-bottom: calc(112px + env(safe-area-inset-bottom)) !important;
}

/* R263: the direct Tankbuch route needs no redundant back button. */
html[data-fd-theme] body .fd-feature-page .fd-feature-header--no-back {
  grid-template-columns: minmax(0, 1fr) !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-header--with-back {
  grid-template-columns: max-content minmax(0, 1fr) !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back--inline,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="account"] .fd-feature-back--inline {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  gap: 7px !important;
  padding: 0 12px !important;
  border-radius: 12px !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back--inline svg,
html[data-fd-theme] body .fd-feature-page .fd-feature-back--inline span {
  flex: 0 0 auto !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back--inline svg {
  width: 17px !important;
  height: 17px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header {
  justify-content: flex-start !important;
  gap: 10px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header .fd-main-header-actions {
  margin-left: auto !important;
}

/* R266: Tankbuch fields are visible in one consistent reading order. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: stretch !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form > .fd-field,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form > .fd-tank-station-picker {
  grid-column: 1 / -1 !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-label {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-field-required, .fd-field-optional) {
  flex: 0 0 auto !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 650 !important;
  letter-spacing: .02em !important;
  white-space: nowrap !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-required {
  color: #ff6b61 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-optional {
  color: var(--fd-r251-help) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-form-legend {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  margin: -2px 0 0 !important;
  color: var(--fd-r251-help) !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form__actions {
  display: flex !important;
  align-items: stretch !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 2px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form__actions .fd-tank-submit {
  flex: 1 1 220px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form__actions .fd-tank-cancel-edit,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__manage {
  min-height: 46px !important;
  padding: 11px 14px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__manage {
  width: 100% !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker {
  display: grid !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker > section {
  display: grid !important;
  gap: 6px !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker > section > div {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)) !important;
  gap: 8px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker [data-fd-station-option] {
  display: grid !important;
  justify-items: start !important;
  gap: 3px !important;
  min-width: 0 !important;
  min-height: 58px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--fd-r251-border) !important;
  border-radius: var(--fd-r251-radius-tile) !important;
  background: var(--fd-r251-card) !important;
  color: var(--fd-r251-text) !important;
  text-align: left !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker [data-fd-station-option].is-selected,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker [data-fd-station-option]:focus-visible {
  border-color: var(--fd-r251-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r251-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-station-option__brand {
  max-width: 100% !important;
  overflow: hidden !important;
  color: var(--fd-r251-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-station-option__address {
  max-width: 100% !important;
  overflow: hidden !important;
  color: var(--fd-r251-help) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions :is(.fd-tank-edit, .fd-tank-delete, .fd-tank-receipt) {
  min-height: 38px !important;
  padding: 8px 11px !important;
}

@media (max-width: 420px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form__actions :is(.fd-tank-submit, .fd-tank-cancel-edit) {
    flex-basis: 100% !important;
  }
}

/* Tankbook polish: compact entry editing, station address hierarchy, and readable statistics values. */
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-edit {
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 32px !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  padding: 0 !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--fd-r251-help) !important;
  line-height: 1 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-edit:hover,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-edit:focus-visible {
  border-color: var(--fd-r251-red) !important;
  color: var(--fd-r251-text) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r251-red) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-edit svg {
  width: 15px !important;
  height: 15px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__station-address {
  display: block !important;
  max-width: min(100%, 260px) !important;
  margin-top: 3px !important;
  overflow: hidden !important;
  color: var(--fd-r251-help) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker > span:first-child {
  color: var(--fd-r251-text) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker__control {
  min-width: 0 !important;
  border-radius: var(--fd-r251-radius-control) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker select {
  color: var(--fd-r251-text) !important;
  -webkit-text-fill-color: var(--fd-r251-text) !important;
  font-size: 13px !important;
  font-variant-numeric: tabular-nums !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
}

/* R266: nested pages use a dedicated back dock above the main navigation. */
html[data-fd-theme] body .fd-feature-page .fd-feature-header--with-back {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  gap: 10px !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-header--with-back > .fd-feature-back--inline {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  align-self: start !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-header--with-back > .fd-feature-heading {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back-row {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 20px 8px !important;
  background: transparent !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back-row .fd-feature-back--inline {
  display: inline-flex !important;
  justify-self: start !important;
  width: auto !important;
  min-width: 0 !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding: 0 10px !important;
  border-radius: 11px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back-row .fd-feature-back--inline svg {
  width: 16px !important;
  height: 16px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact {
  gap: 10px !important;
  padding: 12px 14px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__topline {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-profile-card__identity {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  min-width: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-type-icon {
  display: grid !important;
  flex: 0 0 30px !important;
  place-items: center !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 10px !important;
  background: var(--fd-r251-control) !important;
  color: var(--fd-r251-red) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-type-icon svg {
  width: 19px !important;
  height: 19px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card__name {
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  color: var(--fd-r251-text) !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-profile-card__manage {
  flex: 0 0 auto !important;
  width: auto !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-profile-card__selector {
  gap: 5px !important;
  margin: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-profile-card__selector > span {
  font-size: 10px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-profile-card__selector select {
  min-height: 38px !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

@media (max-width: 380px) {
  html[data-fd-theme] body .fd-feature-page .fd-feature-back-row {
    padding-inline: 14px !important;
  }

  html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-profile-card__topline {
    align-items: flex-start !important;
  }

  html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-profile-card__manage {
    padding-inline: 8px !important;
    font-size: 10px !important;
  }
}

/* R266: station groups carry a quiet visual accent without changing their data. */
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker {
  --fd-r266-station-primary: #d54740;
  --fd-r266-station-favorites: #9a690d;
  --fd-r266-station-nearby: #4769ad;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-picker {
  --fd-r266-station-primary: #ff5b52;
  --fd-r266-station-favorites: #e9b44c;
  --fd-r266-station-nearby: #78a6ff;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-group {
  --fd-r266-station-accent: var(--fd-r266-station-nearby);
  --fd-r266-station-tint: rgba(120, 166, 255, .045);
  display: grid !important;
  gap: 7px !important;
  padding: 8px 6px 8px 10px !important;
  border-left: 2px solid var(--fd-r266-station-accent) !important;
  border-radius: 0 12px 12px 0 !important;
  background: var(--fd-r266-station-tint) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-group--primary {
  --fd-r266-station-accent: var(--fd-r266-station-primary);
  --fd-r266-station-tint: rgba(255, 91, 82, .045);
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-group--favorites {
  --fd-r266-station-accent: var(--fd-r266-station-favorites);
  --fd-r266-station-tint: rgba(233, 180, 76, .045);
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-group--nearby {
  --fd-r266-station-accent: var(--fd-r266-station-nearby);
  --fd-r266-station-tint: rgba(120, 166, 255, .045);
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-group__label {
  color: var(--fd-r266-station-accent) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-station-group > div {
  min-width: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker select {
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

/* R266: keep navigation on a stable composited layer while feature content scrolls. */
html[data-fd-theme] body.fd-feature-open #app > .app-shell > .fuel-tab-bar,
html[data-fd-theme].fd-alert-open body #app > .app-shell > .fuel-tab-bar {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: calc(10px + env(safe-area-inset-bottom)) !important;
  z-index: 2147483001 !important;
  transform: translate3d(-50%, 0, 0) !important;
  contain: layout paint !important;
  isolation: isolate !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  transition: none !important;
  animation: none !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

/* R266: nested pages expose Back only as a compact dock above the main nav. */
html[data-fd-theme] body .fd-feature-page .fd-feature-back-dock {
  position: fixed !important;
  left: 50% !important;
  bottom: calc(88px + env(safe-area-inset-bottom)) !important;
  z-index: 2147483002 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: min(calc(100% - 32px), 448px) !important;
  height: 34px !important;
  box-sizing: border-box !important;
  transform: translate3d(-50%, 0, 0) !important;
  contain: layout paint !important;
  isolation: isolate !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back-dock .fd-feature-back--dock {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  width: auto !important;
  min-width: 0 !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding: 0 11px !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: 11px !important;
  background: var(--fd-r251-control) !important;
  background-image: none !important;
  color: var(--fd-r251-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  box-shadow: 0 7px 18px rgba(0, 0, 0, .25) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: none !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back-dock .fd-feature-back--dock:focus-visible,
html[data-fd-theme] body .fd-feature-page .fd-feature-back-dock .fd-feature-back--dock:hover {
  border-color: var(--fd-r251-red) !important;
  color: var(--fd-r251-text) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r251-red), 0 7px 18px rgba(0, 0, 0, .25) !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back-dock .fd-feature-back--dock svg {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

@media (max-width: 380px) {
  html[data-fd-theme] body .fd-feature-page .fd-feature-back-dock {
    width: calc(100% - 24px) !important;
  }
}

/* R266: keep the interaction layer light while the document remains the only scroll owner. */
html[data-fd-theme] body.fd-feature-open #app > .app-shell > .fuel-tab-bar,
html[data-fd-theme].fd-alert-open body #app > .app-shell > .fuel-tab-bar {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: calc(10px + env(safe-area-inset-bottom)) !important;
  z-index: 2147483001 !important;
  display: flex !important;
  transform: translate3d(-50%, 0, 0) !important;
  will-change: transform !important;
  contain: layout paint style !important;
  isolation: isolate !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: none !important;
  animation: none !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

html[data-fd-theme] body.fd-feature-open #app > .app-shell > .fuel-tab-bar::before,
html[data-fd-theme] body.fd-feature-open #app > .app-shell > .fuel-tab-bar::after,
html[data-fd-theme].fd-alert-open body #app > .app-shell > .fuel-tab-bar::before,
html[data-fd-theme].fd-alert-open body #app > .app-shell > .fuel-tab-bar::after {
  content: none !important;
  display: none !important;
}

/* R266: the selected vehicle is a single compact control, not a second profile header. */
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact {
  display: block !important;
  gap: 0 !important;
  padding: 10px 12px !important;
  border-radius: 15px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-profile-card__selector {
  display: grid !important;
  gap: 5px !important;
  margin: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-profile-card__selector > span {
  color: var(--fd-r251-help) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  letter-spacing: .04em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact .fd-vehicle-profile-card__selector select {
  min-height: 38px !important;
  padding: 7px 34px 7px 10px !important;
  border-radius: 11px !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

/* R266: actions sit quietly beside the fuel type, with no duplicate text buttons. */
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__station {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__fuel-side {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex: 0 0 auto !important;
  gap: 6px !important;
  min-width: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__controls {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__icon-button {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--fd-r251-help) !important;
  line-height: 1 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__icon-button:hover,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__icon-button:focus-visible {
  border-color: var(--fd-r251-red) !important;
  color: var(--fd-r251-text) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r251-red) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__icon-button svg {
  width: 14px !important;
  height: 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__fuel {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 0 9px !important;
  border: 1px solid rgba(255, 59, 48, .45) !important;
  border-radius: 999px !important;
  background: rgba(255, 59, 48, .09) !important;
  color: var(--fd-r251-red) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__station-address {
  display: block !important;
  max-width: min(100%, 250px) !important;
  margin-top: 3px !important;
  overflow: hidden !important;
  color: var(--fd-r251-help) !important;
  font-size: 10px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__receipt-actions {
  display: flex !important;
  gap: 8px !important;
  margin-top: 2px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__receipt-actions .fd-tank-receipt {
  min-height: 32px !important;
  padding: 7px 10px !important;
  border-radius: 10px !important;
  font-size: 11px !important;
}

@media (max-width: 380px) {
  html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__fuel-side {
    gap: 4px !important;
  }

  html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__icon-button {
    flex-basis: 26px !important;
    width: 26px !important;
    min-width: 26px !important;
    height: 26px !important;
    min-height: 26px !important;
    max-height: 26px !important;
  }
}

/* Keep the same low-cost navigation surface on the dashboard as on feature pages. */
html[data-fd-theme] body #app > .app-shell > .fuel-tab-bar {
  will-change: transform !important;
  contain: layout paint style !important;
  isolation: isolate !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: none !important;
  animation: none !important;
  touch-action: manipulation !important;
}

/* R267: nested pages use one quiet corner arrow; the dock is retired. */
html[data-fd-theme] body .fd-feature-page .fd-feature-back-dock {
  display: none !important;
}

html[data-fd-theme] body .fd-feature-page :is(.fd-feature-header, .fd-account-page-header) {
  position: relative !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back--corner {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 36px !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  padding: 0 !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: 50% !important;
  background: var(--fd-r251-control) !important;
  background-image: none !important;
  color: var(--fd-r251-muted) !important;
  line-height: 1 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: none !important;
  touch-action: manipulation !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-header > .fd-feature-back--corner {
  position: absolute !important;
  top: calc(18px + env(safe-area-inset-top)) !important;
  right: 20px !important;
  z-index: 2 !important;
}

html[data-fd-theme] body .fd-feature-page .fd-account-page-header .fd-feature-back--corner {
  position: static !important;
  flex: 0 0 36px !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back--corner:hover,
html[data-fd-theme] body .fd-feature-page .fd-feature-back--corner:focus-visible {
  border-color: var(--fd-r251-red) !important;
  color: var(--fd-r251-text) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r251-red) !important;
}

html[data-fd-theme] body .fd-feature-page .fd-feature-back--corner svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* R267: both Tankbuch actions share one fixed, neutral icon geometry. */
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__fuel-side {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__controls {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__icon-button {
  display: inline-grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--fd-r251-help) !important;
  font: inherit !important;
  line-height: 1 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__icon-button:hover,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__icon-button:focus-visible {
  border-color: var(--fd-r251-red) !important;
  color: var(--fd-r251-text) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r251-red) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__icon-button svg {
  width: 14px !important;
  height: 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* R267: restore compact, non-stretching Preisalarm checkboxes in both themes. */
html[data-fd-theme] body .fd-alert-modal .fd-alert-row > input[type="checkbox"],
html[data-fd-theme] body .fd-alert-modal .fd-alert-station > input[type="checkbox"] {
  flex: 0 0 24px !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  aspect-ratio: 1 / 1 !important;
  align-self: center !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* V270: one bounded Tankbuch interaction layer. */
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-card {
  padding: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure {
  display: block !important;
  min-width: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure > summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-height: 64px !important;
  padding: 14px 16px !important;
  cursor: pointer !important;
  list-style: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure > summary::-webkit-details-marker {
  display: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure > summary > div {
  min-width: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure > summary small {
  display: block !important;
  color: var(--fd-r251-help) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  letter-spacing: .04em !important;
  line-height: 1.1 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure > summary h2 {
  margin: 4px 0 0 !important;
  color: var(--fd-r251-text) !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure > summary > span {
  color: var(--fd-r251-help) !important;
  font-size: 10px !important;
  white-space: nowrap !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure__chevron {
  flex: 0 0 26px !important;
  width: 26px !important;
  height: 26px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: 50% !important;
  color: var(--fd-r251-help) !important;
  box-sizing: border-box !important;
  font-style: normal !important;
  transform: rotate(0deg) !important;
  transition: transform .18s ease !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure__chevron svg {
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  transform: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure[open] > summary .fd-tank-form-disclosure__chevron {
  transform: rotate(180deg) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-form-disclosure__body {
  padding: 0 16px 16px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] button.fd-tank-entry__icon-button:is(.fd-tank-edit, .fd-tank-delete) {
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: 50% !important;
  background: transparent !important;
  background-image: none !important;
  color: var(--fd-r251-help) !important;
  line-height: 1 !important;
  transform: none !important;
  box-shadow: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] button.fd-tank-entry__icon-button:is(.fd-tank-edit, .fd-tank-delete) svg {
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  transform: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__controls {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  min-height: 28px !important;
}

/* Source: /assets/r256-receipts.css */
/* FuelDash R256 — small, private receipt controls for the Tankbuch. */

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-field small,
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-field small {
  display: block;
  margin-top: 8px;
  color: var(--fd-muted) !important;
  font-size: 10px;
  line-height: 1.4;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions,
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 11px;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-delete,
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-delete,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-receipt,
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-receipt {
  margin-top: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-receipt,
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-receipt {
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  padding: 5px 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--fd-accent) !important;
  font-size: 9px;
  cursor: pointer;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-receipt svg,
html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-receipt svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__actions .fd-tank-receipt {
  color: #d23b32 !important;
}

/* V339 — native receipt input covers the visible control so iOS receives the user gesture directly. */
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-native-input {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
  z-index: 2 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-select-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 42px !important;
  padding: 9px 12px !important;
  border: 1px solid var(--fd-border-strong) !important;
  border-radius: 10px !important;
  background: var(--fd-field) !important;
  color: var(--fd-text) !important;
  font: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  position: relative !important;
  overflow: hidden !important;
  cursor: pointer !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-select-button[data-disabled="true"] {
  opacity: .55 !important;
  cursor: default !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-select-button svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-selection {
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) 30px !important;
  gap: 10px !important;
  align-items: center !important;
  margin-top: 10px !important;
  padding: 9px !important;
  border: 1px solid color-mix(in srgb, var(--fd-accent) 55%, var(--fd-border-strong)) !important;
  border-radius: 12px !important;
  background: color-mix(in srgb, var(--fd-accent) 10%, var(--fd-field)) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-existing-receipt, .fd-receipt-removal-status) {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-bottom: 10px !important;
  padding: 10px !important;
  border: 1px solid var(--fd-border-strong) !important;
  border-radius: 12px !important;
  background: var(--fd-field) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-existing-receipt, .fd-receipt-removal-status)[hidden] {
  display: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-existing-receipt > span {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-existing-receipt > span > svg {
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: var(--fd-accent) !important;
  stroke-width: 1.8 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-existing-receipt strong,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-existing-receipt small {
  display: block !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-existing-receipt strong {
  color: var(--fd-text) !important;
  font-size: 11px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-existing-receipt small {
  margin-top: 2px !important;
  color: var(--fd-muted) !important;
  font-size: 9px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-existing-receipt > button, .fd-receipt-removal-status > button) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  flex: 0 0 auto !important;
  min-height: 32px !important;
  padding: 6px 9px !important;
  border: 1px solid color-mix(in srgb, var(--fd-accent) 55%, var(--fd-border-strong)) !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: var(--fd-accent) !important;
  font: inherit !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-existing-receipt > button svg,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-clear-receipt-selection] svg {
  width: 14px !important;
  height: 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-removal-status > span {
  color: var(--fd-text) !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] [data-fd-clear-receipt-selection] {
  display: grid !important;
  place-items: center !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border: 1px solid var(--fd-border-strong) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--fd-muted) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-selection[hidden] {
  display: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-selection img {
  width: 54px !important;
  height: 54px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  background: var(--fd-page-bg) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-selection strong,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-selection small {
  display: block !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-selection strong {
  color: var(--fd-text) !important;
  font-size: 11px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-receipt-selection small {
  margin-top: 3px !important;
  color: var(--fd-muted) !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details {
  margin-top: 4px !important;
  border-top: 1px solid var(--fd-border-strong) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details > summary {
  min-height: 0 !important;
  padding: 4px 0 0 !important;
  color: var(--fd-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  cursor: pointer !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details:not([open]) {
  margin-bottom: -13px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details[open] > .fd-tank-entry__details-body {
  padding-top: 8px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tankbook-result {
  margin: -2px 0 10px !important;
  padding: 10px 12px !important;
  border: 1px solid color-mix(in srgb, var(--fd-accent) 48%, var(--fd-border-strong)) !important;
  border-radius: 12px !important;
  background: color-mix(in srgb, var(--fd-accent) 10%, var(--fd-field)) !important;
  color: var(--fd-text) !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tankbook-result[data-type="warning"] {
  border-color: #c98b31 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details-body > p,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__receipt-detail > p {
  margin: 0 0 10px !important;
  color: var(--fd-muted) !important;
  font-size: 11px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__receipt-detail {
  padding-top: 4px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__receipt-detail > small {
  display: block !important;
  margin-bottom: 7px !important;
  color: var(--fd-muted) !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__receipt-detail .fd-tank-receipt {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--fd-accent) !important;
  font: inherit !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__receipt-detail .fd-tank-receipt svg {
  width: 16px !important;
  height: 16px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
}

html[data-fd-theme] body .fd-receipt-dialog {
  position: fixed !important;
  inset: auto !important;
  top: 50% !important;
  left: 50% !important;
  width: min(560px, calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right))) !important;
  max-width: none !important;
  max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  margin: 0 !important;
  padding: 14px !important;
  box-sizing: border-box !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
  border: 1px solid var(--fd-border-strong) !important;
  border-radius: 18px !important;
  background: var(--fd-page-bg) !important;
  color: var(--fd-text) !important;
  transform: translate(-50%, -50%) !important;
  box-shadow: 0 24px 80px rgb(0 0 0 / .55) !important;
}

html[data-fd-theme] body .fd-receipt-dialog::backdrop {
  background: rgb(0 0 0 / .7) !important;
}

html[data-fd-theme] body .fd-receipt-dialog__head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

html[data-fd-theme] body .fd-receipt-dialog__head small,
html[data-fd-theme] body .fd-receipt-dialog__head strong {
  display: block !important;
}

html[data-fd-theme] body .fd-receipt-dialog__head small {
  color: var(--fd-muted) !important;
  font-size: 9px !important;
  letter-spacing: .08em !important;
}

html[data-fd-theme] body .fd-receipt-dialog__head strong {
  margin-top: 3px !important;
  font-size: 15px !important;
}

html[data-fd-theme] body .fd-receipt-dialog__head button {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 30px !important;
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  padding: 0 !important;
  border: 1px solid var(--fd-border-strong) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--fd-text) !important;
  line-height: 1 !important;
}

html[data-fd-theme] body .fd-receipt-dialog__head button svg {
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
}

html[data-fd-theme] body .fd-receipt-dialog > p {
  margin: 12px 0 !important;
  color: var(--fd-muted) !important;
  font-size: 11px !important;
}

html[data-fd-theme] body .fd-receipt-dialog > img {
  display: block !important;
  width: 100% !important;
  max-height: calc(100dvh - 138px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  object-fit: contain !important;
  border-radius: 10px !important;
  background: #fff !important;
}

/* Source: /assets/r257-statistics.css */
/* FuelDash R257 — compact, independent Tankbuch statistics selectors. */

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 8px !important;
  margin: 0 !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker {
  display: grid !important;
  gap: 5px !important;
  margin: 0 !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker > span:first-child {
  color: var(--fd-r251-muted) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker__control {
  position: relative !important;
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker__control::after {
  position: absolute;
  top: 50%;
  right: 12px;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--fd-r251-muted);
  border-bottom: 1.5px solid var(--fd-r251-muted);
  content: "";
  pointer-events: none;
  transform: translateY(-65%) rotate(45deg);
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker select {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 9px 30px 9px 11px !important;
  border: 1px solid var(--fd-r251-border-strong) !important;
  border-radius: var(--fd-r251-radius-control) !important;
  background: var(--fd-r251-control) !important;
  background-color: var(--fd-r251-control) !important;
  background-image: none !important;
  color: var(--fd-r251-text) !important;
  -webkit-text-fill-color: var(--fd-r251-text) !important;
  font: inherit !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker select:focus {
  border-color: var(--fd-r251-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r251-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-overall-card .fd-statistics-picker--year {
  flex: 0 0 126px !important;
  width: 126px !important;
  min-width: 126px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head {
  gap: 8px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-card {
  gap: 8px !important;
}

@media (max-width: 430px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-overall-card .fd-statistics-picker--year {
    flex-basis: 116px !important;
    width: 116px !important;
    min-width: 116px !important;
  }
}

/* Source: /assets/r258-statistics-alignment.css */
/* FuelDash R258 — aligned Tankbuch statistics headers and selectors. */

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-overall-card .fd-feature-card__head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 176px) !important;
  align-items: start !important;
  column-gap: 10px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head > div:first-child,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-overall-card .fd-feature-card__head > div:first-child {
  justify-self: start !important;
  min-width: 0 !important;
  margin: 0 !important;
  text-align: left !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers {
  justify-self: stretch !important;
  width: 100% !important;
  max-width: 176px !important;
  margin-inline-start: auto !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers--single {
  justify-self: end !important;
  width: 126px !important;
  max-width: 100% !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker {
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  text-align: left !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker > span:first-child {
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  text-align: left !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker--year {
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
}

@media (max-width: 430px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head,
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-overall-card .fd-feature-card__head {
    grid-template-columns: minmax(0, 1fr) minmax(0, 168px) !important;
    column-gap: 8px !important;
  }

  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers {
    max-width: 168px !important;
  }

  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers--single {
    width: 116px !important;
  }
}

/* Source: /assets/r259-statistics-alignment.css */
/* FuelDash R259 — make the annual and monthly selectors share one visible rail. */

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers--single {
  grid-template-columns: minmax(0, 1fr) !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers--single .fd-statistics-picker--year {
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  flex: 0 1 auto !important;
}

@media (max-width: 430px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers--single {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Source: /assets/r260-statistics-alignment.css */
/* FuelDash R260 — align statistics selectors with the two tile columns below. */

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-overall-card .fd-feature-card__head {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  column-gap: 12px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers {
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin-inline-start: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers--single {
  grid-template-columns: minmax(0, 1fr) !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers--single .fd-statistics-picker--year {
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  flex: 0 1 auto !important;
}

@media (max-width: 430px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head,
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-overall-card .fd-feature-card__head {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    column-gap: 12px !important;
  }

  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers,
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-pickers--single {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Source: /assets/r261-statistics-alignment.css */
/* FuelDash R261 — move the statistics picker rail onto the tile edge. */

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-head > .fd-statistics-pickers,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-overall-card .fd-feature-card__head > .fd-statistics-pickers {
  width: calc(100% - 12px) !important;
  justify-self: end !important;
  margin-inline-start: 12px !important;
  margin-inline-end: 0 !important;
}

/* Source: /assets/r277-tankbook-polish.css */
/* FuelDash R277 — align Tankbuch selectors and quiet secondary borders. */

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-card .fd-month-head {
  grid-template-columns: minmax(0, 1fr) !important;
  row-gap: 14px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-card .fd-statistics-pickers {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  justify-self: stretch !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-statistics-picker select,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="tankbook"] button.fd-tank-entry__icon-button:is(.fd-tank-edit, .fd-tank-delete) {
  border-color: var(--fd-r251-border) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details {
  border-top: 0 none !important;
}

/* Source: /assets/r278-tankbook-polish.css */
/* FuelDash R278 — equal vertical breathing room around the Tankbuch Details label. */

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details:not([open]) {
  margin-bottom: -12px !important;
}

/* Source: /assets/r279-tankbook-polish.css */
/* FuelDash R279 — make the visible Details spacing symmetric in every state. */

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details {
  border-top: 0 none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details > summary {
  padding: 4px 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details[open] > .fd-tank-entry__details-body {
  padding-top: 4px !important;
}

/* Source: /assets/r280-layout-polish.css */
/* FuelDash — consolidate the More menu and balance the monthly Tankbuch tiles. */

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-vehicle-profile-card--compact {
  border-radius: 22px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-card .fd-month-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-card .fd-month-grid > article:last-child {
  grid-column: 1 / -1 !important;
  width: calc((100% - 10px) / 2) !important;
  justify-self: center !important;
}

/* Source: /assets/r281-mobile-layout.css */
/* FuelDash V281 — expose the complete Tankbuch end and make the final monthly tile full width. */

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-feature-shell {
  padding-bottom: calc(176px + env(safe-area-inset-bottom)) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-month-card .fd-month-grid > article:last-child {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  justify-self: stretch !important;
}

/* Source: /assets/r282-vehicles-scroll.css */
/* FuelDash V282 — expose the complete „Meine Fahrzeuge“ end like Tankbuch. */

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="vehicles"] .fd-feature-shell {
  padding-bottom: calc(176px + env(safe-area-inset-bottom)) !important;
}

/* Source: /assets/r284-admin-push.css */
/* FuelDash V286 — recipient selection and fixed account chrome. */

html[data-fd-theme="dark"] body .fd-admin-push-card {
  gap: 14px;
}

html[data-fd-theme="dark"] body .fd-admin-push-audience-modes {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid #1e1e1e;
  border-radius: 15px;
  background: #080808;
}

html[data-fd-theme="dark"] body .fd-admin-push-audience-modes legend,
html[data-fd-theme="dark"] body .fd-admin-user-picker > small {
  padding: 0;
  color: #777;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
}

html[data-fd-theme="dark"] body .fd-admin-push-audience-modes label {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  color: #e9e9ed;
  font-size: 13px;
  line-height: 1.35;
}

html[data-fd-theme="dark"] body .fd-admin-push-audience-modes input,
html[data-fd-theme="dark"] body .fd-admin-user-choice input {
  flex: 0 0 auto;
  width: 18px;
  min-width: 18px;
  height: 18px;
  min-height: 18px;
  margin: 0;
  accent-color: #ff3b30;
}

html[data-fd-theme="dark"] body .fd-admin-user-picker {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid #1e1e1e;
  border-radius: 15px;
  background: #080808;
}

html[data-fd-theme="dark"] body .fd-admin-user-picker[hidden] {
  display: none;
}

html[data-fd-theme="dark"] body .fd-admin-user-choices {
  display: grid;
  gap: 7px;
}

html[data-fd-theme="dark"] body .fd-admin-user-choice {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 36px;
  color: #e9e9ed;
  font-size: 13px;
}

html[data-fd-theme="dark"] body .fd-admin-push-form textarea {
  min-height: 96px;
  resize: vertical;
}

html[data-fd-theme="dark"] body .fd-admin-push-form :is(input, textarea):disabled,
html[data-fd-theme="dark"] body .fd-admin-push-audience-modes input:disabled,
html[data-fd-theme="dark"] body .fd-admin-user-choice input:disabled {
  cursor: wait;
  opacity: .62;
}

html[data-fd-theme="dark"] body [data-fd-admin-push-status]:empty {
  display: none;
}

html[data-fd-theme="dark"] body .fd-admin-push-card .fd-auth-form-status[data-type="success"] {
  color: #86efac;
}

html[data-fd-theme="dark"] body .fd-admin-push-card .fd-auth-form-status[data-type="error"] {
  color: #ff8d86;
}

/* FuelDash V325 — admin delivery status follows the compact green price-alert feedback. */
html[data-fd-theme="dark"] body .fd-admin-push-status {
  box-sizing: border-box;
  display: grid;
  gap: 10px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid rgba(48, 209, 88, .28);
  border-radius: 16px;
  background: rgba(48, 209, 88, .10);
  color: #30d158;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
}

html[data-fd-theme="dark"] body .fd-admin-push-status[aria-live="polite"]:empty {
  display: none;
}

html[data-fd-theme="dark"] body .fd-admin-push-status[data-type="success"] {
  border-color: rgba(48, 209, 88, .28);
  background: rgba(48, 209, 88, .10);
  color: #30d158;
}

html[data-fd-theme="dark"] body .fd-admin-push-status[data-type="error"] {
  border-color: rgba(255, 69, 58, .30);
  background: rgba(255, 69, 58, .09);
  color: #ff8d86;
}

html[data-fd-theme="dark"] body .fd-admin-push-status__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

html[data-fd-theme="dark"] body .fd-admin-push-status__head strong {
  min-width: 0;
  color: currentColor;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.25;
}

html[data-fd-theme="dark"] body .fd-admin-push-status__head span {
  flex: 0 0 auto;
  color: currentColor;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.2;
  opacity: .78;
}

html[data-fd-theme="dark"] body .fd-admin-push-status__metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

html[data-fd-theme="dark"] body .fd-admin-push-status__metric {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid rgba(48, 209, 88, .18);
  border-radius: 11px;
  background: rgba(8, 8, 8, .20);
}

html[data-fd-theme="dark"] body .fd-admin-push-status__metric b {
  color: currentColor;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
}

html[data-fd-theme="dark"] body .fd-admin-push-status__metric small {
  overflow: hidden;
  color: currentColor;
  font-size: 10px;
  font-weight: 400;
  line-height: 1.25;
  opacity: .76;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-fd-theme="dark"] body .fd-admin-push-status p {
  margin: 0;
  color: currentColor;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.45;
  opacity: .82;
}

html[data-fd-theme="light"] body .fd-admin-push-status {
  border-color: rgba(28, 150, 61, .24);
  background: rgba(48, 209, 88, .10);
  color: #1c963d;
}

html[data-fd-theme="light"] body .fd-admin-push-status[data-type="error"] {
  border-color: rgba(210, 48, 40, .24);
  background: rgba(255, 69, 58, .09);
  color: #b52b25;
}

/* The account header and title stay outside the inner scroller. */
html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] {
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell {
  display: flex !important;
  flex-direction: column !important;
  width: min(100%, 720px) !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-header,
html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-account-page-title {
  position: relative !important;
  top: auto !important;
  flex: 0 0 auto !important;
  z-index: 2 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
  padding-bottom: calc(176px + env(safe-area-inset-bottom)) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"]::before,
html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"]::after,
html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell::before,
html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell::after,
html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-content::before,
html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-content::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

/* Source: /assets/r289-account-admin.css */
/* FuelDash V298 — account follows the normal page flow without a black overlay. */

html[data-fd-theme] body.fd-account-route-open {
  overflow: hidden !important;
  background: transparent !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  display: block !important;
  width: 100% !important;
  height: 100dvh !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  background: transparent !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell {
  display: block !important;
  width: min(100%, 720px) !important;
  min-height: 100dvh !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-account-page-title {
  position: relative !important;
  z-index: auto !important;
  margin: 0 !important;
  padding: calc(22px + env(safe-area-inset-top)) 20px 12px !important;
  background: transparent !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-account-page-title h1 {
  margin: 0 !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 16px calc(72px + env(safe-area-inset-bottom)) !important;
  background: transparent !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] :is(.fd-feature-shell, .fd-feature-content, .fd-account-page)::before,
html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] :is(.fd-feature-shell, .fd-feature-content, .fd-account-page)::after {
  content: none !important;
  display: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-account-page {
  gap: 18px !important;
}

html[data-fd-theme] body.fd-account-route-open :is(.fd-account-page-status, .fd-account-page-card) {
  padding: 20px !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-admin-push-card {
  display: grid !important;
  gap: 16px !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-admin-push-form {
  display: grid !important;
  gap: 14px !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-admin-push-audience-modes,
html[data-fd-theme] body.fd-account-route-open .fd-admin-user-picker {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 16px !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-admin-user-choices {
  display: grid !important;
  gap: 6px !important;
}

html[data-fd-theme] body.fd-account-route-open :is(.fd-admin-push-audience-modes label, .fd-admin-user-choice) {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 2px !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}

html[data-fd-theme] body.fd-account-route-open :is(.fd-admin-push-audience-modes input[type="radio"], .fd-admin-user-choice input[type="checkbox"]) {
  box-sizing: border-box !important;
  flex: 0 0 22px !important;
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1.5px solid #6d6d75 !important;
  border-radius: 50% !important;
  outline: 0 !important;
  background: #0a0a0b !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}

html[data-fd-theme] body.fd-account-route-open :is(.fd-admin-push-audience-modes input[type="radio"], .fd-admin-user-choice input[type="checkbox"])::after {
  display: block !important;
  content: "" !important;
  opacity: 0 !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-admin-push-audience-modes input[type="radio"]:checked,
html[data-fd-theme] body.fd-account-route-open .fd-admin-user-choice input[type="checkbox"]:checked {
  border-color: #ff5a52 !important;
  background: #ff5a52 !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-admin-push-audience-modes input[type="radio"]::after {
  width: 8px !important;
  height: 8px !important;
  margin: 5px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-admin-user-choice input[type="checkbox"]::after {
  width: 6px !important;
  height: 10px !important;
  margin: 3px 0 0 7px !important;
  border: solid #ffffff !important;
  border-width: 0 2px 2px 0 !important;
  transform: rotate(45deg) !important;
}

html[data-fd-theme] body.fd-account-route-open :is(.fd-admin-push-audience-modes input[type="radio"]:checked, .fd-admin-user-choice input[type="checkbox"]:checked)::after {
  opacity: 1 !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-admin-push-form .fd-field {
  display: grid !important;
  gap: 8px !important;
}

/* Beat the historical account rules without restoring their private scroller. */
html[data-fd-theme] body:not(#fd-v293-account-scope).fd-account-route-open .fd-feature-page[data-fd-feature-view="account"],
html[data-fd-theme] body:not(#fd-v293-account-scope).fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell,
html[data-fd-theme] body:not(#fd-v293-account-scope).fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* Source: /assets/r292-push-attention.css */
/* FuelDash V298 — compact yellow push warning surfaces. */

html[data-fd-theme] body #app > .app-shell > .app-content > .fd-push-attention-card {
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: start !important;
  margin: 10px 16px 26px !important;
  padding: 11px 12px !important;
  border: 1px solid #e0ad2f !important;
  border-radius: 15px !important;
  background: #17150b !important;
  color: #fff3c4 !important;
  box-shadow: none !important;
}

html[data-fd-theme] body .fd-push-attention-card__icon {
  display: grid !important;
  place-items: center !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  background: #e0ad2f !important;
  color: #17150b !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

html[data-fd-theme] body .fd-push-attention-card__body {
  min-width: 0 !important;
}

html[data-fd-theme] body .fd-push-attention-card__body small,
html[data-fd-theme] body .fd-push-attention-dialog small {
  display: block !important;
  color: #e0ad2f !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  line-height: 1.25 !important;
}

html[data-fd-theme] body .fd-push-attention-card h2,
html[data-fd-theme] body .fd-push-attention-dialog h2 {
  margin: 2px 0 3px !important;
  color: #fff3c4 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body .fd-push-attention-card p,
html[data-fd-theme] body .fd-push-attention-dialog p {
  margin: 0 !important;
  color: #f0dfaa !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

html[data-fd-theme] body .fd-push-attention-dialog {
  position: fixed !important;
  right: 14px !important;
  bottom: calc(14px + env(safe-area-inset-bottom)) !important;
  left: 14px !important;
  z-index: 2147483400 !important;
  display: grid !important;
  gap: 12px !important;
  width: auto !important;
  max-width: 520px !important;
  margin: 0 auto !important;
  padding: 16px !important;
  border: 1px solid rgba(224, 173, 47, .65) !important;
  border-radius: 19px !important;
  background: #111112 !important;
  color: #f5f5f7 !important;
  box-shadow: 0 16px 45px rgba(0, 0, 0, .5) !important;
  pointer-events: auto !important;
}

html[data-fd-theme] body .fd-push-attention-dialog__actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

html[data-fd-theme] body .fd-push-attention-dialog__actions button {
  min-height: 38px !important;
  touch-action: manipulation !important;
}

@media (min-width: 560px) {
  html[data-fd-theme] body #app > .app-shell > .app-content > .fd-push-attention-card {
    grid-template-columns: 28px minmax(0, 1fr) !important;
  }
}

/* Source: /assets/r294-admin-account.css */
/* FuelDash V298 — one account scroller and transparent document background. */

html[data-fd-theme] body.fd-account-route-open {
  overflow: hidden !important;
  background: transparent !important;
}

html[data-fd-theme] body.fd-account-route-open #app {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483001 !important;
  display: block !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  -webkit-overflow-scrolling: touch !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell {
  display: block !important;
  width: min(100%, 720px) !important;
  height: auto !important;
  min-height: 100dvh !important;
  max-height: none !important;
  margin: 0 auto !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 16px calc(16px + env(safe-area-inset-bottom)) !important;
  box-sizing: border-box !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] :is(.fd-feature-page, .fd-feature-shell, .fd-feature-content, .fd-account-page)::before,
html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] :is(.fd-feature-page, .fd-feature-shell, .fd-feature-content, .fd-account-page)::after {
  display: none !important;
  content: none !important;
  background: none !important;
  box-shadow: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-admin-card {
  display: grid !important;
  gap: 14px !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-form {
  display: grid !important;
  gap: 12px !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-form .fd-field {
  display: grid !important;
  gap: 7px !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-form textarea {
  min-height: 104px !important;
  resize: vertical !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-toggle {
  position: relative !important;
  z-index: 5 !important;
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 42px !important;
  color: #e9e9ed !important;
  font-size: 13px !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-toggle input {
  position: absolute !important;
  z-index: -1 !important;
  width: 1px !important;
  min-width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  opacity: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  pointer-events: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-toggle__box {
  display: block !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 20px !important;
  height: 20px !important;
  box-sizing: border-box !important;
  border: 1.5px solid #6d6d75 !important;
  border-radius: 6px !important;
  background: #0a0a0b !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-toggle__box::after {
  display: block !important;
  width: 6px !important;
  height: 10px !important;
  margin: 2px 0 0 6px !important;
  border: solid #ffffff !important;
  border-width: 0 2px 2px 0 !important;
  content: "" !important;
  opacity: 0 !important;
  transform: rotate(45deg) !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-toggle input:checked + .fd-push-notice-toggle__box {
  border-color: #ff5a52 !important;
  background: #ff5a52 !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-toggle input:checked + .fd-push-notice-toggle__box::after {
  opacity: 1 !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-toggle input:focus-visible + .fd-push-notice-toggle__box {
  outline: 2px solid rgba(255, 90, 82, .8) !important;
  outline-offset: 3px !important;
}

html[data-fd-theme] body.fd-account-route-open [data-fd-push-notice-status]:empty {
  display: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-admin-card .fd-auth-form-status[data-type="success"] {
  color: #86efac !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-push-notice-admin-card .fd-auth-form-status[data-type="error"] {
  color: #ff8d86 !important;
}

/* V305: the account route owns the normal document flow; the Dashboard and
   its navigation must not remain visible behind the profile. */
html[data-fd-theme] body.fd-account-route-open {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100dvh !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: auto !important;
  background: #000000 !important;
  background-color: #000000 !important;
}

html[data-fd-theme] body.fd-account-route-open #app,
html[data-fd-theme] body.fd-account-route-open #app > .app-shell,
html[data-fd-theme] body.fd-account-route-open #app > .app-shell > .fuel-tab-bar {
  display: none !important;
  pointer-events: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] {
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100dvh !important;
  max-height: none !important;
  overflow: visible !important;
  overscroll-behavior-y: auto !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-shell {
  display: block !important;
  width: min(100%, 720px) !important;
  height: auto !important;
  min-height: 100dvh !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 0 calc(34px + env(safe-area-inset-bottom)) !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme] body.fd-account-route-open .fd-feature-page[data-fd-feature-view="account"] .fd-feature-content {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  box-sizing: border-box !important;
  padding: 0 16px calc(34px + env(safe-area-inset-bottom)) !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* The account route no longer contains the redundant Push-status tile. */
html[data-fd-theme] body.fd-account-route-open [data-fd-push-settings-card],
html[data-fd-theme] body.fd-account-route-open [data-fd-feature-view="account"] [data-fd-push-attention-card] {
  display: none !important;
}

/* Keep the warning glyph itself; remove the historical yellow circle. */
html[data-fd-theme] body .fd-push-attention-card__icon {
  background: transparent !important;
  border-radius: 0 !important;
  color: #e0ad2f !important;
}

html[data-fd-theme] body #app > .app-shell > .app-content > .fd-public-push-notice {
  margin-bottom: 14px !important;
}

html[data-fd-theme] body #app > .app-shell > .app-content > .fd-price-alert-notice {
  margin-top: 0 !important;
  margin-bottom: 24px !important;
}

html[data-fd-theme] body .fd-price-alert-notice__action {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 2px 0 0 !important;
  padding: 0 14px !important;
  border: 1px solid #e0ad2f !important;
  border-radius: 12px !important;
  background: #e0ad2f !important;
  color: #17150b !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  touch-action: manipulation !important;
}

html[data-fd-theme] body .fd-price-alert-notice__action:focus-visible {
  outline: 2px solid #ffffff !important;
  outline-offset: 2px !important;
}

/* Source: /assets/r340-admin-run-stats.css */
html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-stats {
  border-color: rgba(255, 255, 255, 0.14);
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-overview,
html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-deliveries-details {
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.025);
}

.fd-admin-run-overview {
  display: grid;
  gap: 8px;
  margin-top: 16px;
  padding: 14px 16px;
}

.fd-admin-run-filters {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 14px;
}

.fd-admin-run-filter {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.fd-admin-run-filter > span {
  color: rgba(255, 255, 255, .62);
  font-size: .72rem;
  font-weight: 650;
}

.fd-admin-run-filter select {
  width: 100%;
  min-height: 40px;
  padding: 8px 10px;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 11px;
  background: rgba(255, 255, 255, .04);
  color: #fff;
  font: inherit;
  font-size: .8rem;
}

.fd-admin-run-filter select:focus-visible {
  outline: 2px solid rgba(255, 59, 48, .72);
  outline-offset: 2px;
}

.fd-admin-run-overview__line {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  font-size: 0.86rem;
}

.fd-admin-run-overview__line span,
.fd-admin-run-overview__line time {
  color: rgba(255, 255, 255, 0.68);
}

.fd-admin-run-overview__line time {
  text-align: right;
}

.fd-admin-run-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.fd-admin-run-metric {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 11px 12px;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.045);
}

.fd-admin-run-metric b {
  color: #fff;
  font-size: 1.05rem;
}

.fd-admin-run-metric small {
  overflow: hidden;
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.7rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fd-admin-run-deliveries-details {
  margin-top: 14px;
  padding: 0 14px;
}

.fd-admin-run-deliveries-details > summary {
  cursor: pointer;
  padding: 14px 0;
  color: rgba(255, 255, 255, 0.9);
  font-weight: 650;
}

.fd-admin-run-deliveries {
  display: grid;
  gap: 8px;
  padding: 0 0 14px;
}

.fd-admin-run-delivery {
  display: grid;
  gap: 7px;
  padding: 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
}

.fd-admin-run-delivery__head,
.fd-admin-run-delivery__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
}

.fd-admin-run-delivery__head strong {
  color: #fff;
}

.fd-admin-run-delivery__head span,
.fd-admin-run-delivery small,
.fd-admin-run-delivery time,
.fd-admin-run-delivery__meta {
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.75rem;
}

.fd-admin-run-delivery--accepted .fd-admin-run-delivery__head span {
  color: #7ee2a8;
}

.fd-admin-run-delivery--failed .fd-admin-run-delivery__head span {
  color: #ff8c8c;
}

.fd-admin-run-delivery--skipped .fd-admin-run-delivery__head span {
  color: #f2c979;
}

.fd-admin-run-delivery time {
  text-align: right;
}

.fd-admin-run-refresh {
  margin-top: 14px;
}

@media (max-width: 520px) {
  .fd-admin-run-filters {
    grid-template-columns: 1fr;
  }

  .fd-admin-run-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .fd-admin-run-overview__line {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
  }

  .fd-admin-run-overview__line time {
    text-align: left;
  }
}

/* Source: /assets/r302-price-alert-bell.css */
/* FuelDash V305 — explicit bell state colors, shared profile geometry, and menu alignment. */

/* The bell and profile are one shared 38px control, including flex basis. */
html body #app .brand-header :is(.fd-profile-button, .fd-price-alert-bell) {
  box-sizing: border-box !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  border-radius: 50% !important;
}

html body #app .brand-header :is(.fd-profile-button, .fd-price-alert-bell) svg {
  display: block !important;
  width: 19px !important;
  height: 19px !important;
  margin: 0 !important;
}

html body #app .brand-header .fd-price-alert-bell {
  box-sizing: border-box !important;
  display: inline-grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: 1fr !important;
  grid-template-areas: "icon" !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  outline: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  -webkit-tap-highlight-color: transparent !important;
  transition: color .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease !important;
}

html body #app .brand-header .fd-price-alert-bell svg {
  display: block !important;
  grid-area: icon !important;
  align-self: center !important;
  justify-self: center !important;
  width: 19px !important;
  height: 19px !important;
  margin: 0 !important;
  transform: none !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html body #app .brand-header .fd-price-alert-bell[data-fd-price-alert-bell-state="active"],
html body #app .brand-header .fd-price-alert-bell.fd-price-alert-bell--active {
  border: 1px solid rgba(48, 209, 88, .78) !important;
  background-color: rgba(48, 209, 88, .16) !important;
  background-image: none !important;
  color: #30d158 !important;
  box-shadow: inset 0 1px rgba(196, 255, 210, .18), 0 0 0 1px rgba(48, 209, 88, .12) !important;
}

html body #app .brand-header .fd-price-alert-bell[data-fd-price-alert-bell-state="pending"],
html body #app .brand-header .fd-price-alert-bell.fd-price-alert-bell--pending {
  border: 1px solid rgba(255, 214, 10, .88) !important;
  background-color: rgba(255, 214, 10, .16) !important;
  background-image: none !important;
  color: #ffd60a !important;
  box-shadow: inset 0 1px rgba(255, 247, 190, .20), 0 0 0 1px rgba(255, 214, 10, .14) !important;
}

html body #app .brand-header .fd-price-alert-bell[data-fd-price-alert-bell-state="inactive"],
html body #app .brand-header .fd-price-alert-bell.fd-price-alert-bell--inactive {
  border: 1px solid rgba(255, 69, 58, .82) !important;
  background-color: rgba(255, 69, 58, .15) !important;
  background-image: none !important;
  color: #ff453a !important;
  box-shadow: inset 0 1px rgba(255, 205, 200, .12), 0 0 0 1px rgba(255, 69, 58, .12) !important;
}

/*
 * V305 cascade seal:
 * r162-app.css contains a later-era global rule with two ID selectors
 * (body:not(#fd-r148-core-scope) #app .round-button) and !important.
 * These state rules intentionally match that scope and add the bell's
 * state selectors, so the status color cannot be flattened to neutral.
 */
html[data-fd-theme] body:not(#fd-r148-core-scope) #app .brand-header .fd-price-alert-bell[data-fd-price-alert-bell-state="active"],
html[data-fd-theme] body:not(#fd-r148-core-scope) #app .brand-header .fd-price-alert-bell.fd-price-alert-bell--active {
  border: 1px solid rgba(48, 209, 88, .78) !important;
  background-color: rgba(48, 209, 88, .16) !important;
  background-image: none !important;
  color: #30d158 !important;
  box-shadow: inset 0 1px rgba(196, 255, 210, .18), 0 0 0 1px rgba(48, 209, 88, .12) !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) #app .brand-header .fd-price-alert-bell[data-fd-price-alert-bell-state="pending"],
html[data-fd-theme] body:not(#fd-r148-core-scope) #app .brand-header .fd-price-alert-bell.fd-price-alert-bell--pending {
  border: 1px solid rgba(255, 214, 10, .88) !important;
  background-color: rgba(255, 214, 10, .16) !important;
  background-image: none !important;
  color: #ffd60a !important;
  box-shadow: inset 0 1px rgba(255, 247, 190, .20), 0 0 0 1px rgba(255, 214, 10, .14) !important;
}

html[data-fd-theme] body:not(#fd-r148-core-scope) #app .brand-header .fd-price-alert-bell[data-fd-price-alert-bell-state="inactive"],
html[data-fd-theme] body:not(#fd-r148-core-scope) #app .brand-header .fd-price-alert-bell.fd-price-alert-bell--inactive {
  border: 1px solid rgba(255, 69, 58, .82) !important;
  background-color: rgba(255, 69, 58, .15) !important;
  background-image: none !important;
  color: #ff453a !important;
  box-shadow: inset 0 1px rgba(255, 205, 200, .12), 0 0 0 1px rgba(255, 69, 58, .12) !important;
}

html body #app .brand-header .fd-price-alert-bell:is(:focus, :focus-visible, :active) {
  outline: none !important;
  filter: none !important;
  opacity: 1 !important;
}

html[data-fd-theme="light"] body #app .brand-header .fd-price-alert-bell[data-fd-price-alert-bell-state="active"],
html[data-fd-theme="light"] body #app .brand-header .fd-price-alert-bell.fd-price-alert-bell--active {
  border-color: rgba(28, 150, 61, .66) !important;
  background-color: rgba(48, 209, 88, .14) !important;
  color: #1c963d !important;
}

html[data-fd-theme="light"] body #app .brand-header .fd-price-alert-bell[data-fd-price-alert-bell-state="pending"],
html[data-fd-theme="light"] body #app .brand-header .fd-price-alert-bell.fd-price-alert-bell--pending {
  border-color: rgba(180, 145, 0, .72) !important;
  background-color: rgba(255, 214, 10, .16) !important;
  color: #a98200 !important;
}

html[data-fd-theme="light"] body #app .brand-header .fd-price-alert-bell[data-fd-price-alert-bell-state="inactive"],
html[data-fd-theme="light"] body #app .brand-header .fd-price-alert-bell.fd-price-alert-bell--inactive {
  border-color: rgba(210, 48, 40, .66) !important;
  background-color: rgba(255, 69, 58, .13) !important;
  color: #d22f28 !important;
}

html body #app .menu-card button[data-fd-price-alerts] {
  align-items: center !important;
  line-height: 1.2 !important;
}

html body #app .menu-card button[data-fd-price-alerts] em {
  display: block !important;
  align-self: center !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  transform: none !important;
  position: static !important;
}

/* Source: /assets/r308-form-inputs.css */
/* FuelDash V315 — clear buttons exactly matching the global search control. */

html[data-fd-theme] body .fd-clearable-host {
  position: relative !important;
}

html[data-fd-theme] body .fd-clearable-host > :is(input, textarea) {
  padding-right: 44px !important;
}

html[data-fd-theme] body .fd-clearable-host.fd-field-affix > input {
  padding-right: 66px !important;
}

html[data-fd-theme] body .fd-clearable-host > .fd-clear-button {
  position: absolute !important;
  z-index: 3 !important;
  top: var(--fd-clear-button-center, 50%) !important;
  right: 8px !important;
  display: grid !important;
  width: 21px !important;
  height: 21px !important;
  min-width: 21px !important;
  min-height: 21px !important;
  margin: 0 !important;
  padding: 0 0 2px !important;
  transform: translateY(-50%) !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, .045) !important;
  color: #b5b5bb !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  place-items: center !important;
  cursor: pointer !important;
}

/* Keep the visual treatment identical to the search X, including when legacy
   search rules later in the cascade try to make the control transparent. */
html[data-fd-theme] body :is(#app .search-field .search-field-action, .fd-clearable-host > .fd-clear-button) {
  border: 1px solid rgba(255, 255, 255, .14) !important;
  background: rgba(255, 255, 255, .045) !important;
  color: #b5b5bb !important;
  font-size: 15px !important;
  font-weight: 500 !important;
}

html[data-fd-theme] body .fd-clearable-host.fd-field-affix > .fd-clear-button {
  right: 33px !important;
}

html[data-fd-theme] body .fd-clearable-host > .fd-clear-button[hidden] {
  display: none !important;
}

html[data-fd-theme] body #app .search-field-action[hidden] {
  display: none !important;
}

html[data-fd-theme] body .fd-clearable-host > .fd-clear-button:active {
  transform: translateY(-50%) scale(.94) !important;
}

html[data-fd-theme="light"] body .fd-clearable-host > .fd-clear-button {
  border-color: rgba(35, 35, 40, .14) !important;
  background: rgba(35, 35, 40, .05) !important;
  color: #595960 !important;
}

html[data-fd-theme="light"] body #app .search-field .search-field-action {
  border-color: rgba(35, 35, 40, .14) !important;
  background: rgba(35, 35, 40, .05) !important;
  color: #595960 !important;
}

/* Source: /assets/r314-startup-skeleton.css */
/* FuelDash V325 — stable startup navigation geometry and dark neutral Skeleton palette. */

:root {
  --fd-v315-nav-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  --fd-v315-nav-width: min(calc(100% - 32px), 448px);
  --fd-v315-nav-height: 72px;
  --fd-v315-nav-padding: 8px 14px;
  --fd-v315-nav-radius: 29px;
  --fd-v315-nav-surface: #111111;
  --fd-v315-skeleton-base: #242424;
  --fd-v315-skeleton-highlight: #303030;
  --fd-v315-skeleton-surface: #111111;
  --fd-v315-skeleton-border: #242424;
}

/* The first frame and the ready app use one viewport-anchored navigation geometry. */
html body #app .fuel-tab-bar,
html body .fd-startup-cover .fd-fast-nav {
  position: fixed !important;
  top: auto !important;
  right: auto !important;
  left: 50% !important;
  bottom: var(--fd-v315-nav-bottom) !important;
  width: var(--fd-v315-nav-width) !important;
  height: var(--fd-v315-nav-height) !important;
  min-height: var(--fd-v315-nav-height) !important;
  max-height: var(--fd-v315-nav-height) !important;
  padding: var(--fd-v315-nav-padding) !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  border-radius: var(--fd-v315-nav-radius) !important;
  transform: translate3d(-50%, 0, 0) !important;
  transition: none !important;
  animation: none !important;
}

html body .fd-startup-cover .fd-fast-nav {
  z-index: 20 !important;
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  align-items: center !important;
  gap: 7px !important;
  border: 1px solid #2b2b2b !important;
  background: var(--fd-v315-nav-surface) !important;
  background-color: var(--fd-v315-nav-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .fd-startup-cover .fd-fast-nav > span {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  min-width: 0 !important;
  min-height: 46px !important;
  padding: 5px 6px !important;
  overflow: hidden !important;
  border-radius: 19px !important;
  color: transparent !important;
  background: transparent !important;
}

html body .fd-startup-cover .fd-fast-nav > span > svg,
html body .fd-startup-cover .fd-fast-nav > span > span {
  opacity: 0 !important;
}

html body .fd-startup-cover .fd-fast-nav > span::before {
  position: absolute !important;
  inset: 8px 6px !important;
  display: block !important;
  content: "" !important;
  border-radius: 13px !important;
  background: linear-gradient(100deg, var(--fd-v315-skeleton-base) 22%, var(--fd-v315-skeleton-highlight) 46%, var(--fd-v315-skeleton-base) 70%) !important;
  will-change: transform !important;
  animation: fd-startup-shimmer 1.35s cubic-bezier(.4, 0, .2, 1) infinite !important;
}

html body .fd-startup-cover .fd-fast-nav > span:nth-child(2)::before { animation-delay: .11s !important; }
html body .fd-startup-cover .fd-fast-nav > span:nth-child(3)::before { animation-delay: .22s !important; }
html body .fd-startup-cover .fd-fast-nav > span:nth-child(4)::before { animation-delay: .33s !important; }

/* Use one dark neutral grey family for every startup placeholder. */
html body .fd-startup-cover .fd-fast-card {
  border-color: var(--fd-v315-skeleton-border) !important;
  background: var(--fd-v315-skeleton-surface) !important;
  background-color: var(--fd-v315-skeleton-surface) !important;
  background-image: none !important;
}

html body .fd-startup-cover :is(.fd-fast-kicker, .fd-fast-title, .fd-fast-line),
html body .fd-startup-cover .fd-fast-nav > span::before {
  background: var(--fd-v315-skeleton-base) !important;
  background-color: var(--fd-v315-skeleton-base) !important;
  background-image: linear-gradient(100deg, var(--fd-v315-skeleton-base) 22%, var(--fd-v315-skeleton-highlight) 46%, var(--fd-v315-skeleton-base) 70%) !important;
}

html body .fd-startup-cover :is(.fd-fast-kicker, .fd-fast-title, .fd-fast-line)::after {
  background: linear-gradient(100deg, transparent 18%, var(--fd-v315-skeleton-highlight) 50%, transparent 82%) !important;
}

html body .fd-startup-cover .fd-fast-card::after {
  background: linear-gradient(105deg, transparent 24%, #171717 43%, #1d1d1d 50%, #171717 57%, transparent 76%) !important;
}

/* Keep the card surface neutral even when older startup layers are cached. */
html body .fd-startup-cover .fd-fast-card {
  background-image: none !important;
}

/* The live bell must be the same physical control as the profile button. */
html body #app .brand-header .header-actions > :is(.fd-profile-button, .fd-price-alert-bell) {
  box-sizing: border-box !important;
  display: inline-grid !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  inline-size: 38px !important;
  block-size: 38px !important;
  aspect-ratio: 1 / 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  border-radius: 50% !important;
}

html body #app .brand-header .header-actions > :is(.fd-profile-button, .fd-price-alert-bell) svg {
  display: block !important;
  width: 19px !important;
  height: 19px !important;
  inline-size: 19px !important;
  block-size: 19px !important;
  margin: 0 !important;
}

/* Keep the two header controls visible in the first skeleton frame. They use
   the same neutral surface as the ready header and the startup navigation. */
html body .fd-startup-cover .fd-fast-header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 84px !important;
  margin-left: auto !important;
}

html body .fd-startup-cover .fd-fast-header-actions :is(.fd-fast-profile-placeholder, .fd-fast-price-alert-bell-placeholder) {
  position: relative !important;
  box-sizing: border-box !important;
  display: grid !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  place-items: center !important;
  overflow: hidden !important;
  border: 1px solid var(--fd-v315-skeleton-border) !important;
  border-radius: 50% !important;
  background: var(--fd-v315-nav-surface) !important;
  color: #4d4d52 !important;
  pointer-events: none !important;
}

html body .fd-startup-cover .fd-fast-header-actions :is(.fd-fast-profile-placeholder, .fd-fast-price-alert-bell-placeholder) svg {
  display: block !important;
  width: 19px !important;
  height: 19px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

@media (max-width: 380px) {
  html body #app .fuel-tab-bar,
  html body .fd-startup-cover .fd-fast-nav {
    --fd-v315-nav-width: calc(100% - 24px);
    padding-inline: 9px !important;
    gap: 4px !important;
  }
}

@media (orientation: landscape) and (max-height: 520px) {
  html body #app .fuel-tab-bar,
  html body .fd-startup-cover .fd-fast-nav {
    --fd-v315-nav-bottom: calc(6px + env(safe-area-inset-bottom, 0px));
    --fd-v315-nav-height: 62px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .fd-startup-cover .fd-fast-nav > span::before {
    animation-duration: 2.4s !important;
    animation-iteration-count: infinite !important;
  }
}

/* Source: /assets/r316-recommendation-typography.css */
/* FuelDash V316 — quiet, muted typography for the recommendation origin line. */
html body #app .primary-station-card__insights > div:first-child > small.tank-recommendation-source {
  display: block !important;
  margin: 3px 0 0 !important;
  color: var(--fd-muted) !important;
  font-family: inherit !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.35 !important;
  text-transform: none !important;
  white-space: normal !important;
}

html[data-fd-theme="light"] body #app .primary-station-card__insights > div:first-child > small.tank-recommendation-source {
  color: var(--fd-r90-light-muted) !important;
}

/* Source: /assets/r317-ui-consistency.css */
/* FuelDash V317 — equal recommendation info text and shared startup surfaces. */

:root {
  /* These resolve to the same surfaces used by the live dashboard and nav. */
  --fd-v317-card-surface: var(--fd-surface, #0a0a0c);
  --fd-v317-nav-surface: var(--fd-nav-bg, #050506);
  --fd-v317-card-border: var(--fd-border, #26262b);
  --fd-v317-nav-border: var(--fd-nav-border, #202024);
}

/* The origin and explanation are both quiet information, not competing labels. */
html body #app .primary-station-card__insights > div:first-child > small.tank-recommendation-source,
html body #app .primary-station-card__insights > div:first-child > span {
  display: block !important;
  margin: 6px 0 0 !important;
  color: var(--fd-muted, #a1a1a8) !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
  text-transform: none !important;
  white-space: normal !important;
}

/* Startup cards use the dashboard card surface, and startup nav uses the live nav surface. */
html body .fd-startup-cover .fd-fast-card {
  border-color: var(--fd-v317-card-border) !important;
  background: var(--fd-v317-card-surface) !important;
  background-color: var(--fd-v317-card-surface) !important;
  background-image: none !important;
}

html body .fd-startup-cover .fd-fast-nav {
  border-color: var(--fd-v317-nav-border) !important;
  background: var(--fd-v317-nav-surface) !important;
  background-color: var(--fd-v317-nav-surface) !important;
  background-image: none !important;
}

/* Keep the shimmer neutral and rooted in the same dark surfaces. */
html body .fd-startup-cover :is(.fd-fast-kicker, .fd-fast-title, .fd-fast-line) {
  background-color: var(--fd-v317-card-surface) !important;
  background-image: linear-gradient(100deg, rgba(255,255,255,.035) 22%, rgba(255,255,255,.08) 46%, rgba(255,255,255,.035) 70%) !important;
  background-size: 220% 100% !important;
}

html body .fd-startup-cover :is(.fd-fast-kicker, .fd-fast-title, .fd-fast-line)::after {
  background: linear-gradient(100deg, transparent 18%, rgba(255,255,255,.08) 50%, transparent 82%) !important;
}

html body .fd-startup-cover .fd-fast-line.is-price {
  opacity: 1 !important;
}

html body .fd-startup-cover .fd-fast-nav > span::before {
  background-color: var(--fd-v317-nav-surface) !important;
  background-image: linear-gradient(100deg, rgba(255,255,255,.03) 22%, rgba(255,255,255,.075) 46%, rgba(255,255,255,.03) 70%) !important;
}

html[data-fd-theme="light"] body #app .primary-station-card__insights > div:first-child > small.tank-recommendation-source,
html[data-fd-theme="light"] body #app .primary-station-card__insights > div:first-child > span {
  color: var(--fd-r90-light-muted, #6f6f77) !important;
}

/* Source: /assets/r318-fuel-calculator.css */
/* FuelDash V325 — quiet manual fuel calculator in the Tankbuch OLED hierarchy. */

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] {
  --fd-fuel-gap: 14px;
  --fd-fuel-card: #0c0c0c;
  --fd-fuel-control: #080808;
  --fd-fuel-border: #1e1e1e;
  --fd-fuel-border-strong: #2a2a2e;
  --fd-fuel-text: #f5f5f7;
  --fd-fuel-muted: #92929a;
  --fd-fuel-help: #77777f;
  --fd-fuel-placeholder: #68686f;
  --fd-fuel-red: #ff3b30;
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 100dvh !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  overscroll-behavior-y: auto !important;
  touch-action: pan-y !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: var(--fd-fuel-text) !important;
  color-scheme: dark !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-shell {
  display: block !important;
  width: min(100%, 720px) !important;
  min-width: 0 !important;
  min-height: 100dvh !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 0 calc(112px + env(safe-area-inset-bottom)) !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-header {
  position: static !important;
  inset: auto !important;
  z-index: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: calc(18px + env(safe-area-inset-top)) 20px 16px !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transform: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-content {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 20px !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-heading {
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-heading > small {
  margin: 0 0 6px !important;
  color: var(--fd-fuel-red) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .16em !important;
  line-height: 1.1 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-heading h1 {
  margin: 0 !important;
  color: var(--fd-fuel-text) !important;
  font-size: 26px !important;
  font-weight: 650 !important;
  letter-spacing: -.035em !important;
  line-height: 1.05 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-heading p {
  margin: 6px 0 0 !important;
  color: var(--fd-fuel-muted) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] :is(.fd-feature-card, .fd-fuel-settings-card, .fd-fuel-results-card) {
  box-sizing: border-box !important;
  display: grid !important;
  gap: var(--fd-fuel-gap) !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 18px !important;
  border: 1px solid var(--fd-fuel-border) !important;
  border-radius: 22px !important;
  background: var(--fd-fuel-card) !important;
  background-color: var(--fd-fuel-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-card__head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-card__head > div {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-card__head small {
  margin: 0 !important;
  color: var(--fd-fuel-red) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .16em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-card__head h2 {
  margin: 0 !important;
  color: var(--fd-fuel-text) !important;
  font-size: 18px !important;
  font-weight: 650 !important;
  letter-spacing: -.02em !important;
  line-height: 1.15 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-card__head > span {
  flex: 0 0 auto !important;
  max-width: 42% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  border: 1px solid var(--fd-fuel-border) !important;
  border-radius: 999px !important;
  background: var(--fd-fuel-control) !important;
  color: var(--fd-fuel-muted) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: var(--fd-fuel-gap) 12px !important;
  align-items: start !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-form-grid > .fd-field {
  display: grid !important;
  grid-column: auto !important;
  gap: 8px !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-form-grid > .fd-fuel-distance-field,
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-form-grid > .fd-fuel-persons-field {
  grid-column: 1 / -1 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-form-grid .fd-field > span:first-child {
  min-width: 0 !important;
  color: var(--fd-fuel-muted) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-field-label {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 4px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-field-label small {
  color: var(--fd-fuel-help) !important;
  font-size: 10px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-field-affix {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  height: 46px !important;
  border: 1px solid var(--fd-fuel-border-strong) !important;
  border-radius: 14px !important;
  background: var(--fd-fuel-control) !important;
  background-color: var(--fd-fuel-control) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-field-affix--plain {
  --fd-fuel-unit-width: 0px;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-field-affix:focus-within {
  border-color: var(--fd-fuel-red) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-fuel-red) !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-field-affix > input {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 44px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 44px 0 14px !important;
  border: 0 !important;
  border-radius: inherit !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  color: var(--fd-fuel-text) !important;
  -webkit-text-fill-color: var(--fd-fuel-text) !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", system-ui, sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-field-affix > input::placeholder {
  color: var(--fd-fuel-placeholder) !important;
  -webkit-text-fill-color: var(--fd-fuel-placeholder) !important;
  opacity: 1 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-input-host.fd-clearable-host > .fd-clear-button {
  right: 8px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-result-primary-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: var(--fd-fuel-gap) !important;
  width: 100% !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] :is(.fd-fuel-result-hero, .fd-fuel-result-grid > div) {
  box-sizing: border-box !important;
  border: 1px solid var(--fd-fuel-border) !important;
  border-radius: 16px !important;
  background: var(--fd-fuel-control) !important;
  background-color: var(--fd-fuel-control) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-result-hero {
  display: grid !important;
  min-height: 78px !important;
  gap: 5px !important;
  margin: 0 !important;
  padding: 14px 16px !important;
  align-content: center !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] :is(.fd-fuel-result-hero small, .fd-fuel-result-grid small) {
  color: var(--fd-fuel-muted) !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", system-ui, sans-serif !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: .08em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-result-hero strong {
  color: var(--fd-fuel-text) !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", system-ui, sans-serif !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: -.025em !important;
  line-height: 1.05 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-result-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: var(--fd-fuel-gap) 12px !important;
  width: 100% !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-result-grid > div {
  display: grid !important;
  min-width: 0 !important;
  min-height: 72px !important;
  gap: 6px !important;
  align-content: center !important;
  padding: 13px !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-result-grid strong {
  min-width: 0 !important;
  color: var(--fd-fuel-text) !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", system-ui, sans-serif !important;
  font-size: 16px !important;
  font-weight: 650 !important;
  letter-spacing: -.01em !important;
  line-height: 1.15 !important;
  overflow-wrap: anywhere !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-attribution {
  margin: 0 2px !important;
  color: var(--fd-fuel-help) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-attribution {
  margin: 0 3px 4px !important;
  color: #5f5f67 !important;
  font-size: 11px !important;
  text-align: center !important;
}

@media (max-width: 360px) {
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-feature-content {
    padding-inline: 16px !important;
  }

  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] :is(.fd-feature-card, .fd-fuel-settings-card, .fd-fuel-results-card) {
    padding: 16px !important;
  }

  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-form-grid,
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-result-grid {
    column-gap: 10px !important;
  }

  /* On the narrowest phones, keeping the long unit and the reset lane in
     half-width fields would make the value area unusably small. */
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-form-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-form-grid > .fd-field,
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-form-grid > .fd-fuel-distance-field,
  html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-form-grid > .fd-fuel-persons-field {
    grid-column: 1 !important;
  }
}

/* Source: /assets/r322-ui-fixes.css */
/* FuelDash V325 — final shared header geometry, calculator action and skeleton parity. */

/* Profile and bell are the same physical control. Bell state remains visible
   through its icon color, while the outer surface cannot look larger. */
html[data-fd-theme] body #app .brand-header .header-actions > :is(.fd-profile-button, .fd-price-alert-bell) {
  box-sizing: border-box !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  inline-size: 38px !important;
  block-size: 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #2c2c31 !important;
  border-radius: 50% !important;
  background: #080808 !important;
  background-color: #080808 !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  line-height: 0 !important;
}

html[data-fd-theme] body #app .brand-header .header-actions > :is(.fd-profile-button, .fd-price-alert-bell) svg {
  display: block !important;
  inline-size: 19px !important;
  block-size: 19px !important;
  width: 19px !important;
  height: 19px !important;
  margin: 0 !important;
  transform: none !important;
}

/* The first skeleton frame uses exactly the same dimensions and a single
   dark-gray surface for both placeholders. */
html body .fd-startup-cover .fd-fast-header-actions > :is(.fd-fast-profile-placeholder, .fd-fast-price-alert-bell-placeholder) {
  box-sizing: border-box !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  inline-size: 38px !important;
  block-size: 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #242424 !important;
  border-radius: 50% !important;
  background: #111111 !important;
  background-color: #111111 !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #4d4d52 !important;
}

html body .fd-startup-cover .fd-fast-header-actions > :is(.fd-fast-profile-placeholder, .fd-fast-price-alert-bell-placeholder) svg {
  display: block !important;
  inline-size: 19px !important;
  block-size: 19px !important;
  width: 19px !important;
  height: 19px !important;
  margin: 0 !important;
}

html[data-fd-theme="light"] body #app .brand-header .header-actions > :is(.fd-profile-button, .fd-price-alert-bell) {
  border-color: rgba(35, 35, 40, .16) !important;
  background: #f2f2f5 !important;
  background-color: #f2f2f5 !important;
  color: #303036 !important;
}

/* The calculator reset follows the Tankbuch action pattern and remains the
   only action in the upper-right corner of the settings card. */
html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-settings-head-actions {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  gap: 8px !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-settings-head-actions > .fd-fuel-reset {
  box-sizing: border-box !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 34px !important;
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 69, 58, .72) !important;
  border-radius: 50% !important;
  background: rgba(255, 69, 58, .11) !important;
  background-color: rgba(255, 69, 58, .11) !important;
  color: #ff453a !important;
  font: inherit !important;
  line-height: 1 !important;
  box-shadow: none !important;
  transition: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-settings-head-actions > .fd-fuel-reset svg {
  display: block !important;
  width: 17px !important;
  height: 17px !important;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  transform: none !important;
}

html[data-fd-theme="dark"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-settings-head-actions > .fd-fuel-reset:is(:hover, :focus, :focus-visible, :active) {
  border-color: #ff453a !important;
  background: rgba(255, 69, 58, .18) !important;
  background-color: rgba(255, 69, 58, .18) !important;
  color: #f5f5f7 !important;
  outline: none !important;
  box-shadow: inset 0 0 0 1px #ff453a !important;
}

html[data-fd-theme="light"] body .fd-feature-page[data-fd-feature-view="fuel-calculator"] .fd-fuel-settings-head-actions > .fd-fuel-reset {
  border-color: rgba(210, 48, 40, .66) !important;
  background: rgba(255, 69, 58, .10) !important;
  background-color: rgba(255, 69, 58, .10) !important;
  color: #d22f28 !important;
}

/* Source: /assets/r328-price-alert-design.css */
/* FuelDash V333 — one final Price Alerts design boundary.
   The feature keeps its existing behavior and markup, but uses the same
   spacing, surface, and type hierarchy as Tankbuch and Spritrechner. */

:root {
  --fd-r328-alert-text: #f5f5f7;
  --fd-r328-alert-label: #f5f5f7;
  --fd-r328-alert-help: #77777f;
  --fd-r328-alert-muted: #92929a;
  --fd-r328-alert-placeholder: #68686f;
  --fd-r328-alert-page: #000000;
  --fd-r328-alert-card: #0c0c0c;
  --fd-r328-alert-control: #080808;
  --fd-r328-alert-border: #1e1e1e;
  --fd-r328-alert-border-strong: #2a2a2e;
  --fd-r328-alert-accent: #ff3b30;
}

html[data-fd-theme="light"] {
  --fd-r328-alert-text: #17171a;
  --fd-r328-alert-label: #17171a;
  --fd-r328-alert-help: #62626a;
  --fd-r328-alert-muted: #62626a;
  --fd-r328-alert-placeholder: #8c8c95;
  --fd-r328-alert-page: #ffffff;
  --fd-r328-alert-card: #f7f7f8;
  --fd-r328-alert-control: #ffffff;
  --fd-r328-alert-border: #dedee3;
  --fd-r328-alert-border-strong: #c8c8cf;
  --fd-r328-alert-accent: #d22f28;
}

/* The final boundary deliberately carries the same specificity as the old
   body:not(...) patches, so the legacy rules cannot reintroduce the cramped
   modal geometry or the gray all-purpose label treatment. */
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal,
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal :is(
  h1,
  h2,
  h3,
  p,
  span,
  small,
  strong,
  label,
  button,
  select,
  input
) {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", system-ui, sans-serif !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal {
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 100dvh !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: calc(18px + env(safe-area-inset-top)) 20px calc(112px + env(safe-area-inset-bottom)) !important;
  overflow: visible !important;
  overscroll-behavior-y: auto !important;
  touch-action: pan-y !important;
  background: var(--fd-r328-alert-page) !important;
  background-color: var(--fd-r328-alert-page) !important;
  background-image: none !important;
  color: var(--fd-r328-alert-text) !important;
  color-scheme: dark !important;
  font-weight: 400 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-sheet {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: min(100%, 720px) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  row-gap: 0 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-head {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 16px !important;
  padding: 0 0 14px !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-head > div {
  min-width: 0 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-kicker {
  display: block !important;
  margin: 0 0 4px !important;
  color: var(--fd-r328-alert-accent) !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  letter-spacing: .17em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-head h2 {
  margin: 0 !important;
  color: var(--fd-r328-alert-text) !important;
  font-size: 27px !important;
  font-weight: 600 !important;
  letter-spacing: -.035em !important;
  line-height: 1.05 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-close {
  flex: 0 0 38px !important;
  width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--fd-r328-alert-border-strong) !important;
  border-radius: 50% !important;
  background: var(--fd-r328-alert-control) !important;
  color: var(--fd-r328-alert-text) !important;
  box-shadow: none !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-status {
  display: grid !important;
  gap: 5px !important;
  min-height: 0 !important;
  margin: 0 0 14px !important;
  padding: 14px 16px !important;
  border: 1px solid var(--fd-r328-alert-border) !important;
  border-radius: 19px !important;
  background: var(--fd-r328-alert-card) !important;
  color: var(--fd-r328-alert-muted) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-status__text {
  margin: 0 !important;
  color: inherit !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-settings-heading {
  margin: 0 2px 10px !important;
  color: var(--fd-r328-alert-text) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: -.012em !important;
  line-height: 1.18 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-status[hidden],
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-action-feedback[hidden] {
  display: none !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 14px !important;
  width: 100% !important;
  margin: 0 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-tank-chance {
  display: grid !important;
  gap: 10px !important;
  padding: 14px !important;
  border: 1px solid color-mix(in srgb, var(--fd-r328-alert-accent) 42%, var(--fd-r328-alert-border)) !important;
  border-radius: 20px !important;
  background: color-mix(in srgb, var(--fd-r328-alert-accent) 8%, var(--fd-r328-alert-card)) !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-price-alert-page .fd-alert-tank-chance {
  display: grid !important;
  gap: 10px !important;
  padding: 14px !important;
  border: 1px solid color-mix(in srgb, var(--fd-r328-alert-accent) 42%, var(--fd-r328-alert-border)) !important;
  border-radius: 20px !important;
  background: color-mix(in srgb, var(--fd-r328-alert-accent) 8%, var(--fd-r328-alert-card)) !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-tank-chance > p {
  margin: 0 3px !important;
  color: var(--fd-r328-alert-text) !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-price-alert-page .fd-alert-tank-chance > p {
  margin: 0 3px !important;
  color: var(--fd-r328-alert-text) !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-tank-chance small,
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-tank-chance-note {
  display: block !important;
  margin-top: 4px !important;
  color: var(--fd-r328-alert-help) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-price-alert-page .fd-alert-tank-chance small,
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-price-alert-page .fd-alert-tank-chance-note {
  display: block !important;
  margin-top: 4px !important;
  color: var(--fd-r328-alert-help) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal [data-fd-legacy-alert].is-muted {
  opacity: .42 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  min-width: 0 !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: 14px 16px !important;
  border: 1px solid var(--fd-r328-alert-border) !important;
  border-radius: 19px !important;
  background: var(--fd-r328-alert-card) !important;
  color: var(--fd-r328-alert-text) !important;
  box-shadow: none !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row > span {
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--fd-r328-alert-label) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: -.01em !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row > span > small,
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station > span > small {
  display: block !important;
  max-width: 100% !important;
  margin: 5px 0 0 !important;
  color: var(--fd-r328-alert-help) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row > :is(select, input[type="time"], input[type="number"]) {
  flex: 0 0 128px !important;
  width: 128px !important;
  min-width: 128px !important;
  max-width: 128px !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 11px 14px !important;
  border: 1px solid var(--fd-r328-alert-border-strong) !important;
  border-radius: 13px !important;
  background: var(--fd-r328-alert-control) !important;
  color: var(--fd-r328-alert-text) !important;
  -webkit-text-fill-color: var(--fd-r328-alert-text) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
  opacity: 1 !important;
}

/* V493: Android WebView can composite the body-mounted alert below the app
   shell when the shared design boundary changes it to a relative layer. Keep
   the alert surface on the same fixed top layer as the original modal. */
html[data-fd-platform="android"].fd-alert-open body > .fd-alert-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

/* V493: Vivaldi's Android PWA compositor can place the old body-mounted
   modal below FuelDash's retained tab bar. Android therefore uses an
   isolated page surface which does not inherit the legacy modal cascade.
   iPhone and other platforms keep the established .fd-alert-modal path. */
html[data-fd-platform="android"].fd-price-alert-page-open body > .fd-price-alert-page {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: max(18px, env(safe-area-inset-top)) 20px calc(34px + env(safe-area-inset-bottom)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
  background: #000 !important;
  color: #f5f5f7 !important;
  color-scheme: dark !important;
  isolation: isolate !important;
}

html[data-fd-platform="android"].fd-price-alert-page-open body > .fd-price-alert-page .fd-alert-sheet {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  width: min(100%, 520px) !important;
  min-height: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 0 calc(96px + env(safe-area-inset-bottom)) !important;
  overflow: visible !important;
  background: transparent !important;
  color: inherit !important;
}

html[data-fd-platform="android"].fd-price-alert-page-open body > .fd-price-alert-page .fd-alert-head {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 100% !important;
  min-height: 38px !important;
  margin: 0 0 16px !important;
  padding: 0 0 14px !important;
  transform: none !important;
  background: transparent !important;
  color: inherit !important;
}

html[data-fd-platform="android"].fd-price-alert-page-open body > .fd-price-alert-page :is(.fd-alert-row, .fd-alert-station, .fd-alert-empty, .fd-alert-status) {
  background: #0c0c0c !important;
  border-color: #1e1e1e !important;
  color: #f5f5f7 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row :is(select, input[type="time"], input[type="number"]):focus {
  border-color: var(--fd-r328-alert-accent) !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--fd-r328-alert-accent) !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row :is(input[type="time"], input[type="number"])::placeholder {
  color: var(--fd-r328-alert-placeholder) !important;
  -webkit-text-fill-color: var(--fd-r328-alert-placeholder) !important;
  opacity: 1 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row > input[type="checkbox"],
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station > input[type="checkbox"] {
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--fd-r328-alert-border-strong) !important;
  border-radius: 7px !important;
  background: var(--fd-r328-alert-control) !important;
  accent-color: var(--fd-r328-alert-accent) !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row > input[type="checkbox"]:checked,
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station > input[type="checkbox"]:checked {
  border-color: var(--fd-r328-alert-accent) !important;
  background: var(--fd-r328-alert-accent) !important;
  background-color: var(--fd-r328-alert-accent) !important;
  color: #ffffff !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row--threshold {
  grid-column: 1 / -1 !important;
  opacity: 1 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row--threshold.is-disabled {
  opacity: .55 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station-section {
  display: grid !important;
  gap: 14px !important;
  margin: 22px 0 0 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station-section > header {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 2px !important;
  padding: 0 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station-section h3 {
  margin: 0 !important;
  color: var(--fd-r328-alert-text) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: -.012em !important;
  line-height: 1.18 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station-count {
  margin: 0 !important;
  color: var(--fd-r328-alert-muted) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-stations {
  display: grid !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 0 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 1px solid var(--fd-r328-alert-border) !important;
  border-radius: 19px !important;
  background: var(--fd-r328-alert-card) !important;
  color: var(--fd-r328-alert-text) !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station img {
  flex: 0 0 38px !important;
  width: 38px !important;
  height: 38px !important;
  margin: 0 !important;
  object-fit: contain !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station > span {
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  color: var(--fd-r328-alert-text) !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-station > span > strong {
  display: block !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: var(--fd-r328-alert-text) !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  letter-spacing: -.01em !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 18px 0 0 !important;
  padding: 0 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-actions > button {
  min-width: 0 !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 14px 12px !important;
  border-radius: 13px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-enable {
  border-color: var(--fd-r328-alert-accent) !important;
  background: var(--fd-r328-alert-accent) !important;
  color: #ffffff !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-test {
  border: 1px solid var(--fd-r328-alert-border-strong) !important;
  background: var(--fd-r328-alert-control) !important;
  color: var(--fd-r328-alert-text) !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal :is(.fd-alert-action-feedback, .fd-alert-note) {
  margin: 12px 2px 0 !important;
  color: var(--fd-r328-alert-help) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-note {
  margin-top: 8px !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-empty {
  margin: 0 !important;
  padding: 14px 16px !important;
  border: 1px solid var(--fd-r328-alert-border) !important;
  border-radius: 19px !important;
  background: var(--fd-r328-alert-card) !important;
  color: var(--fd-r328-alert-muted) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal::before,
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal::after,
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-sheet::before,
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-sheet::after,
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-head::before,
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-head::after {
  content: none !important;
  display: none !important;
}

@media (min-width: 620px) {
  html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal {
    padding-right: 24px !important;
    padding-left: 24px !important;
  }
}

@media (max-width: 360px) {
  html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-row > :is(select, input[type="time"], input[type="number"]) {
    flex-basis: 116px !important;
    width: 116px !important;
    min-width: 116px !important;
    max-width: 116px !important;
  }
}

/* Source: /assets/r334-tankbook-typography.css */
/* FuelDash V334 — one final, readable Tankbuch type hierarchy. */

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif !important;
  font-synthesis: none !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-feature-card__head h2, .fd-tank-history__head h2) {
  color: var(--fd-r251-text, #f5f5f7) !important;
  font-size: 17px !important;
  font-weight: 650 !important;
  letter-spacing: -.018em !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-feature-card__head small, .fd-tank-history__head small) {
  color: var(--fd-r251-red, #ff3b30) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  letter-spacing: .12em !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-history__head {
  align-items: center !important;
  padding-bottom: 14px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-history__head > span {
  color: var(--fd-r251-text, #f5f5f7) !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry {
  padding: 16px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__head {
  gap: 12px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__head small {
  color: var(--fd-r251-help, #92929a) !important;
  font-size: 11px !important;
  font-weight: 450 !important;
  line-height: 1.35 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__station h3 {
  margin: 5px 0 0 !important;
  color: var(--fd-r251-text, #f5f5f7) !important;
  font-size: 17px !important;
  font-weight: 650 !important;
  letter-spacing: -.018em !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__station-address {
  margin-top: 4px !important;
  color: var(--fd-r251-help, #92929a) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__fuel {
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.1 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__values {
  gap: 8px !important;
  margin-top: 15px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__values > span {
  min-height: 64px !important;
  padding: 11px 10px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__values small {
  color: var(--fd-r251-help, #92929a) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__values strong {
  margin-top: 5px !important;
  color: var(--fd-r251-text, #f5f5f7) !important;
  font-size: 14px !important;
  font-variant-numeric: tabular-nums !important;
  font-weight: 650 !important;
  letter-spacing: -.012em !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__values > span:last-child strong {
  color: var(--fd-r251-red, #ff3b30) !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details {
  margin-top: 8px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details > summary {
  padding: 9px 0 4px !important;
  color: var(--fd-r251-help, #92929a) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details-body {
  padding-top: 6px !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__details-body > p,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__receipt-detail > p {
  color: var(--fd-r251-help, #92929a) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__receipt-detail > small {
  color: var(--fd-r251-help, #92929a) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  letter-spacing: .1em !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-month-grid small, .fd-tank-summary small) {
  color: var(--fd-r251-help, #92929a) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(.fd-month-grid strong, .fd-tank-summary strong) {
  color: var(--fd-r251-text, #f5f5f7) !important;
  font-size: 17px !important;
  font-variant-numeric: tabular-nums !important;
  font-weight: 650 !important;
  letter-spacing: -.015em !important;
  line-height: 1.2 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-form-legend {
  font-size: 11px !important;
  line-height: 1.4 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-field-label {
  font-size: 12px !important;
  line-height: 1.3 !important;
}

@media (max-width: 380px) {
  html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__values strong {
    font-size: 13px !important;
  }
}

/* Source: /assets/r336-tankbook-layout.css */
/* FuelDash V341 — bounded Tankbuch entry geometry for the mobile viewport. */

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] :is(
  .fd-tank-history,
  .fd-tank-list,
  .fd-tank-entry,
  .fd-tank-entry__head,
  .fd-tank-entry__station,
  .fd-tank-entry__values,
  .fd-tank-entry__details
) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry {
  overflow: hidden !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-history__head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 30px !important;
  align-items: center !important;
  min-width: 0 !important;
  width: 100% !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-history__head > span {
  display: grid !important;
  place-items: center !important;
  box-sizing: border-box !important;
  flex: 0 0 30px !important;
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  margin: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 10px !important;
  padding: 0 !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__fuel-side {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__controls {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex: 0 0 auto !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__fuel {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__station {
  overflow: hidden !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__station h3,
html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__station-address {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__fuel-side {
  min-width: 0 !important;
  max-width: 100% !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__values > span {
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__values :is(small, strong) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

@media (max-width: 480px) {
  html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__head {
    grid-template-columns: minmax(0, 1fr) auto !important;
    column-gap: 8px !important;
    row-gap: 0 !important;
  }

  html[data-fd-theme] body .fd-feature-page[data-fd-feature-view="tankbook"] .fd-tank-entry__fuel-side {
    width: auto !important;
    justify-content: flex-end !important;
  }
}

/* Source: /assets/r347-admin-design.css */
/* FuelDash V349 — admin page uses the same OLED surfaces and semantic tones as the app. */

html[data-fd-theme="dark"] body.fd-account-route-open {
  --fd-admin-page: #000000;
  --fd-admin-card: #0c0c0c;
  --fd-admin-control: #080808;
  --fd-admin-border: #1e1e1e;
  --fd-admin-border-strong: #2a2a2e;
  --fd-admin-text: #f5f5f7;
  --fd-admin-muted: #92929a;
  --fd-admin-help: #75757d;
  --fd-admin-red: #ff3b30;
  --fd-admin-green: #30d158;
  --fd-admin-yellow: #e0ad2f;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-panel,
  .fd-admin-run-stats,
  .fd-admin-push-card,
  .fd-push-notice-admin-card
) {
  box-sizing: border-box !important;
  display: grid !important;
  gap: 12px !important;
  padding: 16px !important;
  border: 1px solid var(--fd-admin-border) !important;
  border-radius: 19px !important;
  background: var(--fd-admin-card) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: var(--fd-admin-text) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-panel .fd-feature-card__head,
  .fd-admin-run-stats .fd-feature-card__head,
  .fd-admin-push-card .fd-feature-card__head,
  .fd-push-notice-admin-card .fd-feature-card__head
) {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-panel .fd-feature-card__head small,
  .fd-admin-run-stats .fd-feature-card__head small,
  .fd-admin-push-card .fd-feature-card__head small,
  .fd-push-notice-admin-card .fd-feature-card__head small
) {
  color: var(--fd-admin-red) !important;
  font-size: 9px !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-panel h2,
  .fd-admin-run-stats h2,
  .fd-admin-push-card h2,
  .fd-push-notice-admin-card h2
) {
  margin: 4px 0 0 !important;
  color: var(--fd-admin-text) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: -.018em !important;
  line-height: 1.15 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-panel > p,
  .fd-admin-run-stats > p,
  .fd-admin-push-card > p,
  .fd-push-notice-admin-card > p
) {
  margin: 0 !important;
  color: var(--fd-admin-muted) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.42 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-panel .fd-feature-card__head > span,
  .fd-admin-run-stats .fd-feature-card__head > span,
  .fd-admin-run-item__head .fd-admin-status,
  .fd-admin-push-card .fd-feature-card__head > span,
  .fd-push-notice-admin-card .fd-feature-card__head > span
) {
  flex: 0 0 auto !important;
  max-width: 48% !important;
  padding: 4px 8px !important;
  overflow: hidden !important;
  border: 1px solid var(--fd-admin-border-strong) !important;
  border-radius: 999px !important;
  background: var(--fd-admin-control) !important;
  color: var(--fd-admin-muted) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-user-list,
html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-runs-history {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
  padding: 2px 4px 2px 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-color: var(--fd-admin-border-strong) var(--fd-admin-control) !important;
  scrollbar-width: thin !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-user-list {
  max-height: 236px !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-runs-history {
  max-height: min(520px, 62vh) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-user,
html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-item,
html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-push-audience-modes,
html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-user-picker {
  min-width: 0 !important;
  border: 1px solid var(--fd-admin-border) !important;
  border-radius: 14px !important;
  background: var(--fd-admin-control) !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-user {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 4px 12px !important;
  align-items: center !important;
  padding: 11px 12px !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-user strong,
html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-item__head strong {
  color: var(--fd-admin-text) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-user small,
html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-user time {
  color: var(--fd-admin-muted) !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-user span {
  border: 1px solid rgba(255, 59, 48, .35) !important;
  background: rgba(255, 59, 48, .10) !important;
  color: var(--fd-admin-red) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-item {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-item__head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-item__head small {
  color: var(--fd-admin-red) !important;
  font-size: 9px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-item__head h3 {
  margin: 3px 0 0 !important;
  color: var(--fd-admin-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-status {
  border: 1px solid var(--fd-admin-border-strong) !important;
  border-radius: 999px !important;
  background: var(--fd-admin-control) !important;
  color: var(--fd-admin-muted) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-status--completed,
  .fd-admin-run-item__head .fd-admin-status--completed,
  .fd-admin-run-delivery--accepted .fd-admin-run-delivery__head span
) {
  border-color: rgba(48, 209, 88, .32) !important;
  background: rgba(48, 209, 88, .08) !important;
  color: var(--fd-admin-green) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-status--running,
  .fd-admin-run-item__head .fd-admin-status--running,
  .fd-admin-run-delivery--skipped .fd-admin-run-delivery__head span
) {
  border-color: rgba(224, 173, 47, .34) !important;
  background: rgba(224, 173, 47, .08) !important;
  color: var(--fd-admin-yellow) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-status--error,
  .fd-admin-run-item__head .fd-admin-status--error,
  .fd-admin-run-delivery--failed .fd-admin-run-delivery__head span
) {
  border-color: rgba(255, 59, 48, .34) !important;
  background: rgba(255, 59, 48, .08) !important;
  color: var(--fd-admin-red) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-overview {
  display: grid !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 10px !important;
  border: 1px solid var(--fd-admin-border) !important;
  border-radius: 12px !important;
  background: #050505 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-filters {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-filter {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-filter > span {
  color: var(--fd-admin-muted) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-filter select {
  width: 100% !important;
  min-height: 40px !important;
  padding: 8px 10px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--fd-admin-border-strong) !important;
  border-radius: 11px !important;
  background: var(--fd-admin-control) !important;
  color: var(--fd-admin-text) !important;
  font: inherit !important;
  font-size: 12px !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-filter select:focus-visible {
  outline: 2px solid rgba(255, 59, 48, .72) !important;
  outline-offset: 2px !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-overview__line {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-overview__line :is(span, time) {
  color: var(--fd-admin-muted) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-metrics {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
  margin: 0 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-metric {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
  padding: 9px 8px !important;
  border: 1px solid var(--fd-admin-border) !important;
  border-radius: 11px !important;
  background: var(--fd-admin-control) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-metric b {
  color: var(--fd-admin-text) !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-metric small {
  overflow: hidden !important;
  color: var(--fd-admin-muted) !important;
  font-size: 9px !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-metric[data-tone="positive"] b {
  color: var(--fd-admin-green) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-metric[data-tone="warning"] b {
  color: var(--fd-admin-yellow) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-metric[data-tone="danger"] b {
  color: var(--fd-admin-red) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-deliveries-details {
  margin: 0 !important;
  padding: 0 10px !important;
  border: 1px solid var(--fd-admin-border) !important;
  border-radius: 12px !important;
  background: #050505 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-deliveries-details > summary {
  padding: 10px 0 !important;
  color: var(--fd-admin-text) !important;
  cursor: pointer !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-deliveries {
  display: grid !important;
  gap: 6px !important;
  padding: 0 0 10px !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-delivery {
  display: grid !important;
  gap: 5px !important;
  padding: 9px !important;
  border: 1px solid var(--fd-admin-border) !important;
  border-radius: 10px !important;
  background: var(--fd-admin-control) !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-delivery__head,
html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-delivery__meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-delivery__head span {
  padding: 3px 6px !important;
  border-radius: 999px !important;
  font-size: 9px !important;
  font-weight: 650 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-run-delivery__meta,
  .fd-admin-run-delivery small,
  .fd-admin-run-delivery time
) {
  color: var(--fd-admin-muted) !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-refresh,
  .fd-admin-run-refresh,
  button[data-fd-admin-refresh],
  button[data-fd-admin-run-refresh]
) {
  width: 100% !important;
  min-height: 42px !important;
  margin: 0 !important;
  border: 1px solid var(--fd-admin-red) !important;
  border-radius: 13px !important;
  background: #ff3b30 !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  button.fd-admin-refresh,
  button.fd-admin-run-refresh,
  button[data-fd-admin-refresh],
  button[data-fd-admin-run-refresh]
) {
  background: #ff3b30 !important;
  background-image: none !important;
  color: #ffffff !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-refresh:disabled,
  .fd-admin-run-refresh:disabled,
  button[data-fd-admin-refresh]:disabled,
  button[data-fd-admin-run-refresh]:disabled
) {
  cursor: wait !important;
  opacity: .62 !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-push-audience-modes,
  .fd-admin-user-picker
) {
  gap: 8px !important;
  margin: 0 !important;
  padding: 11px !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-push-audience-modes legend,
  .fd-admin-user-picker > small
) {
  color: var(--fd-admin-muted) !important;
  font-size: 9px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open :is(
  .fd-admin-push-audience-modes label,
  .fd-admin-user-choice
) {
  color: var(--fd-admin-text) !important;
  font-size: 12px !important;
}

html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-push-status {
  border-color: rgba(48, 209, 88, .28) !important;
  background: rgba(48, 209, 88, .08) !important;
  color: var(--fd-admin-green) !important;
}

/* A saved global notice is a quiet inline confirmation, not a colored panel. */
html[data-fd-theme="dark"] body.fd-account-route-open .fd-push-notice-admin-card .fd-auth-form-status[data-type="success"] {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--fd-admin-green) !important;
  font-size: 12px !important;
}

/* The global dashboard message starts with its actual title, without the old kicker gap. */
html[data-fd-theme="dark"] body #app > .app-shell > .app-content > .fd-public-push-notice .fd-push-attention-card__body small {
  display: none !important;
}

html[data-fd-theme="dark"] body #app > .app-shell > .app-content > .fd-public-push-notice .fd-push-attention-card__body h2 {
  margin: 0 0 4px !important;
}

@media (max-width: 520px) {
  html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-filters {
    grid-template-columns: 1fr !important;
  }

  html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html[data-fd-theme="dark"] body.fd-account-route-open .fd-admin-run-overview__line {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 2px !important;
  }
}

/* FuelDash V351 — the last-known-data label must remain visible without changing the OLED layout. */
.fd-live-cache-status {
  display: block;
  margin-top: 6px;
  color: #8b8b92;
  font-size: 12px;
  line-height: 1.35;
}

/* FuelDash V480 — final Android dashboard cascade after every legacy layer. */
html[data-fd-platform="android"] body #app :is(
  .dashboard-favorite-card,
  .favorites-screen-card
) .station-opening {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: max-content !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  hyphens: none !important;
}

html[data-fd-platform="android"] body #app :is(
  .dashboard-favorite-card,
  .favorites-screen-card
) .station-opening > span {
  display: inline-block !important;
  flex: 0 0 auto !important;
  min-width: max-content !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
}

/* Android owns only the root overscroll boundary; normal vertical scrolling remains native. */
html[data-fd-platform="android"],
html[data-fd-platform="android"] body {
  overscroll-behavior-y: none !important;
  touch-action: pan-y !important;
}

/* FuelDash V480 — Android favorite columns are fixed before and after the first paint. */
html[data-fd-platform="android"] body #app :is(
  .dashboard-favorite-card,
  .favorites-screen-card
) {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) minmax(64px, max-content) 36px !important;
  grid-template-areas: none !important;
  gap: 10px !important;
  align-items: center !important;
  box-sizing: border-box !important;
}

html[data-fd-platform="android"] body #app :is(
  .dashboard-favorite-card,
  .favorites-screen-card
) > .station-logo {
  grid-area: auto !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: grid !important;
  place-items: center !important;
  position: relative !important;
  min-width: 38px !important;
  width: 38px !important;
  min-height: 38px !important;
  height: 38px !important;
  overflow: hidden !important;
}

html[data-fd-platform="android"] body #app :is(
  .dashboard-favorite-card,
  .favorites-screen-card
) > .station-copy {
  grid-area: auto !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: block !important;
  min-width: 0 !important;
  width: auto !important;
  overflow: hidden !important;
}

html[data-fd-platform="android"] body #app :is(
  .dashboard-favorite-card,
  .favorites-screen-card
) > .station-value {
  grid-area: auto !important;
  grid-column: 3 !important;
  grid-row: 1 !important;
  display: block !important;
  min-width: 64px !important;
  text-align: right !important;
}

html[data-fd-platform="android"] body #app :is(
  .dashboard-favorite-card,
  .favorites-screen-card
) > .favorite-toggle {
  grid-area: auto !important;
  grid-column: 4 !important;
  grid-row: 1 !important;
  display: grid !important;
  place-items: center !important;
  min-width: 36px !important;
  width: 36px !important;
  height: 36px !important;
  padding: 0 !important;
}

/* Keep the native hidden state authoritative after all bundled alert-card
   theme rules, including the recommendation card's display rule. */
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-alert-modal .fd-alert-tank-chance[hidden],
html[data-fd-theme] body:not(#fd-r328-price-alert-scope) .fd-price-alert-page .fd-alert-tank-chance[hidden] {
  display: none !important;
}