/* /Components/Dashboard/ForecastChart.razor.rz.scp.css */
.forecast-chart[b-byvd9y6w9c] {
    container-type: inline-size;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(14rem, .75fr);
    gap: 1rem;
}

.forecast-chart > h2[b-byvd9y6w9c] {
    grid-column: 1 / -1;
}

.forecast-chart > .forecast-summary[b-byvd9y6w9c] {
    grid-column: 2;
    grid-row: 2;
    margin-top: 0;
}

.forecast-grid[b-byvd9y6w9c] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: .5rem;
    margin: 1rem 0;
}

.forecast-cell[b-byvd9y6w9c] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
    padding: .65rem;
    border: 1px solid currentColor;
    border-radius: .35rem;
}

.forecast-cell--favorable[b-byvd9y6w9c] {
    border-inline-start: .35rem solid #1b6e35;
}

.forecast-cell--regular[b-byvd9y6w9c] {
    border-inline-start: .35rem solid #666;
}

.forecast-cell__day[b-byvd9y6w9c],
.forecast-cell__time[b-byvd9y6w9c] {
    overflow-wrap: anywhere;
}

.forecast-cell__day[b-byvd9y6w9c],
.forecast-cell__label[b-byvd9y6w9c] {
    font-weight: 600;
}

.forecast-upcoming ul[b-byvd9y6w9c] {
    margin: 0;
    padding-inline-start: 1.25rem;
}

.forecast-summary[b-byvd9y6w9c] {
    margin-top: 1rem;
}

.forecast-summary p[b-byvd9y6w9c] {
    overflow-wrap: anywhere;
}

.forecast-warning[b-byvd9y6w9c] {
    font-weight: 600;
}

