.statistics-page { --stats-green:#71d4a8; --stats-green-rgb:72,181,130; --stats-muted:var(--muted); }
.statistics-page [data-metric="spending"] { --metric:#b7a0f7; --metric-rgb:163,127,237; }
.statistics-page [data-metric="used"] { --metric:#86baff; --metric-rgb:82,150,236; }
.statistics-page [data-metric="savings"] { --metric:#71d4a8; --metric-rgb:72,181,130; }
.statistics-page [data-metric="waste"] { --metric:#f5a397; --metric-rgb:232,119,101; }
.stats-impact-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:20px; margin-bottom:40px; }
.stats-impact-side { display:grid; gap:18px; }
.statistics-page .glass::before,.statistics-page .glass::after { display:none; }
.statistics-page .glass { backdrop-filter:none; -webkit-backdrop-filter:none; }
.statistics-page .stats-rescue { padding:32px; border:1px solid #66cc9955; background:linear-gradient(120deg,#48b58222,#48b58205); box-shadow:0 15px 35px #162c2310; }
.stats-impact-tag { display:flex; align-items:center; gap:9px; font-size:11px; letter-spacing:1.7px; color:var(--stats-green); font-weight:600; }
.stats-impact-tag .icon { width:18px; height:18px; }
.stats-rescue h2 { margin:24px 0 4px; font-size:22px; font-weight:400; }
.stats-impact-value { display:block; font-size:clamp(32px,4vw,52px); font-weight:500; letter-spacing:-1.5px; line-height:1.3; }
.stats-rescue > p { max-width:420px; margin:14px 0 24px; color:var(--stats-muted); line-height:1.6; font-size:15px; }
.stats-attribution { display:flex; align-items:center; gap:12px; padding:16px 0; border-top:1px solid #71d4a833; color:var(--stats-green); font-size:14px; line-height:1.6; }
.stats-attribution > .icon { flex-shrink:0; width:21px; }
.stats-attribution strong { font-size:22px; font-weight:500; margin-right:5px; white-space:nowrap; }
.stats-rescue > small { display:block; max-width:460px; color:var(--stats-muted); font-size:12px; line-height:1.65; }
.statistics-page .stats-loss { padding:24px 28px; border:1px solid #dba27833; background:linear-gradient(120deg,#dba2780d,transparent); }
.stats-loss .stats-impact-tag { color:#e2b889; }
.stats-loss h2 { font-size:15px; margin:18px 0 4px; font-weight:400; }
.stats-loss .stats-impact-value { display:inline-block; font-size:34px; margin-right:16px; }
.stats-loss p { font-size:13px; line-height:1.6; color:var(--stats-muted); margin:12px 0 0; }
.stats-comparison { display:inline-block; font-size:12px; color:var(--stats-muted); }
.stats-comparison.positive { color:var(--stats-green); }
.stats-comparison.negative { color:#f5a397; }
.statistics-page .stats-meals { padding:22px 28px; display:flex; align-items:flex-start; gap:18px; border:1px solid #86baff33; background:linear-gradient(120deg,#86baff0d,transparent); }
.stats-meals-icon { padding:12px; border-radius:16px; background:#86baff16; color:#86baff; }
.stats-meals-icon .icon { width:25px; height:25px; }
.stats-meals strong { font-size:30px; line-height:1; font-weight:500; }
.stats-meals h2 { display:inline; font-size:16px; font-weight:400; margin-left:7px; }
.stats-meals p { font-size:12px; line-height:1.6; color:var(--stats-muted); margin:10px 0 0; }
.stats-section-title { display:flex; align-items:baseline; justify-content:space-between; gap:14px; margin-bottom:18px; }
.stats-section-title h2 { font-size:21px; margin:0; font-weight:500; }
.stats-section-title > span { color:var(--stats-muted); font-size:13px; }
.statistics-page .stat-cards { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
:root .statistics-page .stat-card { position:relative; border:1px solid rgba(var(--metric-rgb),.3); border-top:3px solid var(--metric); background:linear-gradient(150deg,rgba(var(--metric-rgb),.4),rgba(var(--metric-rgb),.05)); padding:20px; box-shadow:none; border-radius:18px; }
:root .statistics-page .stat-card:hover { background:rgba(var(--metric-rgb),.35); transform:translateY(-5px); }
:root .statistics-page .stat-card.active { border-color:var(--metric); background:rgba(var(--metric-rgb),.15); box-shadow:0 0 0 2px rgba(var(--metric-rgb),.12); transform: translateY(-5px);}
:root .statistics-page .stat-card .stat-card-head { color:var(--text); font-size:14px; gap:8px; line-height:1.4; }
.stats-card-icon { display:grid; place-items:center; padding:8px; background:rgba(var(--metric-rgb),.13); border-radius:11px; flex-shrink:0; }
:root .statistics-page .stat-card .icon { color:var(--metric); width:18px; height:18px; }
:root .statistics-page .stat-card strong { color:var(--text); font-size:clamp(23px,2.3vw,33px); margin-top:20px; }
:root .statistics-page .stat-card small { color:var(--stats-muted); font-size:12px; line-height:1.6; min-height:39px; margin-top:8px; }
.stats-card-select { display:flex; align-items:center; gap:6px; color:var(--metric); font-size:11px; margin-top:18px; }
.stats-card-select .icon { width:13px!important; height:13px!important; }
.statistics-page .stats-chart { border:1px solid rgba(var(--metric-rgb),.35); background:linear-gradient(140deg,rgba(var(--metric-rgb),.35),transparent); }
.statistics-page .chart-legend { color:var(--metric); }
.statistics-page .chart-legend::before { background:var(--metric); width:9px; height:9px; }
.stats-chart-explanation { display:flex; align-items:flex-start; gap:10px; padding:13px 16px; margin-top:20px; border-radius:12px; background:rgba(var(--metric-rgb),.08); }
.stats-chart-explanation .icon { width:18px; height:18px; flex-shrink:0; color:var(--metric); margin-top:2px; }
.stats-chart-explanation p { margin:0; color:var(--stats-muted); font-size:13px; line-height:1.6; }
:root .statistics-page .stats-chart .bar { background:linear-gradient(to top,rgba(var(--metric-rgb),.18),rgba(var(--metric-rgb),.82)); border-color:rgba(var(--metric-rgb),.55); min-height:0; }
:root .statistics-page .stats-chart .bar:hover { background:var(--metric); }
:root .statistics-page .stats-chart .bar.is-zero { border:0; }
:root .statistics-page .stats-chart .bar-value { color:var(--metric); opacity:1; font-size:12px; }
.stats-chart-empty { min-height:235px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:30px; }
.stats-chart-empty > .icon { width:36px; height:36px; color:var(--metric); opacity:.75; margin-bottom:16px; }
.stats-chart-empty h3 { font-size:18px; font-weight:500; margin:0; }
.stats-chart-empty p { max-width:400px; color:var(--stats-muted); font-size:14px; line-height:1.6; }
.stats-guide { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; margin:26px 0 10px; }
.stats-guide article { display:flex; align-items:flex-start; gap:12px; }
.stats-guide article > .icon { width:19px; height:19px; color:var(--stats-muted); flex-shrink:0; margin-top:2px; }
.stats-guide h3 { font-size:13px; font-weight:600; margin:0 0 7px; line-height:1.5; }
.stats-guide p { font-size:12px; line-height:1.7; color:var(--stats-muted); margin:0; }
.statistics-page button:focus-visible { outline:3px solid var(--metric,var(--stats-green)); outline-offset:4px; }
:root[data-theme="light"] .statistics-page { --stats-green:#257b53; --stats-muted:#526475; }
:root[data-theme="light"] .statistics-page [data-metric="spending"] { --metric:#7652bc; }
:root[data-theme="light"] .statistics-page [data-metric="used"] { --metric:#286fbe; }
:root[data-theme="light"] .statistics-page [data-metric="savings"] { --metric:#257b53; }
:root[data-theme="light"] .statistics-page [data-metric="waste"] { --metric:#b64e40; }
:root[data-theme="light"] .statistics-page .stats-rescue { background:linear-gradient(120deg,#e4f4edcc,#f7fcf5aa); }
:root[data-theme="light"] .statistics-page .stats-loss { background:#fff7ed77; }
:root[data-theme="light"] .statistics-page .stats-meals { background:#edf5ff99; }
:root[data-theme="light"] .stats-loss .stats-impact-tag { color:#8d6431; }
:root[data-theme="light"] .stats-meals-icon { color:#286fbe; }
:root[data-theme="light"] .stats-comparison.negative { color:#b64e40; }
@media(max-width:1100px) {
  .statistics-page .stat-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stats-impact-grid { grid-template-columns:1fr 1fr; }
  .stats-meals h2 { display:block; margin:8px 0 0; }
  .stats-guide { gap:16px; }
}
@media(max-width:700px) {
  .stats-impact-grid { grid-template-columns:minmax(0,1fr); gap:14px; margin-bottom:28px; }
  .stats-impact-side { gap:14px; }
  .statistics-page .stats-rescue,.statistics-page .stats-loss,.statistics-page .stats-meals { padding:22px; }
  .stats-section-title { align-items:flex-start; flex-direction:column; gap:8px; }
  .stats-section-title h2 { font-size:20px; }
  .statistics-page .stat-cards { gap:10px; }
  :root .statistics-page .stat-card { padding:15px 12px; }
  :root .statistics-page .stat-card strong { font-size:24px; }
  :root .statistics-page .stat-card .stat-card-head { font-size:12px; }
  .stats-card-icon { padding:6px; }
  .stats-card-select { font-size:10px; }
  .stats-guide { grid-template-columns:1fr; gap:20px; }
  .stats-impact-value { font-size:42px; }
  .stats-meals h2 { display:inline; margin-left:7px; }
  .statistics-page .large-chart { padding:22px 16px; }
  .statistics-page .bars-chart { gap:10px; }
  :root .statistics-page .stats-chart .bar-value { font-size:10px; }
  .stats-impact-tag { font-size:10px; letter-spacing:1px; }
}
@media(prefers-reduced-motion:reduce) {
  .statistics-page .stat-card,.statistics-page .bar { transition:none; }
}
