/* presented.css — "Supported by" community sponsor line (js/presented.js) and the
 * supporters page (supporters.html, js/supporters.js). Uses only the shared tokens of
 * style.css (map) and pages.css (other pages), so dark mode follows automatically. */
.pb-slot[hidden] { display: none !important; }
.pb-slot { min-width: 0; max-width: 100%; }
.pb-line { display: flex; align-items: center; gap: 6px; margin: 0; min-width: 0; max-width: 100%;
  font-size: .76rem; line-height: 1.4; color: var(--muted, #5A6878); }
.pb-label { flex-shrink: 0; font-size: .66rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em;
  color: var(--warn-text, #7A4F00); background: var(--warn-bg, #FFF6E5); border: 1px solid var(--warn-border, #F0CF8E);
  border-radius: 6px; padding: 0 5px; white-space: nowrap; }
.pb-link { display: inline-flex; align-items: center; gap: 5px; min-width: 0; flex-shrink: 1;
  color: var(--ink, #12304D); font-weight: 700; text-decoration: none; }
.pb-link:hover .pb-name { text-decoration: underline; }
.pb-logo { width: 20px; height: 20px; object-fit: contain; border-radius: 4px; background: #fff; flex-shrink: 0; }
.pb-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.pb-ext { flex-shrink: 0; font-weight: 400; }
.pb-tagline { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; flex: 1 1 0; }
.pb-info { flex-shrink: 0; margin-left: auto; display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%;
  border: 1px solid var(--border, #DFE5EC); font: italic 800 .66rem Georgia, serif; color: var(--muted, #5A6878); text-decoration: none; }
.pb-hide { flex-shrink: 0; font: inherit; font-size: .9rem; line-height: 1; background: none; border: 0; padding: 2px 4px; min-width: 24px; min-height: 24px;   /* 24px targets (WCAG 2.5.8) */
  color: var(--muted, #5A6878); cursor: pointer; }
.pb-info:hover, .pb-hide:hover { color: var(--text, #1B2633); }

/* Map side panel: a thin row just above the footer. */
#sidebar > .pb-slot { flex-shrink: 0; padding: 6px 14px; border-top: 1px solid var(--border, #DFE5EC); background: var(--surface, #fff); }
/* Help center and home footers. */
.site-foot .pb-slot { margin: 0 0 12px; }
/* The side panel is narrow: the tagline stays in the link tooltip there and on small phones. */
#sidebar > .pb-slot .pb-tagline { display: none; }
@media (max-width: 400px) { .pb-tagline { display: none; } }
@media print { .pb-slot { display: none !important; } }

/* ---------------------------------------------------------------- supporters.html */
.su-main { max-width: 860px; }
.su-hero h1 { margin: 24px 0 8px; }
.su-lead { color: var(--muted); max-width: 62ch; }
.su-main > .card { margin-bottom: 16px; }
.su-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 720px) { .su-grid { grid-template-columns: minmax(0, 1fr); } }
.su-perks { padding-left: 20px; margin: 8px 0 12px; }
.su-perks li { margin: 4px 0; }
.su-price { font-weight: 700; color: var(--ink); margin: 0 0 10px; }
.su-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.su-note { font-size: .82rem; color: var(--muted); margin: 10px 0 0; }
.su-wall { list-style: none; margin: 8px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 180px), 1fr)); gap: 8px; }
.su-wall li { border: 1px solid var(--border); border-radius: 10px; padding: 8px 12px; background: var(--surface-2); min-width: 0; }
.su-wall .su-name { display: block; font-weight: 700; color: var(--ink); overflow-wrap: anywhere; }
.su-wall .su-since { display: block; font-size: .78rem; color: var(--muted); }
.su-empty { color: var(--muted); margin: 8px 0 0; }
.su-count { font-size: .84rem; color: var(--muted); margin: 0; }
/* The "Become a monthly supporter" card on thanks.html */
.su-cta h2 { margin-top: 0; }