.plink * { box-sizing: border-box; }
.plink__title { font-size: 1.05rem; font-weight: 600; margin: 0 0 0.25rem; }
.plink__subtitle { font-size: 0.9rem; opacity: 0.8; margin: 0 0 0.85rem; }
.plink__amounts { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.75rem; }
.plink__amount.is-selected { outline: 2px solid currentColor; outline-offset: -2px; font-weight: 600; }
.plink__recurring { font-size: 0.85rem; opacity: 0.85; display: flex; align-items: center; gap: 0.4rem; margin-bottom: 0.5rem; cursor: pointer; }
.plink__note-toggle { font-size: 0.85rem; background: none; border: none; padding: 0; cursor: pointer; color: inherit; opacity: 0.75; text-decoration: underline; }
.plink__note { display: none; width: 100%; margin-top: 0.5rem; padding: 0.4rem; font: inherit; background: transparent; color: inherit; border: 1px solid color-mix(in srgb, currentColor 25%, transparent); border-radius: inherit; }
.plink__note.is-open { display: block; }
.plink__confirm { display: block; width: 100%; margin-top: 0.85rem; padding: 0.55rem 0.85rem; font: inherit; font-weight: 500; background: var(--plink-accent, #1c1917); color: var(--plink-bg, #fff); border: 1px solid var(--plink-accent, #1c1917); border-radius: var(--plink-radius, 4px); cursor: pointer; }
.plink__confirm:disabled { opacity: 0.4; cursor: not-allowed; }
.plink__confirm:hover:not(:disabled) { filter: brightness(0.92); }
.plink__error { color: #c33; font-size: 0.85rem; margin-top: 0.5rem; min-height: 1.1em; }
.plink__thanks { font-size: 0.95rem; padding: 0.5rem 0; }

.plink--medium .plink__title,
.plink--medium .plink__subtitle { display: none; }
.plink--medium { padding: 0.6rem 0.75rem; }

.plink__trigger { display: inline-block; padding: 0.45rem 0.95rem; font: inherit; font-weight: 500; cursor: pointer; background: var(--plink-accent, #1c1917); color: var(--plink-bg, #fff); border: 1px solid var(--plink-accent, #1c1917); border-radius: var(--plink-radius, 4px); }
.plink__trigger:hover { filter: brightness(0.92); }

.plink__overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.45); display: flex; align-items: center; justify-content: center; z-index: 99999; padding: 1rem; }
.plink__modal { position: relative; width: 100%; max-width: 24rem; }
.plink__modal .plink { background: var(--plink-bg, #fff); }
.plink__close { position: absolute; top: 0.1rem; right: 0.35rem; background: transparent; border: none; font-size: 1.6rem; line-height: 1; cursor: pointer; color: inherit; padding: 0.1rem 0.4rem; z-index: 2; }

.plink {
  background: var(--plink-bg, transparent);
  color: var(--plink-text, currentColor);
  border: 1px solid var(--plink-border, color-mix(in srgb, currentColor 20%, transparent));
  border-radius: var(--plink-radius, 4px);
  font-family: var(--plink-font, inherit);
  padding: 1rem;
}
.plink__amount {
  background: transparent;
  color: var(--plink-text, currentColor);
  border: 1px solid var(--plink-accent, currentColor);
  border-radius: var(--plink-radius, 4px);
  padding: 0.5rem 0.85rem;
  cursor: pointer;
}
.plink__amount:hover { background: var(--plink-accent, color-mix(in srgb, currentColor 12%, transparent)); }