/* ── Bổ sung cho luồng ủng hộ qua Gank ───────────────────────── */

/* Thay style="" inline trong SVG (bị CSP style-src chặn) */
.mix-screen { mix-blend-mode: screen; }

/* Thanh chi phí: thay style="" inline (bị CSP style-src chặn) */
.ledger__row--server  { --w: 84.4%; }
.ledger__row--storage { --w: 11.3%; }
.ledger__row--domain  { --w: 4.4%; }
.ledger__row--plugin  { --w: 0.4%; }

/* Ghi chú dưới bảng mốc */
.rates__note {
  margin: 18px 0 0;
  max-width: 62ch;
  font-size: 12px;
  line-height: 1.7;
  color: var(--dim-2);
}

/* ── Người đã ủng hộ ─────────────────────────────────────────── */
.supporters {
  margin-top: clamp(32px, 5vw, 56px);
  border-top: 1px solid var(--line);
  padding-top: 22px;
}
.supporters__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}
.supporters__total {
  margin: 0;
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--bone-38);
}
.supporters__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.supporters__item {
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
.supporters__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
}
.supporters__name {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--bone-72);
}
.supporters__amount {
  font-family: var(--f-mono);
  font-size: 13px;
  color: var(--acid, var(--red));
  white-space: nowrap;
}
.supporters__msg {
  margin: 5px 0 0;
  max-width: 62ch;
  font-size: 13px;
  line-height: 1.6;
  color: var(--dim);
}

/* ── Hộp ủng hộ: các bước ────────────────────────────────────── */
.pay__step[hidden] { display: none; }

.pay__submit {
  display: flex;
  width: 100%;
  justify-content: center;
  margin-top: 22px;
  text-align: center;
}
.pay__submit[hidden] { display: none; }

.pay__hint {
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.65;
  color: var(--dim);
}
.pay__hint strong { color: var(--bone-72); font-weight: 600; }

.pay__waiting {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 24px 0 8px;
  font-family: var(--f-display);
  font-size: 17px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--bone-72);
}

.pay__spin {
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
  border: 1px solid var(--bone-38);
  border-top-color: var(--red);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

.pay__done {
  margin: 24px 0 6px;
  font-family: var(--f-display);
  font-size: clamp(22px, 3vw, 30px);
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--acid, var(--red));
}

.pay__error {
  margin: 16px 0 0;
  padding: 11px 13px;
  border: 1px solid var(--red);
  background: rgba(255, 70, 85, .08);
  font-size: 12px;
  line-height: 1.6;
  color: var(--bone);
}
.pay__error[hidden] { display: none; }

/* Ô nhập: email/tên không cần chừa chỗ cho bộ đếm */
.field input[type="email"],
.field input[type="text"] { padding-right: 15px; }
.field--count input[type="text"] { padding-right: 66px; }

/* Honeypot: ẩn bằng CSS, không dùng style="" (CSP) */
.hp-field {
  position: absolute;
  left: -9999px;
  top: -9999px;
  height: 0;
  overflow: hidden;
}
