<fieldset
  class="cbgp-flare"
  role="group"
  aria-label="Date range"
  onmousemove="event.currentTarget.style.setProperty('--mx', event.offsetX + 'px')"
>
  <legend class="cbgp-sr">Date range</legend>
  <input type="radio" name="cbgp-flare" id="cbgp-flare-1" />
  <label for="cbgp-flare-1">Today</label>
  <input type="radio" name="cbgp-flare" id="cbgp-flare-2" checked />
  <label for="cbgp-flare-2">7 days</label>
  <input type="radio" name="cbgp-flare" id="cbgp-flare-3" />
  <label for="cbgp-flare-3">30 days</label>
  <input type="radio" name="cbgp-flare" id="cbgp-flare-4" />
  <label for="cbgp-flare-4">Custom</label>
</fieldset>

.cbgp-flare {
  --mx: -200px;
  display: inline-flex; gap: 0;
  border: 0; padding: 0;
  background:
    radial-gradient(circle 80px at var(--mx) 50%,
      rgba(255,200,80,0.18), transparent 70%),
    rgba(8,10,18,0.92);
  border: 1px solid rgba(255,200,80,0.18);
  border-radius: 10px;
  overflow: hidden;
  position: relative;
}
.cbgp-flare input { appearance: none; -webkit-appearance: none; position: absolute; opacity: 0; }
.cbgp-flare label {
  padding: 11px 18px;
  font: 700 11px/1 ui-monospace, monospace;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(220,225,230,0.5);
  cursor: pointer;
  position: relative;
  transition: color 0.25s;
  border-right: 1px solid rgba(255,255,255,0.04);
}
.cbgp-flare label:last-of-type { border-right: 0; }
.cbgp-flare label::after {
  content: '';
  position: absolute;
  left: 14px; right: 14px; bottom: 5px;
  height: 2px;
  background: linear-gradient(90deg, #ffc850, #ff5af1);
  border-radius: 2px;
  opacity: 0;
  transform: scaleX(0.4);
  transition: opacity 0.3s, transform 0.3s cubic-bezier(.65,0,.35,1);
  box-shadow: 0 0 8px rgba(255,200,80,0.6);
}
.cbgp-flare label:hover { color: #ffd479; }
.cbgp-flare input:checked + label { color: #fff; }
.cbgp-flare input:checked + label::after { opacity: 1; transform: scaleX(1); }
.cbgp-flare input:focus-visible + label { outline: 2px solid #ffc850; outline-offset: -2px; border-radius: 6px; }