:root {
  --woh-purple: #235387;
  --woh-orange: #d90468;
  --woh-ink: #1c1a1a;
  --woh-muted: #596573;
  --woh-line: #dbe3ea;
  --woh-paper: #fff;
  --woh-wash: #eef4f8;
  --woh-green: #237a4b;
  --woh-red: #a83245;
}
* { box-sizing: border-box; }
body.fundraiser-page { margin: 0; color: var(--woh-ink); background: radial-gradient(circle at 15% 0, #fff3e8 0, transparent 32rem), var(--woh-wash); font-family: "Poppins", sans-serif; }
a { color: inherit; }
.fundraiser-header { background: var(--woh-purple); color: white; }
.fundraiser-nav { width: min(1120px, calc(100% - 32px)); margin: auto; min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.fundraiser-brand { font-weight: 700; text-decoration: none; font-size: 1.15rem; }
.fundraiser-nav-links { display: flex; align-items: center; gap: 16px; }
.fundraiser-nav-links a, .fundraiser-nav-links button { color: white; background: transparent; border: 0; font: inherit; cursor: pointer; white-space: nowrap; }
.fundraiser-main { width: min(1120px, calc(100% - 32px)); margin: 0 auto; padding: 42px 0 72px; }
.fundraiser-kicker { color: var(--woh-orange); font-weight: 700; text-transform: uppercase; font-size: .78rem; letter-spacing: 0; }
.fundraiser-title { color: var(--woh-purple); margin: 6px 0 10px; font-size: clamp(2rem, 5vw, 3.5rem); line-height: 1.08; }
.fundraiser-lead { max-width: 720px; color: var(--woh-muted); font-size: 1.05rem; }
.newsletter-table-scroll { overflow-x: auto; background: var(--woh-paper); border: 1px solid var(--woh-line); }
.newsletter-table { width: 100%; border-collapse: collapse; text-align: left; }
.newsletter-table th, .newsletter-table td { padding: 14px 18px; border-bottom: 1px solid var(--woh-line); overflow-wrap: anywhere; }
.newsletter-table th { color: var(--woh-purple); }
.fundraiser-toolbar { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px; margin: 28px 0; }
.fundraiser-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.fundraiser-card { display: block; background: var(--woh-paper); border: 1px solid var(--woh-line); border-radius: 8px; overflow: hidden; text-decoration: none; }
.fundraiser-card-body { padding: 18px; }
.fundraiser-review-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 28px 0; }
.fundraiser-review-tabs a { padding: 9px 14px; border: 1px solid var(--woh-line); border-radius: 6px; color: var(--woh-purple); text-decoration: none; font-weight: 600; }
.fundraiser-review-tabs a[aria-current="page"] { background: var(--woh-purple); border-color: var(--woh-purple); color: #fff; }
.fundraiser-review-tabs a:focus-visible, .fundraiser-card:focus-visible { outline: 3px solid var(--woh-purple); outline-offset: 3px; }
.fundraiser-review-empty { grid-column: 1 / -1; max-width: 680px; padding: 28px 32px; background: var(--woh-paper); border: 1px solid var(--woh-line); border-radius: 8px; }
.fundraiser-review-empty h3 { margin: 0 0 8px; color: var(--woh-purple); font-size: 1.3rem; }
.fundraiser-review-empty p { color: var(--woh-muted); margin: 0 0 18px; }
.fundraiser-review-empty a { color: var(--woh-purple); font-weight: 700; }
.fundraiser-card-action { display: inline-block; margin-top: 18px; color: var(--woh-purple); font-weight: 700; text-decoration: underline; }
.fundraiser-card h2, .fundraiser-card h3 { margin: 0 0 8px; color: var(--woh-purple); }
.fundraiser-card-preview { display: -webkit-box; min-height: 4.5em; margin: 16px 0 0; overflow: hidden; color: var(--woh-muted); -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.fundraiser-frame { aspect-ratio: 4 / 3; background: #eee9f3; display: grid; place-items: center; overflow: hidden; position: relative; }
.fundraiser-frame img { width: 100%; height: 100%; object-fit: cover; }
.fundraiser-frame-label { position: absolute; inset: auto 0 0; padding: 12px 16px; color: white; font-weight: 700; background: rgba(39, 35, 49, .82); }
.legacy-fundraiser-page .fundraiser-frame { aspect-ratio: auto; display: block; background: #f5f2f7; }
.legacy-fundraiser-page .fundraiser-frame > img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; max-height: 180px; object-fit: cover; }
.legacy-image-placeholder { display: grid; place-items: center; width: 100%; aspect-ratio: 16 / 9; max-height: 180px; color: #728783; background: #edf3f0; }
.legacy-image-placeholder svg { width: 56px; height: 56px; }
.legacy-fundraiser-page .fundraiser-frame-label { position: static; min-height: 78px; display: flex; align-items: center; color: var(--woh-purple); background: transparent; overflow-wrap: anywhere; }
.legacy-fundraiser-page .fundraiser-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.legacy-fundraiser-page .fundraiser-stat:last-child { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.legacy-fundraiser-page .fundraiser-stat strong { font-size: 1.1rem; }
.legacy-story-trigger { display: block; width: 100%; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.legacy-story-trigger:hover .fundraiser-frame-label, .legacy-story-trigger:focus-visible .fundraiser-frame-label { text-decoration: underline; }
.legacy-story-trigger:focus-visible { outline: 3px solid var(--woh-orange); outline-offset: -3px; }
.legacy-story-hint { display: inline-block; margin-top: 12px; color: var(--woh-purple); font-size: .9rem; font-weight: 600; }
.legacy-story-trigger:hover .legacy-story-hint, .legacy-story-trigger:focus-visible .legacy-story-hint { text-decoration: underline; }
.legacy-story-dialog { width: min(680px, calc(100% - 32px)); max-height: min(85dvh, 820px); padding: 0; border: 0; border-radius: 8px; color: var(--woh-ink); background: var(--woh-paper); box-shadow: 0 18px 60px rgba(20, 16, 25, .3); overflow-y: auto; }
.legacy-story-dialog::backdrop { background: rgba(20, 16, 25, .72); }
.legacy-story-content { padding: 28px; }
.legacy-story-actions { float: right; margin: -12px -12px 8px 16px; }
.legacy-story-close { width: 40px; height: 40px; border: 0; border-radius: 4px; background: var(--woh-wash); color: var(--woh-purple); font: inherit; font-size: 1.6rem; line-height: 1; cursor: pointer; }
.legacy-story-close:focus-visible { outline: 3px solid var(--woh-orange); }
.legacy-story-dialog h2 { margin: 6px 0 0; color: var(--woh-purple); font-size: clamp(1.4rem, 4vw, 2rem); overflow-wrap: anywhere; }
.legacy-story-dialog .fundraiser-stats { clear: both; }
.legacy-story-text { line-height: 1.7; overflow-wrap: anywhere; }
.legacy-story-text p { margin: 0 0 1em; }
.legacy-story-text p:last-child { margin-bottom: 0; }
.fundraiser-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr); gap: 28px; align-items: start; }
.fundraiser-panel { background: white; border: 1px solid var(--woh-line); border-radius: 8px; padding: 24px; }
.fundraiser-panel + .fundraiser-panel { margin-top: 20px; }
.fundraiser-form { display: grid; gap: 18px; }
.fundraiser-field { display: grid; gap: 7px; }
.fundraiser-field label, .fundraiser-label { font-weight: 600; color: var(--woh-purple); }
.fundraiser-field input, .fundraiser-field textarea, .fundraiser-field select, .fundraiser-search { width: 100%; border: 1px solid #bcb5c2; border-radius: 6px; padding: 11px 12px; font: inherit; background: white; }
.fundraiser-field textarea { min-height: 130px; resize: vertical; }
.fundraiser-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.fundraiser-button { appearance: none; border: 0; border-radius: 6px; padding: 11px 17px; background: var(--woh-orange); color: white; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.fundraiser-button.secondary { background: var(--woh-purple); }
.fundraiser-button.quiet { background: white; color: var(--woh-purple); border: 1px solid var(--woh-purple); }
.fundraiser-button.danger { background: var(--woh-red); }
.fundraiser-button:disabled { opacity: .55; cursor: not-allowed; }
.fundraiser-alert { margin: 18px 0; padding: 13px 15px; border-radius: 6px; border: 1px solid; }
.fundraiser-alert.error { color: var(--woh-red); background: #fff1f3; border-color: #efbdc5; }
.fundraiser-alert.success { color: var(--woh-green); background: #eef9f2; border-color: #b9ddc7; }
.fundraiser-alert.info { color: #594b25; background: #fff9e8; border-color: #e9dca7; }
.fundraiser-status { display: inline-flex; padding: 4px 9px; border-radius: 999px; background: #eee9f3; color: var(--woh-purple); font-size: .78rem; font-weight: 700; text-transform: capitalize; }
.fundraiser-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--woh-line); border: 1px solid var(--woh-line); margin: 22px 0; }
.fundraiser-layout > aside .fundraiser-stats { grid-template-columns: 1fr; }
.fundraiser-stat { min-width: 0; background: white; padding: 12px 10px; }
.fundraiser-stat span { display: block; font-size: .9rem; overflow-wrap: anywhere; }
.fundraiser-stat strong { display: block; font-size: 1.3rem; color: var(--woh-purple); overflow-wrap: anywhere; }
.fundraiser-progress { height: 10px; border-radius: 999px; overflow: hidden; background: #e6e1e9; }
.fundraiser-progress span { display: block; height: 100%; background: var(--woh-orange); }
.fundraiser-table { width: 100%; border-collapse: collapse; }
.fundraiser-table th, .fundraiser-table td { text-align: left; padding: 12px 10px; border-bottom: 1px solid var(--woh-line); vertical-align: top; }
.fundraiser-table th { color: var(--woh-purple); font-size: .8rem; }
.fundraiser-empty { color: var(--woh-muted); padding: 24px 0; }
.fundraiser-pagination { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 24px; }
.supporter-list { border-top: 1px solid var(--woh-line); }
.supporter-row { display: grid; grid-template-columns: minmax(180px, .7fr) minmax(0, 1.3fr); gap: 24px; padding: 16px 0; border-bottom: 1px solid var(--woh-line); }
.supporter-summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: baseline; }
.supporter-summary h3 { margin: 0; color: var(--woh-purple); }
.supporter-summary time { grid-column: 1 / -1; color: var(--woh-muted); font-size: .82rem; }
.supporter-message { margin: 0; color: var(--woh-muted); overflow-wrap: anywhere; }
.donation-reference { display: grid; gap: 5px; margin: 20px 0; padding: 14px 16px; border-left: 4px solid var(--woh-purple); background: var(--woh-wash); }
.donation-reference span { color: var(--woh-muted); font-size: .78rem; font-weight: 700; text-transform: uppercase; }
.donation-reference code { color: var(--woh-purple); font: 600 .9rem/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; overflow-wrap: anywhere; }
.fundraiser-amounts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.fundraiser-amount { border: 1px solid var(--woh-purple); background: white; color: var(--woh-purple); padding: 10px; border-radius: 6px; font: inherit; font-weight: 700; cursor: pointer; }
.fundraiser-amount.is-selected { color: white; background: var(--woh-purple); }
.fundraiser-check { display: flex; align-items: flex-start; gap: 9px; }
.fundraiser-check input { margin-top: 4px; }
.logo-tools { display: grid; justify-items: start; gap: 14px; }
.logo-file-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.logo-file-input:focus + .logo-file-label { outline: 3px solid rgba(88, 44, 131, .25); outline-offset: 3px; }
.logo-file-input:disabled + .logo-file-label { opacity: .55; cursor: not-allowed; }
.logo-file-label { display: inline-flex; align-items: center; }
.logo-preview-button { appearance: none; display: block; width: min(100%, 280px); margin: 0; padding: 0; border: 0; border-radius: 6px; background: transparent; cursor: zoom-in; }
.logo-preview-button:focus-visible { outline: 3px solid rgba(88, 44, 131, .25); outline-offset: 3px; }
.logo-preview { display: grid; width: 100%; aspect-ratio: 4 / 3; background: #eee9f3; overflow: hidden; border: 1px solid var(--woh-line); border-radius: 6px; }
.logo-preview img, .logo-preview-large img { display: block; width: 100%; height: 100%; object-fit: cover; }
.logo-crop-dialog, .logo-preview-dialog { width: min(760px, calc(100% - 24px)); border: 0; border-radius: 8px; padding: 24px; }
.logo-crop-dialog::backdrop, .logo-preview-dialog::backdrop { background: rgba(20, 16, 25, .72); }
.logo-crop-dialog h2 { margin: 0 0 20px; }
.logo-crop-stage { height: min(60vh, 480px); }
.logo-crop-stage img { display: block; max-width: 100%; }
.logo-dialog-actions { justify-content: center; padding-top: 24px; }
.logo-preview-large { width: 100%; aspect-ratio: 4 / 3; }
.fundraiser-logo-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 280px)); gap: 24px; align-items: start; }
.admin-logo-preview { appearance: none; width: 100%; padding: 0; border: 1px solid var(--woh-line); border-radius: 6px; color: inherit; font: inherit; cursor: zoom-in; }
.admin-logo-preview:focus-visible { outline: 3px solid rgba(88, 44, 131, .25); outline-offset: 3px; }
.fundraiser-history { display: grid; gap: 0; }
.fundraiser-history-item { padding: 14px 0; border-bottom: 1px solid var(--woh-line); }
.fundraiser-history-item:first-child { padding-top: 0; }
.fundraiser-history-item:last-child { padding-bottom: 0; border-bottom: 0; }
.fundraiser-history-item p { margin: 6px 0 0; color: var(--woh-muted); }
.fundraiser-js-row { display: flex; gap: 10px; align-items: center; }
.fundraiser-js-note { color: var(--woh-muted); font-size: .88rem; }
@media (max-width: 820px) {
  .fundraiser-grid, .fundraiser-layout { grid-template-columns: 1fr; }
  .fundraiser-stats { grid-template-columns: 1fr; }
  .fundraiser-logo-comparison { grid-template-columns: minmax(0, 280px); }
  .fundraiser-nav { min-height: 64px; }
  .fundraiser-nav-links { gap: 10px; font-size: .88rem; }
}
@media (max-width: 520px) {
  .fundraiser-main { width: min(100% - 22px, 1120px); padding-top: 28px; }
  .fundraiser-panel { padding: 17px; }
  .fundraiser-grid { grid-template-columns: 1fr; }
  .fundraiser-amounts { grid-template-columns: repeat(2, 1fr); }
  .supporter-row { grid-template-columns: 1fr; gap: 8px; }
  .fundraiser-table { display: block; overflow-x: auto; }
}
