/* Smoking */
.smoke-grid-5 { display:grid; grid-template-columns: repeat(6, 1fr); gap:0.5rem; margin-bottom:1rem; }
.smoke-grid-3 { display:grid; grid-template-columns: repeat(3, 1fr); gap:0.5rem; }
.smoke-box {
  background:rgba(255,255,255,0.05); border-radius:0.75rem; padding:0.5rem; text-align:center;
}
.smoke-box .num { font-size:1.25rem; font-weight:700; color:#fff; font-variant-numeric:tabular-nums; }
.smoke-box .lbl { font-size:0.625rem; color:rgba(255,255,255,0.5); text-transform:uppercase; }
.smoke-card {
  display:flex; align-items:center; gap:0.75rem;
  border-radius:0.75rem; padding:0.75rem;
}
.smoke-card.emerald { background:rgba(16,185,129,0.1); border:1px solid rgba(52,211,153,0.2); }
.smoke-card.amber { background:rgba(245,158,11,0.1); border:1px solid rgba(251,191,36,0.2); }
.smoke-card.sky { background:rgba(14,165,233,0.1); border:1px solid rgba(56,189,248,0.2); }
.smoke-card .lbl { font-size:0.75rem; color:rgba(255,255,255,0.5); }
.smoke-card .val { font-size:1.25rem; font-weight:700; color:#fff; }
.smoke-card-body { display:flex; flex-direction:column; gap:0.25rem; min-width:0; }

.smoke-packs-compare {
  font-size:0.6875rem;
  line-height:1.3;
  color:rgba(255,255,255,0.55);
  margin-top:0.125rem;
  display:flex;
  align-items:center;
  gap:0.375rem;
  flex-wrap:wrap;
}
.smoke-packs-compare .spacer { color:rgba(255,255,255,0.25); }

.smoke-money-compare {
  font-size:0.6875rem;
  line-height:1.3;
  color:rgba(255,255,255,0.6);
  margin-top:0.125rem;
}
.sm-money-eq {
  font-weight:600;
  color:#fbbf24;
}
.sm-money-next {
  font-size:0.625rem;
  color:rgba(255,255,255,0.45);
}

.smoke-distance-compare {
  font-size:0.6875rem;
  line-height:1.3;
  color:rgba(255,255,255,0.6);
  margin-top:0.125rem;
}
.sd-compare-eq {
  font-weight:600;
  color:#38bdf8;
}
.sd-compare-next {
  font-size:0.625rem;
  color:rgba(255,255,255,0.45);
}
.sd-progress {
  width:100%;
  height:3px;
  background:rgba(255,255,255,0.1);
  border-radius:9999px;
  margin-top:0.375rem;
  overflow:hidden;
}
.sd-progress-fill {
  height:100%;
  background:linear-gradient(90deg, #38bdf8, #0ea5e9);
  border-radius:9999px;
  transition:width 0.4s ease;
  width:0%;
}

/* Theme light overrides */
body.theme-light .smoke-box { background: rgba(0,0,0,0.06); }
body.theme-light .smoke-box .num { color: #0f172a; }
body.theme-light .smoke-box .lbl { color: rgba(0,0,0,0.65); }
body.theme-light .smoke-card .lbl { color: rgba(0,0,0,0.65); }
body.theme-light .smoke-card .val { color: #0f172a; }
body.theme-light .smoke-distance-compare { color: rgba(0,0,0,0.55); }
body.theme-light .sd-compare-eq { color: #0284c7; }
body.theme-light .sd-compare-next { color: rgba(0,0,0,0.5); }
body.theme-light .smoke-packs-compare { color: rgba(0,0,0,0.55); }
body.theme-light .smoke-packs-compare .spacer { color: rgba(0,0,0,0.25); }
body.theme-light .smoke-money-compare { color: rgba(0,0,0,0.55); }
body.theme-light .sm-money-eq { color: #d97706; }
body.theme-light .sm-money-next { color: rgba(0,0,0,0.5); }
body.theme-light .sd-progress { background: rgba(0,0,0,0.08); }
body.theme-light .sd-progress-fill { background: linear-gradient(90deg, #0284c7, #0ea5e9); }