/* Bandwidth & transfer-time calculator (uses subnet.css for the shared tool look) */
.bw__modes { display: inline-flex; gap: 4px; padding: 4px; margin-bottom: 18px; border-radius: 999px; border: 1px solid var(--line-strong); background: #0b0b0b; }
.bw__modes button { padding: 8px 18px; border: 0; border-radius: 999px; background: none; color: var(--muted); font: 600 0.85rem var(--font-body); cursor: pointer; transition: background 0.25s, color 0.25s; }
.bw__modes button.is-on { background: var(--orange); color: #0a0a0a; }
.bw__combo { display: flex; gap: 8px; }
.bw__combo input { flex: 1 1 auto; min-width: 0; }
.bw__combo select { flex: 0 0 104px; width: 104px !important; }
.bw__pair { flex: 1 1 260px; }
.bw__eff { margin-top: 12px; }
.bw [hidden] { display: none !important; }
.bw__answer { display: flex; flex-direction: column; gap: 4px; margin: 22px 0 16px; padding: 18px 20px; border-radius: 12px; border: 1px solid rgba(255, 107, 0, 0.35); background: radial-gradient(120% 140% at 0% 0%, rgba(255, 107, 0, 0.16), transparent 60%); }
.bw__big { font: 700 clamp(1.6rem, 4.4vw, 2.4rem)/1.1 var(--font-display); color: var(--orange); letter-spacing: -0.01em; }
.bw__small { color: var(--muted); font-size: 0.8rem; }
.bw__sub { margin: 26px 0 12px !important; font-size: 0.78rem !important; font-family: var(--font-mono) !important; letter-spacing: 0.1em; text-transform: uppercase; color: var(--orange) !important; }
.bw__bars, .bw__limits { display: grid; gap: 8px; }
.bw__limits { margin-bottom: 16px; }
.bw__bar { display: grid; grid-template-columns: 170px minmax(0, 1fr) 150px; gap: 12px; align-items: center; font-size: 0.8rem; }
.bw__bar-label { color: var(--muted); }
.bw__bar-track { height: 10px; border-radius: 10px; background: #1a1a1a; overflow: hidden; }
.bw__bar-fill { display: block; height: 100%; border-radius: 10px; background: linear-gradient(90deg, #6b3410, #b35100); transition: width 0.5s cubic-bezier(0.2, 0.7, 0.2, 1); }
.bw__bar-time { color: var(--text); text-align: right; }
.bw__bar.is-mine .bw__bar-label, .bw__bar.is-mine .bw__bar-time { color: var(--orange); }
.bw__bar.is-mine .bw__bar-fill { background: linear-gradient(90deg, var(--orange), #ffb36b); box-shadow: 0 0 12px var(--orange-glow); }
.sc.is-stale .bw__answer, .sc.is-stale .bw__bars, .sc.is-stale .bw__limits { opacity: 0.35; filter: grayscale(0.6); }
@media (max-width: 600px) {
  .bw__bar { grid-template-columns: 92px minmax(0, 1fr); row-gap: 2px; }
  .bw__bar-time { grid-column: 2; text-align: left; font-size: 0.74rem; }
  .bw__combo select { flex-basis: 92px; width: 92px !important; }
}
@media print { .bw__modes { display: none !important; } .bw__answer { background: #fff7f0 !important; } .bw__big { color: #b34a00 !important; } }
