/* Protect Green Belt: the platform's own look. Mobile first; no inline styles anywhere (the CSP forbids them). */

/* Fonts, served from this site (latin subset, woff2), copied from the npm packages @fontsource/fraunces 5.3.0 and
   @fontsource/atkinson-hyperlegible 5.3.0. Both are under the SIL Open Font License 1.1: see /fonts/OFL-*.txt.
   Fraunces (c) 2020 The Fraunces Project Authors; Atkinson Hyperlegible (c) 2020 Braille Institute of America. */
@font-face { font-family: "Fraunces"; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/fraunces-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Fraunces"; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/fraunces-latin-700-normal.woff2) format("woff2"); }
@font-face { font-family: "Atkinson Hyperlegible"; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/atkinson-hyperlegible-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: "Atkinson Hyperlegible"; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/atkinson-hyperlegible-latin-700-normal.woff2) format("woff2"); }
/* Georgia, sized to take about the same room as Fraunces, so headings don't jump when the font arrives.
   The figures are estimates from the two fonts' metrics; adjust if a heading still shifts. */
@font-face { font-family: "Fraunces Fallback"; src: local("Georgia"); size-adjust: 104%; ascent-override: 94%; descent-override: 24%; line-gap-override: 0%; }

:root {
  --pg-paper: #f7f4ec;
  --pg-surface: #ffffff;
  --pg-tint: #ebf0e3;
  --pg-ink: #17241c;
  --pg-ink-soft: #4a584f;
  --pg-forest: #1d4630;
  --pg-forest-deep: #12301f;
  --pg-meadow: #3c7a4d;
  --pg-sun: #e3a72f;
  --pg-sun-soft: #fbedc9;
  --pg-red: #b3261e;
  --pg-rule: #d8dccd;
  --pg-focus: #1d5fd0;
  --pg-radius: 14px;
  --pg-head: "Fraunces", "Fraunces Fallback", Georgia, serif;
  --pg-body: "Atkinson Hyperlegible", system-ui, sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --pg-paper: #111915; --pg-surface: #18221c; --pg-tint: #1d2a21; --pg-ink: #e9efe6; --pg-ink-soft: #aebbb1;
    --pg-forest: #8fd0a1; --pg-forest-deep: #0b130e; --pg-meadow: #7cc48e; --pg-sun: #f0c060; --pg-sun-soft: #3a2f15;
    --pg-red: #ff8a80; --pg-rule: #2f3d33; --pg-focus: #7aa7ff; color-scheme: dark;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body.pg { margin: 0; background: var(--pg-paper); color: var(--pg-ink); font: 400 1.0625rem/1.6 var(--pg-body); }
.pg img { max-width: 100%; }
.pg a { color: var(--pg-forest); text-underline-offset: 3px; text-decoration-thickness: 1px; }
.pg a:hover { text-decoration-thickness: 2px; }
.pg :focus-visible { outline: 3px solid var(--pg-focus); outline-offset: 2px; border-radius: 3px; }
.pg h1, .pg h2, .pg h3 { font-family: var(--pg-head); font-weight: 600; line-height: 1.12; margin: 0 0 .5em; letter-spacing: -.01em; }
.pg h1 { font-size: clamp(2.1rem, 7vw, 3.6rem); font-weight: 700; }
.pg h2 { font-size: clamp(1.6rem, 4.5vw, 2.3rem); }
.pg h3 { font-size: 1.2rem; }
.pg p { margin: 0 0 1em; }
.pg code, .pg-mono { font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: .9em; }

.pg-wrap { max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.pg-narrow { max-width: 760px; }
.pg-page { padding-top: 2rem; padding-bottom: 4rem; }
.pg-skip { position: absolute; left: -999px; }
.pg-skip:focus { left: 16px; top: 8px; background: var(--pg-surface); padding: .5rem 1rem; z-index: 10; }
.pg-muted, .pg-hint { color: var(--pg-ink-soft); }
.pg-hint { font-size: .92rem; font-weight: 400; }
.pg-lede { font-size: 1.2rem; color: var(--pg-ink-soft); max-width: 62ch; }
.pg-crumb { font-size: .95rem; margin-bottom: .5rem; }
.pg-plain { list-style: none; padding: 0; margin: 0; }
.pg-pre { white-space: pre-line; }

/* header */
.pg-header { background: var(--pg-forest-deep); color: #fff; }
.pg-header-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1.5rem; padding-top: .8rem; padding-bottom: .8rem; }
.pg .pg-brand { display: flex; align-items: center; gap: .55rem; color: #fff; text-decoration: none; font: 700 1.3rem/1 var(--pg-head); }
.pg-mark { width: 36px; height: 36px; color: var(--pg-sun); flex: none; }
.pg-mark-sm { width: 22px; height: 22px; vertical-align: -5px; }
.pg-mark-lg { width: 72px; height: 72px; color: var(--pg-meadow); }
.pg-nav { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 1.2rem; }
.pg .pg-nav a { color: #e4efe6; text-decoration: none; font-weight: 700; padding: .35rem 0; border-bottom: 2px solid transparent; }
.pg .pg-nav a:hover, .pg .pg-nav a[aria-current] { color: #fff; border-bottom-color: var(--pg-sun); }
.pg .pg-nav .pg-nav-cta { background: var(--pg-sun); color: #1b1606; padding: .45rem .9rem; border-radius: 999px; border: 0; }
.pg .pg-nav .pg-nav-cta:hover { background: #f0bd55; color: #1b1606; }

.pg-flash { margin: 1rem 0 0; padding: .7rem 1rem; background: var(--pg-tint); border-left: 4px solid var(--pg-meadow); border-radius: 6px; }
.pg-error { padding: .7rem 1rem; background: var(--pg-sun-soft); border-left: 4px solid var(--pg-red); border-radius: 6px; }
.pg-note { padding: .8rem 1rem; background: var(--pg-sun-soft); border-radius: 10px; max-width: 70ch; }

/* buttons */
.pg-button { display: inline-block; font: 700 1rem/1.2 var(--pg-body); background: var(--pg-forest); color: #fff; border: 2px solid var(--pg-forest);
  border-radius: 999px; padding: .7rem 1.3rem; cursor: pointer; text-decoration: none; }
.pg a.pg-button { color: #fff; text-decoration: none; }
@media (prefers-color-scheme: dark) { .pg-button, .pg a.pg-button { color: #0b130e; } }
.pg-button:hover { filter: brightness(1.1); }
.pg-button-ghost, .pg a.pg-button-ghost { background: transparent; color: var(--pg-forest); }
.pg-button-light, .pg a.pg-button-light { background: var(--pg-sun); border-color: var(--pg-sun); color: #1b1606; }
.pg-linklike { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-decoration: underline; cursor: pointer; }
.pg-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.5rem; }

/* hero */
.pg-hero { background: linear-gradient(180deg, var(--pg-tint), var(--pg-paper)); border-bottom: 1px solid var(--pg-rule); }
.pg-hero-inner { display: grid; gap: 2rem; padding-top: 2.5rem; padding-bottom: 2.5rem; align-items: center; }
.pg-eyebrow { text-transform: uppercase; letter-spacing: .12em; font-size: .85rem; font-weight: 700; color: var(--pg-meadow); margin-bottom: .6rem; }
.pg-hero h1 { max-width: 15ch; }
.pg-hero-art { margin: 0; }
.pg-hero-art svg { display: block; width: 100%; height: auto; max-width: 460px; margin: 0 auto; }
.pg-art-sky { fill: #dcebd8; }
.pg-art-hill2 { fill: #8cbf8f; }
.pg-art-hill1 { fill: #3c7a4d; }
.pg-art-line { fill: none; stroke: #c8102e; stroke-width: 3; stroke-dasharray: 9 6; stroke-linecap: round; }
.pg-art-trees circle { fill: #1d4630; }
.pg-art-sun { fill: #e3a72f; }
@media (prefers-color-scheme: dark) { .pg-art-sky { fill: #20322a; } .pg-art-hill2 { fill: #3a6b48; } .pg-art-hill1 { fill: #24563a; } .pg-art-trees circle { fill: #0f2418; } }

/* sections */
.pg-section { padding: 3rem 0; }
.pg-section-tint { background: var(--pg-tint); }
.pg-section-lede { font-size: 1.1rem; color: var(--pg-ink-soft); max-width: 62ch; margin-bottom: 2rem; }
.pg-features { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.pg-feature { background: var(--pg-surface); border: 1px solid var(--pg-rule); border-radius: var(--pg-radius); padding: 1.2rem 1.2rem .4rem; }
.pg-feature p { color: var(--pg-ink-soft); }
.pg-icon { width: 34px; height: 34px; color: var(--pg-meadow); margin-bottom: .5rem; }
.pg-steps { list-style: none; counter-reset: step; padding: 0; margin: 0 0 1.5rem; display: grid; gap: 1rem; }
.pg-steps li { counter-increment: step; position: relative; padding: 1rem 1rem .3rem 4rem; background: var(--pg-surface); border-radius: var(--pg-radius); }
.pg-steps li::before { content: counter(step); position: absolute; left: 1rem; top: 1rem; width: 2.2rem; height: 2.2rem; border-radius: 50%;
  background: var(--pg-forest); color: #fff; font: 700 1.1rem/2.2rem var(--pg-head); text-align: center; }
@media (prefers-color-scheme: dark) { .pg-steps li::before { color: #0b130e; } }

.pg-campaigns { display: grid; gap: 1rem; margin-bottom: 1rem; }
.pg .pg-campaign { display: flex; flex-direction: column; gap: .35rem; padding: 1.3rem; border-radius: var(--pg-radius); background: var(--pg-surface);
  border: 1px solid var(--pg-rule); color: var(--pg-ink); text-decoration: none; }
.pg .pg-campaign:hover { border-color: var(--pg-meadow); }
.pg-campaign strong { font: 600 1.4rem/1.2 var(--pg-head); color: var(--pg-forest); }
.pg-campaign-first { border-left: 6px solid var(--pg-sun); }
.pg-campaign-tag { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--pg-meadow); }
.pg-campaign-url { color: var(--pg-ink-soft); font-size: .92rem; text-decoration: underline; text-underline-offset: 3px; }

.pg-cta { background: var(--pg-forest-deep); color: #fff; padding: 3rem 0; }
.pg-cta-inner { text-align: center; }
.pg-cta p { color: #d8e6db; max-width: 56ch; margin-left: auto; margin-right: auto; }

/* footer */
.pg-footer { border-top: 1px solid var(--pg-rule); padding: 2rem 0 3rem; font-size: .95rem; color: var(--pg-ink-soft); }
.pg-footer-brand { font: 700 1.1rem/1 var(--pg-head); color: var(--pg-ink); }
.pg-footer-links { display: flex; flex-wrap: wrap; gap: .5rem 1.3rem; align-items: center; }
.pg-footer-links form { margin: 0; }

/* forms */
.pg-form { display: flex; flex-direction: column; gap: 1.1rem; margin-top: 1rem; }
.pg-form label { display: flex; flex-direction: column; gap: .35rem; font-weight: 700; }
.pg-form input[type=text], .pg-form input[type=email], .pg-form input[type=search], .pg-form input[type=number], .pg-form select, .pg-form textarea {
  font: 400 1rem/1.4 var(--pg-body); color: var(--pg-ink); background: var(--pg-surface); border: 1.5px solid #9aa597; border-radius: 8px; padding: .6rem .7rem; width: 100%; }
.pg-form textarea { resize: vertical; }
.pg-form input[readonly], .pg-form textarea[readonly] { background: var(--pg-tint); color: var(--pg-ink-soft); }
.pg-form [aria-invalid=true] { border-color: var(--pg-red); }
.pg-form fieldset { border: 1px solid var(--pg-rule); border-radius: var(--pg-radius); padding: 1rem; margin: 0; display: flex; flex-direction: column; gap: 1rem; background: var(--pg-surface); }
.pg-form legend { font: 600 1.2rem/1 var(--pg-head); padding: 0 .4rem; }
.pg-form .pg-check { flex-direction: row; align-items: center; gap: .5rem; font-weight: 400; }
.pg-form .pg-check input { width: 1.2rem; height: 1.2rem; }
.pg-form button.pg-button { align-self: flex-start; }
.pg-field-error { color: var(--pg-red); font-weight: 700; font-size: .95rem; }
.pg-ok { color: var(--pg-meadow); font-weight: 700; }
.pg-bad { color: var(--pg-red); font-weight: 700; }
.pg-two { display: grid; gap: 1rem; }
.pg-slug-row { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.pg-slug-row input { flex: 1 1 12rem; }
.pg-slug-suffix { font-weight: 400; color: var(--pg-ink-soft); }
.pg-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pg-inline { display: inline; }
.pg-map { height: 340px; border-radius: 10px; border: 1px solid var(--pg-rule); }
.pick-results { list-style: none; padding: 0; margin: 0; }
.pick-results button { background: none; border: 0; padding: .3rem 0; text-align: left; font: inherit; color: var(--pg-forest); text-decoration: underline; cursor: pointer; }
.pg-quote { border-left: 4px solid var(--pg-rule); padding: .2rem 1rem; white-space: pre-line; margin-bottom: 1rem; }

/* admin */
.pg-titlebar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; }
.pg-table-wrap { overflow-x: auto; }
.pg-table { border-collapse: collapse; width: 100%; background: var(--pg-surface); font-size: .97rem; }
.pg-table th, .pg-table td { text-align: left; padding: .6rem .7rem; border-bottom: 1px solid var(--pg-rule); vertical-align: top; }
.pg-table th { font-size: .85rem; text-transform: uppercase; letter-spacing: .06em; color: var(--pg-ink-soft); }
.pg-chip { display: inline-block; font-size: .82rem; font-weight: 700; padding: .15rem .6rem; border-radius: 999px; white-space: nowrap; }
.pg-chip-live { background: #d5ecd9; color: #1a4d2a; }
.pg-chip-setting_up { background: var(--pg-sun-soft); color: #6b4a00; }
.pg-chip-paused { background: #ecdcdc; color: #6d1d18; }
@media (prefers-color-scheme: dark) { .pg-chip-live { background: #24432d; color: #bde5c5; } .pg-chip-setting_up { color: #f0c060; } .pg-chip-paused { background: #4a2523; color: #ffc9c4; } }
.pg-facts { display: grid; grid-template-columns: max-content 1fr; gap: .5rem 1.2rem; }
.pg-facts dt { font-weight: 700; }
.pg-facts dd { margin: 0; }
.pg-requests { list-style: none; padding: 0; display: grid; gap: 1rem; }
.pg-request { background: var(--pg-surface); border: 1px solid var(--pg-rule); border-radius: var(--pg-radius); padding: 1rem 1.2rem; }
.pg-request h2 { font-size: 1.3rem; }
.pg-request-done { opacity: .75; }
.pg-row { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; }
.pg-row form { margin: 0; }
.pg-soon { text-align: center; padding-top: 4rem; }
.pg-soon .pg-lede { margin-left: auto; margin-right: auto; }
.pg-prose h2 { margin-top: 1.8rem; }

@media (min-width: 720px) {
  .pg-hero-inner { grid-template-columns: 1.2fr .8fr; padding-top: 4rem; padding-bottom: 4rem; }
  .pg-features { grid-template-columns: repeat(2, 1fr); }
  .pg-steps { grid-template-columns: repeat(3, 1fr); }
  .pg-campaigns { grid-template-columns: repeat(2, 1fr); }
  .pg-two { grid-template-columns: 1fr 1fr; }
  .pg-section { padding: 4.5rem 0; }
}
@media (min-width: 1000px) {
  .pg-features { grid-template-columns: repeat(4, 1fr); }
  .pg-campaigns { grid-template-columns: repeat(3, 1fr); }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }