/* Reset */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* Telegram theme integration */
body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background-color: var(--tg-theme-bg-color, #ffffff);
    color: var(--tg-theme-text-color, #000000);
    min-height: 100vh;
    padding-bottom: 70px;
    -webkit-font-smoothing: antialiased;
}

#app {
    max-width: 100%;
    overflow-x: hidden;
}

#page-content {
    padding: 12px 16px;
    min-height: calc(100vh - 70px);
}

/* Bottom navigation */
#bottom-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    background-color: var(--tg-theme-secondary-bg-color, #f0f0f0);
    border-top: 1px solid var(--tg-theme-section-separator-color, #e0e0e0);
    padding: 4px 0;
    padding-bottom: max(4px, env(safe-area-inset-bottom));
    z-index: 100;
}

.nav-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 6px 4px;
    text-decoration: none;
    color: var(--tg-theme-hint-color, #999999);
    font-size: 10px;
    transition: color 0.2s;
    -webkit-tap-highlight-color: transparent;
}

.nav-item.active {
    color: var(--tg-theme-link-color, #2481cc);
}

.nav-icon {
    font-size: 20px;
    line-height: 1;
    margin-bottom: 2px;
}

.nav-label {
    font-size: 10px;
    line-height: 1;
}

/* Cards */
.card {
    background-color: var(--tg-theme-secondary-bg-color, #f5f5f5);
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 10px;
}

.card-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--tg-theme-subtitle-text-color, var(--tg-theme-hint-color, #999));
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}

/* Metric cards */
.metrics-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-bottom: 12px;
}

.metric-card {
    background-color: var(--tg-theme-secondary-bg-color, #f5f5f5);
    border-radius: 12px;
    padding: 12px;
    text-align: center;
}

.metric-value {
    font-size: 24px;
    font-weight: 700;
    color: var(--tg-theme-text-color, #000);
    line-height: 1.2;
}

.metric-label {
    font-size: 11px;
    color: var(--tg-theme-hint-color, #999);
    margin-top: 2px;
}

/* Section */
.section {
    margin-bottom: 16px;
}

.section-header {
    font-size: 13px;
    font-weight: 600;
    color: var(--tg-theme-section-header-text-color, var(--tg-theme-hint-color, #999));
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0 4px;
    margin-bottom: 8px;
}

/* Lists */
.list {
    background-color: var(--tg-theme-secondary-bg-color, #f5f5f5);
    border-radius: 12px;
    overflow: hidden;
}

.list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 0.5px solid var(--tg-theme-section-separator-color, #e0e0e0);
    cursor: pointer;
    transition: background-color 0.15s;
    -webkit-tap-highlight-color: transparent;
}

.list-item:last-child {
    border-bottom: none;
}

.list-item:active {
    background-color: var(--tg-theme-bg-color, #fff);
}

.list-item-text {
    flex: 1;
    min-width: 0;
}

.list-item-title {
    font-size: 15px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.list-item-subtitle {
    font-size: 13px;
    color: var(--tg-theme-hint-color, #999);
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.list-item-value {
    font-size: 15px;
    color: var(--tg-theme-hint-color, #999);
    margin-left: 12px;
    white-space: nowrap;
}

.list-item-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    margin-left: 8px;
}

.badge-green {
    background-color: #34c75920;
    color: #34c759;
}

.badge-red {
    background-color: #ff3b3020;
    color: #ff3b30;
}

.badge-orange {
    background-color: #ff950020;
    color: #ff9500;
}

/* Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: opacity 0.2s;
    -webkit-tap-highlight-color: transparent;
}

.btn:active {
    opacity: 0.7;
}

.btn-primary {
    background-color: var(--tg-theme-button-color, #2481cc);
    color: var(--tg-theme-button-text-color, #fff);
}

.btn-danger {
    background-color: #ff3b30;
    color: #fff;
}

.btn-danger-outline {
    background-color: transparent;
    color: #ff3b30;
    border: 1px solid #ff3b30;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 13px;
    cursor: pointer;
}
.btn-danger-outline:hover { background-color: rgba(255, 59, 48, 0.1); }

.btn-sm {
    padding: 6px 12px;
    font-size: 13px;
    border-radius: 8px;
}

.btn-block {
    display: flex;
    width: 100%;
}

/* Inputs */
.input-group {
    margin-bottom: 12px;
}

.input-label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: var(--tg-theme-hint-color, #999);
    margin-bottom: 4px;
    padding-left: 4px;
}

.input {
    width: 100%;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid var(--tg-theme-section-separator-color, #e0e0e0);
    background-color: var(--tg-theme-secondary-bg-color, #f5f5f5);
    color: var(--tg-theme-text-color, #000);
    font-size: 15px;
    outline: none;
    transition: border-color 0.2s;
}

.input:focus {
    border-color: var(--tg-theme-link-color, #2481cc);
}

/* Search */
.search-bar {
    position: sticky;
    top: 0;
    background-color: var(--tg-theme-bg-color, #fff);
    padding: 8px 0;
    z-index: 10;
    margin-bottom: 8px;
}

.search-input {
    width: 100%;
    padding: 10px 14px;
    border-radius: 10px;
    border: none;
    background-color: var(--tg-theme-secondary-bg-color, #f5f5f5);
    color: var(--tg-theme-text-color, #000);
    font-size: 15px;
    outline: none;
}

.search-input::placeholder {
    color: var(--tg-theme-hint-color, #999);
}

/* Toggle */
.toggle-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 0.5px solid var(--tg-theme-section-separator-color, #e0e0e0);
}

.toggle-row:last-child {
    border-bottom: none;
}

.toggle {
    position: relative;
    width: 44px;
    height: 26px;
    flex-shrink: 0;
}

.toggle input {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider {
    position: absolute;
    inset: 0;
    border-radius: 13px;
    background-color: var(--tg-theme-section-separator-color, #e0e0e0);
    transition: background-color 0.3s;
    cursor: pointer;
}

.toggle-slider::before {
    content: '';
    position: absolute;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    top: 2px;
    left: 2px;
    transition: transform 0.3s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.toggle input:checked + .toggle-slider {
    background-color: #34c759;
}

.toggle input:checked + .toggle-slider::before {
    transform: translateX(18px);
}

/* Tabs */
.tabs {
    display: flex;
    background-color: var(--tg-theme-secondary-bg-color, #f5f5f5);
    border-radius: 10px;
    padding: 2px;
    margin-bottom: 12px;
}

.tab {
    flex: 1;
    padding: 8px 12px;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    color: var(--tg-theme-hint-color, #999);
    transition: all 0.2s;
    border: none;
    background: transparent;
    -webkit-tap-highlight-color: transparent;
}

.tab.active {
    background-color: var(--tg-theme-bg-color, #fff);
    color: var(--tg-theme-text-color, #000);
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

/* Loading */
.loading {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px;
    color: var(--tg-theme-hint-color, #999);
}

.spinner {
    width: 24px;
    height: 24px;
    border: 3px solid var(--tg-theme-section-separator-color, #e0e0e0);
    border-top-color: var(--tg-theme-link-color, #2481cc);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin-right: 10px;
}

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

/* Empty state */
.empty-state {
    text-align: center;
    padding: 40px 20px;
    color: var(--tg-theme-hint-color, #999);
}

.empty-state-icon {
    font-size: 48px;
    margin-bottom: 12px;
}

.empty-state-text {
    font-size: 15px;
}

/* Product detail */
.product-detail-header {
    margin-bottom: 16px;
}

.product-detail-header h2 {
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 4px;
}

.product-detail-header .offer-id {
    font-size: 13px;
    color: var(--tg-theme-hint-color, #999);
    font-family: monospace;
}

/* Inline row */
.inline-row {
    display: flex;
    gap: 8px;
    align-items: center;
}

.inline-row .input {
    flex: 1;
}

/* Tags */
.tag {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    background-color: var(--tg-theme-secondary-bg-color, #f5f5f5);
    color: var(--tg-theme-hint-color, #999);
}

.tag-summer { background-color: #ff950020; color: #ff9500; }
.tag-winter { background-color: #007aff20; color: #007aff; }
.tag-studless { background-color: #5856d620; color: #5856d6; }
.tag-allseason { background-color: #34c75920; color: #34c759; }

/* Pagination */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding: 16px 0;
}

.pagination-info {
    font-size: 13px;
    color: var(--tg-theme-hint-color, #999);
}

/* ═══ Dashboard ═══ */

.dash-hero {
    text-align: center;
    padding: 20px 0 8px;
}

.dash-hero-value {
    font-size: 42px;
    font-weight: 800;
    color: var(--tg-theme-text-color, #000);
    line-height: 1;
}

.dash-hero-label {
    font-size: 14px;
    color: var(--tg-theme-hint-color, #999);
    margin-top: 4px;
}

/* Stat pills row */
.dash-stats-row {
    display: flex;
    gap: 6px;
    margin: 14px 0 16px;
}

.dash-pill {
    flex: 1;
    text-align: center;
    padding: 10px 4px;
    border-radius: 12px;
}

.dash-pill-value {
    display: block;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
}

.dash-pill-label {
    display: block;
    font-size: 10px;
    margin-top: 2px;
    opacity: 0.8;
}

.dash-pill-green { background: #34c75915; color: #34c759; }
.dash-pill-red { background: #ff3b3015; color: #ff3b30; }
.dash-pill-orange { background: #ff950015; color: #ff9500; }
.dash-pill-muted {
    background: var(--tg-theme-secondary-bg-color, #f5f5f5);
    color: var(--tg-theme-hint-color, #999);
}

/* Dashboard card */
.dash-card {
    background: var(--tg-theme-secondary-bg-color, #f5f5f5);
    border-radius: 14px;
    padding: 16px;
    margin-bottom: 12px;
}

.dash-card-header {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: var(--tg-theme-section-header-text-color, var(--tg-theme-hint-color, #999));
    margin-bottom: 12px;
}

/* Key-value grid */
.dash-kv-grid {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.dash-kv-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 7px 0;
    border-bottom: 0.5px solid var(--tg-theme-section-separator-color, rgba(0,0,0,0.08));
}

.dash-kv-row:last-child { border-bottom: none; }

.dash-kv-label {
    font-size: 14px;
    color: var(--tg-theme-text-color, #000);
}

.dash-kv-value {
    font-size: 14px;
    font-weight: 600;
    color: var(--tg-theme-text-color, #000);
}

/* Marketplace block */
.dash-mp-block {
    padding: 12px 0;
    border-bottom: 0.5px solid var(--tg-theme-section-separator-color, rgba(0,0,0,0.08));
}

.dash-mp-block:last-child { border-bottom: none; }

.dash-mp-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.dash-mp-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.dash-mp-name {
    font-size: 15px;
    font-weight: 600;
    color: var(--tg-theme-text-color, #000);
}

.dash-mp-total {
    margin-left: auto;
    font-size: 14px;
    font-weight: 600;
    color: var(--tg-theme-text-color, #000);
}

.dash-mp-details {
    padding-left: 18px;
}

.dash-mp-row {
    display: flex;
    justify-content: space-between;
    padding: 3px 0;
}

.dash-mp-row-label {
    font-size: 13px;
    color: var(--tg-theme-hint-color, #888);
}

.dash-mp-row-value {
    font-size: 13px;
    font-weight: 600;
}

/* Supplier block */
.dash-supplier {
    padding: 14px 0;
    border-bottom: 0.5px solid var(--tg-theme-section-separator-color, rgba(0,0,0,0.08));
}

.dash-supplier:last-child { border-bottom: none; }

.dash-supplier-disabled { opacity: 0.5; }

.dash-supplier-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
}

.dash-supplier-status { font-size: 10px; }

.dash-supplier-name {
    font-size: 15px;
    font-weight: 600;
    color: var(--tg-theme-text-color, #000);
}

.dash-supplier-badge-off {
    margin-left: auto;
    font-size: 11px;
    font-weight: 600;
    color: #ff3b30;
    background: #ff3b3015;
    padding: 2px 8px;
    border-radius: 6px;
}

.dash-supplier-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    margin-bottom: 10px;
}

.dash-supplier-stat {
    text-align: center;
    padding: 8px 4px;
    background: var(--tg-theme-bg-color, #fff);
    border-radius: 10px;
}

.dash-supplier-stat-value {
    font-size: 18px;
    font-weight: 700;
    color: var(--tg-theme-text-color, #000);
    line-height: 1.2;
}

.dash-supplier-stat-label {
    font-size: 10px;
    color: var(--tg-theme-hint-color, #999);
    margin-top: 2px;
}

.dash-supplier-details {
    padding-left: 4px;
}

.dash-supplier-mp-row {
    display: flex;
    justify-content: space-between;
    padding: 3px 0;
    font-size: 13px;
    color: var(--tg-theme-hint-color, #888);
}

.dash-supplier-mp-row span:last-child {
    font-weight: 600;
    color: var(--tg-theme-text-color, #000);
}

/* Dashboard color helpers */
/* Spoiler (disabled suppliers) */
.spoiler-toggle {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 6px 0;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    border-bottom: 0.5px solid var(--tg-theme-section-separator-color, #e0e0e0);
}

.spoiler-dots {
    font-size: 18px;
    letter-spacing: 3px;
    color: var(--tg-theme-hint-color, #999);
    line-height: 1;
}

.spoiler-content {
    display: none;
}

.spoiler-content.spoiler-open {
    display: block;
}

/* ═══ Duplicates ═══ */

.dup-card {
    background: var(--tg-theme-secondary-bg-color, #f5f5f5);
    border-radius: 14px;
    padding: 14px;
    margin-bottom: 12px;
}

.dup-card-confirmed { opacity: 0.6; }

.dup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.dup-header-left { display: flex; align-items: center; gap: 8px; }

.dup-badge {
    font-size: 11px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 6px;
}

.dup-badge-pending { background: #ff950020; color: #ff9500; }
.dup-badge-confirmed { background: #34c75920; color: #34c759; }

.dup-count {
    font-size: 12px;
    color: var(--tg-theme-hint-color, #999);
}

.dup-product {
    background: var(--tg-theme-bg-color, #fff);
    border-radius: 10px;
    padding: 10px 12px;
    margin-bottom: 6px;
}

.dup-product-primary { border-left: 3px solid var(--tg-theme-link-color, #2481cc); }

.dup-product-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--tg-theme-link-color, #2481cc);
    margin-bottom: 6px;
}

.dup-product-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}

.dup-reason-tag {
    font-size: 10px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
    background: var(--tg-theme-secondary-bg-color, #f0f0f0);
    color: var(--tg-theme-hint-color, #999);
}

.dup-separator {
    text-align: center;
    font-size: 11px;
    color: var(--tg-theme-hint-color, #999);
    padding: 4px 0;
}

.dup-info-name {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 2px;
}

.dup-info-id {
    font-size: 12px;
    font-family: monospace;
    color: var(--tg-theme-hint-color, #999);
    margin-bottom: 4px;
}

.dup-info-details {
    font-size: 13px;
    color: var(--tg-theme-text-color, #000);
    margin-bottom: 4px;
}

.dup-info-specs {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 6px;
}

.dup-spec {
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 4px;
    background: var(--tg-theme-secondary-bg-color, #f0f0f0);
    color: var(--tg-theme-hint-color, #888);
}

.dup-info-suppliers {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.dup-supplier-chip {
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 4px;
    background: var(--tg-theme-link-color, #2481cc)15;
    color: var(--tg-theme-link-color, #2481cc);
}

.dup-confirm-btn { margin-top: 8px; }

.dash-green { color: #34c759 !important; }
.dash-orange { color: #ff9500 !important; }
.dash-red { color: #ff3b30 !important; }
.dash-muted { color: var(--tg-theme-hint-color, #999) !important; }
.dash-hidden { display: none; }

/* Review */
.review-card { background: var(--tg-theme-secondary-bg-color, #f5f5f5); border-radius: 12px; padding: 12px; margin-bottom: 10px; }
.review-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.review-offerid { font-weight: 600; font-size: 14px; }
.review-name { font-size: 12px; color: var(--tg-theme-hint-color, #999); margin-bottom: 8px; }
.review-sources { background: var(--tg-theme-bg-color, #fff); border-radius: 8px; padding: 8px; margin-bottom: 8px; }
.review-source-line { font-size: 11px; color: var(--tg-theme-hint-color, #888); margin-bottom: 2px; word-break: break-all; }
.review-table { font-size: 13px; margin-bottom: 8px; }
.review-row { display: grid; grid-template-columns: 80px 1fr 1fr; gap: 4px; padding: 3px 0; border-bottom: 1px solid rgba(128,128,128,0.1); }
.review-label { color: var(--tg-theme-hint-color, #999); font-size: 12px; }
.review-val { font-size: 12px; }
.review-diff { background: rgba(255,149,0,0.08); border-radius: 4px; padding: 3px 4px; }
.review-diff .review-val { font-weight: 600; }
.review-actions { display: flex; gap: 8px; }
.tag-orange { background: rgba(255,149,0,0.15); color: #ff9500; font-size: 11px; padding: 2px 8px; border-radius: 10px; }
.badge { background: #ff9500; color: #fff; font-size: 12px; padding: 1px 8px; border-radius: 10px; margin-left: 6px; }
.btn-sm { padding: 6px 14px; border: none; border-radius: 8px; font-size: 13px; background: var(--tg-theme-button-color, #3390ec); color: var(--tg-theme-button-text-color, #fff); cursor: pointer; }

/* Charts */
.dash-charts-section { margin-bottom: 12px; }
.dash-charts-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 10px;
}
.dash-charts-grid > * {
    min-width: 0;
    min-height: 0;
}
.dash-chart-card {
    background: var(--tg-theme-secondary-bg-color, #f5f5f5);
    border-radius: 12px;
    padding: 10px;
    overflow: hidden;
    box-sizing: border-box;
}
.dash-chart-card.full-width {
    grid-column: 1 / -1;
}
.dash-chart-title {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
    color: var(--tg-theme-text-color, #000);
}
.dash-chart-container {
    position: relative;
    width: 100%;
    height: 220px;
}
.dash-chart-container.tall {
    height: 260px;
}
.dash-chart-container canvas {
    max-width: 100% !important;
}

/* Skeleton loader */
.dash-chart-skeleton {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 8px;
    background: linear-gradient(
        90deg,
        rgba(128, 128, 128, 0.08) 0%,
        rgba(128, 128, 128, 0.18) 50%,
        rgba(128, 128, 128, 0.08) 100%
    );
    background-size: 200% 100%;
    animation: dash-shimmer 1.4s ease-in-out infinite;
}
.dash-chart-container.loaded .dash-chart-skeleton {
    display: none;
}
.dash-chart-container .dash-chart-skeleton.donut::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background:
        radial-gradient(circle at center, transparent 38%, rgba(128,128,128,0.18) 39%, rgba(128,128,128,0.18) 70%, transparent 71%);
}
.dash-chart-container .dash-chart-skeleton.bars {
    background: transparent;
    animation: none;
}
.dash-chart-container .dash-chart-skeleton.bars::before {
    content: '';
    position: absolute;
    inset: 16px 12px;
    background:
        linear-gradient(to top, rgba(128,128,128,0.22) 70%, transparent 70%) 8% 100% / 10% 70% no-repeat,
        linear-gradient(to top, rgba(128,128,128,0.22) 50%, transparent 50%) 24% 100% / 10% 50% no-repeat,
        linear-gradient(to top, rgba(128,128,128,0.22) 85%, transparent 85%) 40% 100% / 10% 85% no-repeat,
        linear-gradient(to top, rgba(128,128,128,0.22) 60%, transparent 60%) 56% 100% / 10% 60% no-repeat,
        linear-gradient(to top, rgba(128,128,128,0.22) 75%, transparent 75%) 72% 100% / 10% 75% no-repeat,
        linear-gradient(to top, rgba(128,128,128,0.22) 40%, transparent 40%) 88% 100% / 10% 40% no-repeat;
    animation: dash-shimmer-opacity 1.4s ease-in-out infinite;
}
.dash-chart-container .dash-chart-skeleton.line {
    background: transparent;
    animation: none;
}
.dash-chart-container .dash-chart-skeleton.line::before {
    content: '';
    position: absolute;
    inset: 16px 12px;
    background:
        linear-gradient(135deg, transparent 48%, rgba(128,128,128,0.25) 49%, rgba(128,128,128,0.25) 51%, transparent 52%);
    animation: dash-shimmer-opacity 1.4s ease-in-out infinite;
}
@keyframes dash-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
@keyframes dash-shimmer-opacity {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}
.dash-charts-error {
    text-align: center;
    padding: 16px;
    color: var(--tg-theme-hint-color, #999);
    font-size: 12px;
}

/* Marketplace details skeleton */
.dash-mp-skeleton-row {
    padding: 4px 0;
}
.dash-mp-skeleton-line {
    display: block;
    height: 14px;
    width: 70%;
    border-radius: 6px;
    background: linear-gradient(
        90deg,
        rgba(128, 128, 128, 0.08) 0%,
        rgba(128, 128, 128, 0.20) 50%,
        rgba(128, 128, 128, 0.08) 100%
    );
    background-size: 200% 100%;
    animation: dash-shimmer 1.4s ease-in-out infinite;
}
.dash-mp-skeleton-line.short { width: 40%; }
@media (max-width: 420px) {
    .dash-charts-grid {
        grid-template-columns: 1fr;
    }
    .dash-chart-container {
        height: 200px;
    }
    .dash-chart-container.tall {
        height: 240px;
    }
}