.dphs-sort-bar { margin: 0 0 16px; }
.dphs-sort-bar::after { content: ""; display: table; clear: both; }
.dphs-sort { position: relative; display: block; float: right; font-size: 13px; }
.dphs-toggle { display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  background: transparent; border: 0; padding: 4px 2px;
  color: #eee; line-height: 1.2; font: inherit; }
.dphs-toggle:hover { color: #fff; }
.dphs-prefix { color: #eee; }
.dphs-current { font-weight: 700; color: #fff; }
.dphs-arrow { width: 8px; height: 8px; margin-left: 2px; border-right: 2px solid #ccc;
  border-bottom: 2px solid #ccc; transform: translateY(-2px) rotate(45deg);
  transition: transform .15s ease; }
.dphs-sort.open .dphs-arrow { transform: translateY(1px) rotate(-135deg); }
.dphs-menu { position: absolute; right: 0; top: 100%; min-width: 170px; margin: 4px 0 0; padding: 4px 0;
  list-style: none; background: #272727; border: 1px solid #404040; border-radius: 4px;
  box-shadow: 0 6px 18px rgba(0,0,0,.5); z-index: 9999; display: none; }
.dphs-sort.open .dphs-menu { display: block; }
.dphs-menu li { margin: 0; }
.dphs-menu a { display: block; padding: 9px 16px; color: #ccc; text-decoration: none; }
.dphs-menu a:hover { background: rgba(255,255,255,0.06); color: #fff; }
.dphs-menu a.is-active { font-weight: 700; color: #e53935; }