.bp-select {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 18px;
  padding: 14px 17px;
  border: 1px solid var(--line);
  background: #10130e;
}
.bp-select label { color: var(--lime); font: 800 12px "Barlow Condensed"; letter-spacing: 2px; }
.bp-select select { min-width: 260px; padding: 10px 35px 10px 12px; color: #f3f2e9; background: #20251b; border: 1px solid #4a513d; font: 700 16px Rajdhani; }
.bp-progress { height: 13px; margin: 15px 0; background: #292e23; border: 1px solid #4a513d; }
.bp-progress span { display: block; height: 100%; background: var(--lime); box-shadow: 0 0 14px rgba(201,237,69,.35); }
.bp-track { display: grid; grid-template-columns: repeat(7,1fr); gap: 9px; }
.bp-track article { min-height: 140px; padding: 16px; color: #181811; background: #cfc7b5; border-top: 5px solid #777a67; }
.bp-track article.done { background: #9daa5a; border-color: var(--lime); }
.bp-track article.next { color: #f3f2e9; background: #20251b; border-color: var(--lime); }
.bp-track small, .bp-track span { display: block; font-weight: 800; letter-spacing: 1px; }
.bp-track span { font-size: 11px; }
.bp-summary .number { font-size: 42px; }
.server-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.server-card { min-height: 330px; border: 1px solid rgba(178,192,123,.24); background: rgba(14,17,12,.92); box-shadow: 0 15px 35px rgba(0,0,0,.2); }
.server-card .panel-head { color: #d76d5e; }
.server-card.is-online .panel-head { color: var(--lime); }
.server-light { float: right; width: 13px; height: 13px; margin: 7px; border-radius: 50%; background: #9f3027; box-shadow: 0 0 15px #9f3027; }
.is-online .server-light { background: var(--lime); box-shadow: 0 0 15px var(--lime); }
.server-facts { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; margin-top: 22px; }
.server-facts div { padding: 13px; border: 1px solid var(--line); }
.server-facts small { display: block; color: var(--muted); }
.server-facts b { display: block; margin-top: 5px; color: #f3f2e9; font-size: 18px; overflow-wrap: anywhere; }
@media(max-width:960px) {
  .bp-select { align-items: stretch; flex-direction: column; }
  .bp-select select { width: 100%; min-width: 0; }
  .bp-track { grid-template-columns: repeat(2,1fr); }
  .server-grid, .server-facts { grid-template-columns: 1fr; }
}