:root {
  --community-width: 880px;
  --community-qr-size: 220px;
  --community-qr-padding: 20px;
  --community-qr-source-width: 191.4285714%;
  --community-qr-source-left: -45.7142857%;
  --community-qr-source-top: -75.4285714%;
  --community-backdrop: rgb(20 20 17 / .55);
}
.community-open { overflow: hidden; }
.community-dialog { width: min(var(--community-width), calc(100% - var(--space-8))); max-height: calc(100dvh - var(--space-8)); padding: 0; border: 1px solid var(--color-ink); border-radius: var(--radius-medium); color: var(--color-ink); background: var(--color-paper); overscroll-behavior: contain; }
.community-dialog::backdrop { background: var(--community-backdrop); }
.community-inner { padding: var(--space-8); }
.community-heading { display: flex; align-items: start; gap: var(--space-6); justify-content: space-between; }
.community-heading .eyebrow { margin-bottom: var(--space-3); color: var(--color-red); }
.community-heading h2 { font-size: clamp(24px, 3vw, 32px); letter-spacing: -.04em; }
.community-close { width: 44px; height: 44px; flex: 0 0 auto; background: transparent; border: 1px solid var(--color-line); border-radius: var(--radius-circle); font-size: var(--text-xl); }
.community-intro { margin: var(--space-4) 0 var(--space-6); color: var(--color-muted); }
.community-status { font-size: var(--text-sm); padding: var(--space-3) var(--space-4); background: var(--color-bg); margin-bottom: var(--space-6); }
.community-columns { display: grid; grid-template-columns: 1fr 1fr; border-block: 1px solid var(--color-line); }
.community-option { min-width: 0; padding-block: var(--space-6); }
.community-option + .community-option { border-left: 1px solid var(--color-line); padding-left: var(--space-8); }
.community-option:first-child { padding-right: var(--space-8); }
.community-option h3 { font-size: var(--text-xl); margin-bottom: var(--space-3); }
.community-option p { color: var(--color-muted); margin-bottom: var(--space-4); font-size: var(--text-sm); }
.community-qr { min-height: var(--community-qr-size); display: grid; place-items: center; margin-block: var(--space-4); }
.community-qr-frame { width: var(--community-qr-size); padding: var(--community-qr-padding); background: #fff; border: 1px solid var(--color-line); border-radius: var(--radius-small); }
.community-qr-viewport { position: relative; width: 100%; aspect-ratio: 1; overflow: hidden; }
/* Present the exact source pixels; never regenerate or redraw a payment QR. */
.community-qr-frame img { position: absolute; display: block; max-width: none; width: var(--community-qr-source-width); height: auto; left: var(--community-qr-source-left); top: var(--community-qr-source-top); }
.community-qr p { margin: 0; padding: var(--space-6); border: 1px dashed var(--color-line); text-align: center; }
.wechat-id { display: block; font: 650 clamp(20px, 3vw, 28px)/1.5 var(--font-mono); overflow-wrap: anywhere; margin-block: var(--space-6) var(--space-4); color: var(--color-ink); user-select: all; }
.community-copy { min-height: 44px; border: 1px solid var(--color-ink); padding: var(--space-2) var(--space-4); background: var(--color-signal); border-radius: var(--radius-pill); }
.copy-status { display: block; margin-top: var(--space-2); font-size: var(--text-sm); color: var(--color-muted); }
.community-actions { display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; justify-content: space-between; margin-top: var(--space-6); }
.community-actions .text-link { font-size: var(--text-sm); }
.community-note { color: var(--color-muted); font-size: var(--text-sm); margin: var(--space-4) 0 0; }
.community-inline-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-6); }
.community-text-button { display: inline-flex; align-items: center; min-height: 44px; border: 0; padding: 0; background: transparent; color: inherit; text-decoration: underline; text-underline-offset: .25em; font: inherit; }
.download-page { max-width: 1100px; }
.download-page .community-columns { margin-top: var(--space-12); }
.download-page .community-option p { font-size: var(--text-base); }
.download-page .community-option h2 { font-size: var(--text-2xl); margin: 0 0 var(--space-4); }
.release-status { color: var(--color-muted); font-size: var(--text-sm); margin-top: var(--space-4); }
.download-total { color: var(--color-muted); font-size: var(--text-sm); margin: var(--space-3) 0 0; }
.download-total strong { color: var(--color-red); font-family: var(--font-mono); font-size: var(--text-base); font-variant-numeric: tabular-nums; }
@media (max-width: 640px) {
  .community-dialog { --community-qr-size: 180px; --community-qr-padding: 16px; }
  .community-inner { padding: var(--space-4); }
  .community-dialog .community-option { padding-block: var(--space-4); }
  .community-dialog .community-option h3 { font-size: var(--text-lg); margin-bottom: var(--space-2); }
  .community-dialog .community-option p { margin-bottom: var(--space-2); }
  .community-dialog .community-qr { margin-block: var(--space-2); }
  .community-dialog .wechat-id { margin-block: var(--space-3); }
  .community-dialog .community-intro { margin-block: var(--space-2) var(--space-4); }
  .community-columns { grid-template-columns: 1fr; }
  .community-option:first-child { padding-right: 0; }
  .community-option + .community-option { border-left: 0; border-top: 1px solid var(--color-line); padding-left: 0; }
  .community-heading { gap: var(--space-3); }
  .community-actions { align-items: stretch; flex-direction: column; }
  .community-actions .button { justify-content: center; }
}