@container (max-width: 28rem) {
    .forecast-chart[b-byvd9y6w9c] {
        display: block;
    }

    .forecast-chart > .forecast-summary[b-byvd9y6w9c] {
        margin-top: 1rem;
    }

    .forecast-grid[b-byvd9y6w9c] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Dashboard/PriceHistoryChart.razor.rz.scp.css */
.price-history-chart[b-691d59q3s7] {
    width: 100%;
}

.price-history-chart__svg[b-691d59q3s7] {
    display: block;
    height: auto;
    max-width: 100%;
}

.price-history-chart__axis[b-691d59q3s7] {
    stroke: currentColor;
    stroke-width: 1;
}

.price-history-chart__line[b-691d59q3s7] {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.price-history-chart__label[b-691d59q3s7] {
    fill: currentColor;
    font-size: 12px;
}

.price-history-chart__label--end[b-691d59q3s7] {
    text-anchor: end;
}

.price-history-chart__legend[b-691d59q3s7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    padding-top: 0.75rem;
}

.price-history-chart__legend-item[b-691d59q3s7] {
    align-items: center;
    display: inline-flex;
    gap: 0.4rem;
}

.price-history-chart__swatch[b-691d59q3s7] {
    border-radius: 0.15rem;
    display: inline-block;
    height: 0.8rem;
    width: 1.4rem;
}

.price-history-chart__notice[b-691d59q3s7],
.price-history-chart__status[b-691d59q3s7] {
    margin: 0.75rem 0 0;
}
/* /Components/Home/PriceHistoryChart.razor.rz.scp.css */
.price-history-chart[b-dyyasu7w2k] {
    --chart-surface: var(--surface, #ffffff);
    --chart-surface-2: var(--surface-2, #f5f8fa);
    --chart-text: var(--text, #0e1a26);
    --chart-muted: var(--muted, #5d6f80);
    --chart-line: var(--line, #dbe3ea);
    --chart-focus: var(--accent, #0a8f62);
    --series-0: var(--c-jet, #0a8f62);
    --series-1: var(--c-walther, #2f6fed);
    --series-2: var(--c-aral, #e08a00);
    --series-3: var(--c-shell, #d6455d);
    --series-4: var(--c-neo, #8b5cf6);
    box-sizing: border-box;
    min-width: 0;
    width: 100%;
    padding: 14px 10px 12px;
    overflow: hidden;
    color: var(--chart-text);
}

.chart-head[b-dyyasu7w2k] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 0 6px 6px;
}

.title[b-dyyasu7w2k] {
    font-size: 17px;
    font-weight: 700;
}

.unit[b-dyyasu7w2k] {
    color: var(--chart-muted);
    font-size: 13px;
    text-align: right;
}

.chart[b-dyyasu7w2k] {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
    touch-action: pan-y;
    user-select: none;
}

.chart:focus-visible[b-dyyasu7w2k],
.legend-button:focus-visible[b-dyyasu7w2k] {
    outline: 3px solid var(--chart-focus);
    outline-offset: 2px;
}

.grid line[b-dyyasu7w2k] {
    stroke: var(--chart-line);
    stroke-width: 1;
}

.grid text[b-dyyasu7w2k],
.x-labels text[b-dyyasu7w2k],
.axis-title[b-dyyasu7w2k] {
    fill: var(--chart-muted);
    font-size: 10.5px;
    font-variant-numeric: tabular-nums;
}

.axis-title[b-dyyasu7w2k] {
    font-size: 9px;
    font-weight: 650;
}

.day-separator[b-dyyasu7w2k] {
    stroke: var(--chart-line);
    stroke-dasharray: 2 4;
}

.data-series[b-dyyasu7w2k] {
    stroke: var(--series-stroke);
    stroke-width: 1.5;
    stroke-linejoin: round;
    opacity: .8;
    vector-effect: non-scaling-stroke;
}

.data-series.is-cheapest[b-dyyasu7w2k] {
    stroke-width: 2.6;
    opacity: 1;
}

.cursor[b-dyyasu7w2k] {
    stroke: var(--chart-muted);
    stroke-width: 1;
    opacity: .7;
    vector-effect: non-scaling-stroke;
}

.series-color-0[b-dyyasu7w2k] { --series-stroke: var(--series-0); stroke: var(--series-0); background: var(--series-0); }
.series-color-1[b-dyyasu7w2k] { --series-stroke: var(--series-1); stroke: var(--series-1); background: var(--series-1); }
.series-color-2[b-dyyasu7w2k] { --series-stroke: var(--series-2); stroke: var(--series-2); background: var(--series-2); }
.series-color-3[b-dyyasu7w2k] { --series-stroke: var(--series-3); stroke: var(--series-3); background: var(--series-3); }
.series-color-4[b-dyyasu7w2k] { --series-stroke: var(--series-4); stroke: var(--series-4); background: var(--series-4); }

.readout[b-dyyasu7w2k] {
    margin: 6px 6px 2px;
    padding: 10px 12px;
    border-radius: 12px;
    background: var(--chart-surface-2);
    font-size: 14px;
}

.when[b-dyyasu7w2k] {
    margin-bottom: 6px;
    font-weight: 700;
}

.values[b-dyyasu7w2k] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 14px;
}

.value[b-dyyasu7w2k] {
    display: flex;
    min-width: 0;
    justify-content: space-between;
    gap: 8px;
    font-variant-numeric: tabular-nums;
}

.value span[b-dyyasu7w2k] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.value i[b-dyyasu7w2k],
.legend-button i[b-dyyasu7w2k] {
    display: inline-block;
    flex: none;
    width: 10px;
    height: 10px;
    margin-right: 6px;
    border-radius: 50%;
}

.value strong[b-dyyasu7w2k] {
    white-space: nowrap;
}

.legend[b-dyyasu7w2k] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 6px 0;
}

.legend-button[b-dyyasu7w2k] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    padding: 8px 12px;
    border: 1px solid var(--chart-line);
    border-radius: 999px;
    background: var(--chart-surface);
    color: var(--chart-text);
    cursor: pointer;
    font: inherit;
    font-size: 14px;
}

.legend-button[aria-pressed="false"][b-dyyasu7w2k] {
    color: var(--chart-muted);
}

.legend-button[aria-pressed="false"] i[b-dyyasu7w2k] {
    background: transparent;
    box-shadow: inset 0 0 0 2px var(--series-stroke);
}

.missing-series[b-dyyasu7w2k],
.empty-status[b-dyyasu7w2k] {
    margin: 8px 6px 2px;
    padding: 14px 12px;
    border-radius: 12px;
    background: var(--chart-surface-2);
    color: var(--chart-muted);
    font-size: 14px;
}

.missing-series[b-dyyasu7w2k] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 16px;
}

.empty-status[b-dyyasu7w2k] {
    text-align: center;
}

@media (max-width: 390px) {
    .values[b-dyyasu7w2k] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (prefers-color-scheme: dark) {
    .price-history-chart[b-dyyasu7w2k] {
        --chart-surface: var(--surface, #121b25);
        --chart-surface-2: var(--surface-2, #17222e);
        --chart-text: var(--text, #e9f0f6);
        --chart-muted: var(--muted, #92a4b5);
        --chart-line: var(--line, #243445);
        --chart-focus: var(--accent, #2ed3a0);
        --series-0: var(--c-jet, #2ed3a0);
        --series-1: var(--c-walther, #6b9bff);
        --series-2: var(--c-aral, #ffb02e);
        --series-3: var(--c-shell, #ff7a8c);
        --series-4: var(--c-neo, #b79bff);
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
.tankmonitor-home[b-u203013rzn] {
    width: 100%;
    max-width: 440px;
    margin: 0 auto;
    padding: max(14px, env(safe-area-inset-top)) 14px max(28px, env(safe-area-inset-bottom));
    overflow-wrap: anywhere;
}

.page-header[b-u203013rzn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 4px 2px 14px;
}

.brand[b-u203013rzn] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    margin: 0;
    font-size: 19px;
    font-weight: 750;
    letter-spacing: -0.01em;
}

.brand svg[b-u203013rzn] {
    flex: none;
    width: 28px;
    height: 28px;
    color: var(--tm-accent);
}

.last-update[b-u203013rzn] {
    display: inline-flex;
    flex: none;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid var(--tm-line);
    border-radius: 999px;
    background: var(--tm-surface);
    color: var(--tm-muted);
    font: inherit;
    font-size: 13px;
    min-height: 40px;
    white-space: nowrap;
    cursor: pointer;
}

.last-update:focus-visible[b-u203013rzn] {
    outline: 3px solid var(--tm-accent);
    outline-offset: 2px;
}

.last-update:disabled[b-u203013rzn] {
    cursor: wait;
    opacity: 0.7;
}

.last-update svg[b-u203013rzn] {
    width: 16px;
    height: 16px;
}

.dashboard[b-u203013rzn],
.dashboard-grid[b-u203013rzn] {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    min-width: 0;
}

.tankmonitor-home section[b-u203013rzn] {
    margin-bottom: 14px;
}

.tankmonitor-home h2[b-u203013rzn] {
    margin: 0 4px 8px;
    color: var(--tm-muted);
    font-size: 13px;
    font-weight: 650;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.card[b-u203013rzn],
.state-card[b-u203013rzn] {
    border-radius: var(--tm-radius);
    background: var(--tm-surface);
    box-shadow: var(--tm-shadow);
}

.recommendation-card[b-u203013rzn] {
    position: relative;
    overflow: hidden;
    padding: 20px 20px 18px;
    background: linear-gradient(155deg, var(--tm-accent) 0%, var(--tm-accent-strong) 100%);
    color: var(--tm-on-accent);
}

.recommendation-card[b-u203013rzn]::after {
    position: absolute;
    top: -40px;
    right: -40px;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    content: "";
}

.eyebrow[b-u203013rzn] {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    opacity: 0.85;
}

.verdict[b-u203013rzn] {
    margin: 6px 0 14px;
    font-size: clamp(28px, 8.7vw, 34px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.best-price[b-u203013rzn] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.station-summary[b-u203013rzn] {
    min-width: 0;
    font-size: 17px;
    font-weight: 600;
}

.station-summary small[b-u203013rzn] {
    display: block;
    font-size: 14px;
    font-weight: 500;
    opacity: 0.85;
}

.recommendation-price[b-u203013rzn] {
    flex: none;
    font-size: clamp(28px, 9.7vw, 38px);
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
    white-space: nowrap;
}

.recommendation-price small[b-u203013rzn],
.price-value small[b-u203013rzn] {
    margin-left: 4px;
    font-size: 15px;
    font-weight: 600;
    opacity: 0.85;
}

.next-window[b-u203013rzn] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 10px;
    padding: 14px 16px;
}

.window-icon[b-u203013rzn] {
    display: grid;
    flex: none;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 12px;
    background: var(--tm-accent-soft);
    color: var(--tm-accent-strong);
}

.window-icon svg[b-u203013rzn] {
    width: 24px;
    height: 24px;
}

.window-label[b-u203013rzn] {
    color: var(--tm-muted);
    font-size: 13px;
}

.window-time[b-u203013rzn] {
    font-size: 18px;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
}

.window-time--unavailable[b-u203013rzn],
.window-hint[b-u203013rzn] {
    color: var(--tm-muted);
}

.window-hint[b-u203013rzn] {
    margin-top: 1px;
    font-size: 13px;
}

.prices[b-u203013rzn] {
    padding: 6px;
}

.price-row[b-u203013rzn] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 60px;
    padding: 12px;
    border-radius: 12px;
}

.price-row + .price-row[b-u203013rzn] {
    border-top: 1px solid var(--tm-line);
    border-radius: 0;
}

.price-row--best[b-u203013rzn] {
    border-radius: 12px;
    background: var(--tm-accent-soft);
}

.price-row--best + .price-row[b-u203013rzn] {
    border-top-color: transparent;
}

.price-rank[b-u203013rzn] {
    display: grid;
    flex: none;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 50%;
    background: var(--tm-surface-2);
    color: var(--tm-muted);
    font-size: 13px;
    font-weight: 700;
}

.price-row--best .price-rank[b-u203013rzn] {
    background: var(--tm-accent);
    color: var(--tm-on-accent);
}

.station-name[b-u203013rzn] {
    flex: 1;
    min-width: 0;
    font-size: 17px;
    font-weight: 650;
}

.best-tag[b-u203013rzn] {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--tm-surface);
    color: var(--tm-accent-strong);
    font-size: 12px;
    font-weight: 700;
    vertical-align: 2px;
}

.price-delta[b-u203013rzn] {
    min-width: 42px;
    color: var(--tm-muted);
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap;
}

.price-value[b-u203013rzn] {
    font-size: 22px;
    font-weight: 760;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
    text-align: right;
    white-space: nowrap;
}

.price-value small[b-u203013rzn] {
    margin-left: 2px;
    color: var(--tm-muted);
    font-size: 13px;
    font-weight: 600;
}

.unavailable[b-u203013rzn] {
    flex: none;
    color: var(--tm-muted);
    font-size: 13px;
    font-weight: 600;
    text-align: right;
}

.history-placeholder[b-u203013rzn] {
    display: grid;
    gap: 4px;
    min-height: 110px;
    align-content: center;
    padding: 20px;
    color: var(--tm-muted);
    text-align: center;
}

.history-placeholder strong[b-u203013rzn] {
    color: var(--tm-text);
}

.state-card[b-u203013rzn] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px;
}

.state-card h2[b-u203013rzn] {
    margin: 0 0 3px;
    color: var(--tm-text);
}

.state-card p[b-u203013rzn] {
    margin: 0;
    color: var(--tm-muted);
}

.state-symbol[b-u203013rzn] {
    display: grid;
    flex: none;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 12px;
    background: var(--tm-accent-soft);
    color: var(--tm-accent-strong);
    font-size: 22px;
    font-weight: 800;
}

.state-symbol:empty[b-u203013rzn]::after {
    width: 19px;
    height: 19px;
    border: 3px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    content: "";
    animation: loading-b-u203013rzn 0.8s linear infinite;
}

.state-card--error .state-symbol[b-u203013rzn] {
    background: var(--tm-danger-soft);
    color: var(--tm-danger);
}

footer[b-u203013rzn] {
    padding: 6px 12px 0;
    color: var(--tm-muted);
    font-size: 12.5px;
    text-align: center;
}

.visually-hidden[b-u203013rzn] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

@keyframes loading-b-u203013rzn {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .state-symbol:empty[b-u203013rzn]::after {
        animation: none;
    }
}

@media (min-width: 700px) {
    .tankmonitor-home[b-u203013rzn] {
        padding-top: 32px;
    }
}

@media (max-width: 350px) {
    .last-update svg[b-u203013rzn] {
        display: none;
    }

    .best-price[b-u203013rzn] {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .price-row[b-u203013rzn] {
        flex-wrap: wrap;
        gap: 6px 10px;
    }

    .price-delta[b-u203013rzn] {
        order: 4;
        width: 100%;
        padding-right: 2px;
    }

    .unavailable[b-u203013rzn] {
        width: calc(100% - 38px);
    }
}
