.support-page {
  flex: 1;
  width: min(100%, 760px);
  margin-inline: auto;
  padding-block: clamp(36px, 8vh, 80px);
}

.support-intro { margin-bottom: 28px; }
.support-intro h1 { margin-top: 8px; font-size: clamp(42px, 8vw, 82px); letter-spacing: -.07em; }
.support-intro > p:last-child { margin: 14px 0 0; color: var(--muted); line-height: 1.5; }

.donation-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(145px, 190px);
  gap: clamp(18px, 4vw, 32px);
  align-items: start;
  padding: clamp(16px, 4vw, 32px);
  border: 1px solid #75425f;
  border-radius: 24px;
  background: radial-gradient(ellipse at top right, #44253e, transparent 65%), #211a24;
  box-shadow: 0 0 36px #fa86bc22;
}

.payment-details {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
}

.payment-details div { padding: 8px 12px; border: 1px solid #70495e; border-radius: 10px; }
.payment-details dt { color: var(--muted); font: 11px var(--mono); text-transform: uppercase; }
.payment-details dd { margin: 4px 0 0; font-weight: 650; }
.donation-details > p:last-child, .network-note { color: var(--muted); line-height: 1.55; }
.donation-details > p:last-child { margin: 16px 0 0; }
.donation-details strong, .network-note strong { color: var(--text); }

.donation-qr { width: min(100%, 190px); margin: 0; text-align: center; }
.donation-qr img { display: block; width: 100%; height: auto; border-radius: 12px; }
.donation-qr figcaption { margin-top: 8px; color: var(--muted); font-size: 13px; }

.address-panel { grid-column: 1 / -1; padding-top: 18px; border-top: 1px solid var(--line); }
.address-panel label { display: block; margin-bottom: 8px; color: var(--accent); font: 12px var(--mono); }
.address-controls { display: flex; flex-wrap: wrap; gap: 8px; }

.address-controls input {
  flex: 1 1 24em;
  min-width: 0;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #70495e;
  border-radius: 10px;
  background: var(--background);
  color: var(--text);
  font: 13px var(--mono);
}

.address-controls button {
  min-height: 44px;
  padding: 10px 14px;
  border: 0;
  border-radius: 10px;
  background: var(--accent);
  color: #301427;
  font: 700 14px system-ui, sans-serif;
  cursor: pointer;
}

.address-controls button:hover { background: #ffd2e7; }
.address-controls button.copy-confirmed { background: #fff0f7; box-shadow: 0 0 14px #ff9cc760; }
.address-controls :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
#copy-status { margin: 0; color: var(--accent); font-size: 13px; }
#copy-status:not(:empty):not(.copy-status-quiet) { margin-top: 8px; }
.network-note { margin: 12px 0 0; font-size: 13px; }
.donation-message { margin: 18px 0 0; color: var(--muted); line-height: 1.5; }
.donation-message a { color: var(--accent); text-underline-offset: 3px; }
.donation-message a:hover { color: var(--text); }

@media (max-width: 540px) {
  .donation-card { grid-template-columns: minmax(0, 1fr); }
  .donation-qr { justify-self: center; }
  .address-controls input { flex-basis: 100%; }
  .address-controls button { width: 100%; }
}
