/* ------- sortingBins ------- */
.sb-field{position:relative;height:186px;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden}

.sb-item{position:absolute;width:44px;height:30px;display:grid;place-items:center;
  background:var(--high);border:1px solid var(--line-hard);border-radius:var(--r-sm);
  font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--dim);will-change:top}
.sb-item[data-key="plastika"]{border-color:var(--accent-line);color:var(--accent)}
.sb-item[data-key="guma"]{border-color:var(--line-hard);color:var(--text)}
.sb-item.bad{border-color:var(--danger);color:var(--danger)}

.sb-bins{position:absolute;left:0;right:0;bottom:0;height:36px;display:flex;
  border-top:1px solid var(--line-hard);background:var(--base)}
.sb-bins.swap{border-top-color:var(--accent)}
.sb-bin{flex:1;display:grid;place-items:center;font-size:11px;letter-spacing:.06em;color:var(--micro);
  transition:background 110ms var(--ease),color 110ms var(--ease)}
.sb-bin.hit{background:var(--accent-dim);color:var(--text)}
.sb-bin+.sb-bin{border-left:1px solid var(--line)}

.sb-foot{display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}
.sb-count{font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--accent)}