.rpb-payment-page {
  min-height: 100vh;
  background: var(--color-surface-page, #0b0b10);
  color: var(--color-content, #f4f4f5);
  padding: 2rem 1rem 4rem;
}
.rpb-payment-container {
  max-width: 920px;
  margin: 0 auto;
}
.rpb-payment-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.rpb-payment-title {
  margin: 0;
  font-size: var(--text-h3, 1.75rem);
  font-weight: 600;
}
.rpb-payment-polling-indicator {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: var(--text-caption, .75rem);
  color: var(--color-content-muted, #a1a1aa);
}
.rpb-payment-polling-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--color-positive, #22c55e);
  animation: rpb-pulse 1.4s ease-in-out infinite;
}
@keyframes rpb-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .35; }
}
.rpb-payment-content {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
@media (min-width: 840px) {
  .rpb-payment-content { grid-template-columns: 1.1fr .9fr; }
}
.rpb-payment-details,
.rpb-payment-qr-section,
.rpb-payment-error,
.rpb-payment-loading,
.rpb-payment-success-container {
  border: 1px solid var(--color-hairline, #27272a);
  background: var(--color-surface-raised, #141418);
  border-radius: var(--radius-lg, 16px);
  padding: 1.25rem;
}
.rpb-payment-detail-item {
  display: flex;
  flex-direction: column;
  gap: .4rem;
  padding: .9rem 0;
  border-bottom: 1px solid var(--color-hairline, #27272a);
}
.rpb-payment-detail-item:last-child { border-bottom: 0; }
.rpb-payment-detail-label {
  font-size: var(--text-micro, .7rem);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-content-faint, #71717a);
}
.rpb-payment-wallet-address,
.rpb-payment-amount-due {
  font-family: var(--font-mono, ui-monospace, monospace);
  word-break: break-all;
}
.rpb-payment-amount-due { font-size: 1.15rem; font-weight: 600; }
.rpb-payment-status {
  display: inline-flex;
  width: fit-content;
  padding: .2rem .6rem;
  border-radius: 999px;
  font-size: .72rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  border: 1px solid var(--color-hairline, #27272a);
}
.rpb-payment-status-pending { color: #fbbf24; border-color: #fbbf2433; background: #fbbf2414; }
.rpb-payment-status-paid { color: #22c55e; border-color: #22c55e33; background: #22c55e14; }
.rpb-payment-status-canceled,
.rpb-payment-status-expired { color: #f87171; border-color: #f8717133; background: #f8717114; }
.rpb-payment-qr-section { text-align: center; }
.rpb-payment-qr-container {
  margin: 1rem auto;
  max-width: 256px;
  padding: 12px;
  background: #fff;
  border-radius: 12px;
}
.rpb-payment-open-wallet-button,
.rpb-payment-dashboard-button,
.rpb-payment-back-button,
.rpb-payment-cancel-confirm-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  width: 100%;
  margin-top: .75rem;
  padding: .8rem 1rem;
  border: 0;
  border-radius: 10px;
  background: var(--color-brand, #6e56e8);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
}
.rpb-payment-cancel-button,
.rpb-payment-cancel-go-back-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  width: 100%;
  margin-top: .6rem;
  padding: .7rem 1rem;
  border-radius: 10px;
  border: 1px solid var(--color-hairline, #27272a);
  background: transparent;
  color: var(--color-content, #fff);
  cursor: pointer;
}
.rpb-payment-countdown { margin-top: 1rem; }
.rpb-payment-timer-display {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: .4rem;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 1.6rem;
}
.rpb-payment-timer-unit small {
  margin-left: .15rem;
  font-size: .7rem;
  color: var(--color-content-faint, #71717a);
}
.rpb-payment-expired,
.rpb-payment-error { color: #f87171; }
.rpb-payment-success-icon { font-size: 2.4rem; color: #22c55e; }
.rpb-payment-success-title { margin: .6rem 0 .3rem; }
.rpb-payment-success-details { margin: 1rem 0; text-align: left; }
.rpb-payment-success-detail {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .4rem 0;
}
.rpb-payment-detection {
  margin-bottom: 1rem;
  padding: 1rem;
  border-radius: 12px;
  border: 1px solid #fbbf2433;
  background: #fbbf2410;
}
.rpb-payment-detection-bar {
  height: 6px;
  background: #27272a;
  border-radius: 99px;
  overflow: hidden;
}
.rpb-payment-detection-bar-fill {
  height: 100%;
  background: #22c55e;
}
.rpb-payment-cancel-confirmation-content { padding: .5rem; }
.rpb-payment-cancel-actions { display: flex; gap: .75rem; }
.rpb-spinner {
  width: 28px;
  height: 28px;
  border: 3px solid #27272a;
  border-top-color: var(--color-brand, #6e56e8);
  border-radius: 50%;
  animation: rpb-spin .8s linear infinite;
  margin: 0 auto 1rem;
}
@keyframes rpb-spin { to { transform: rotate(360deg); } }