/*
 * Campaign catalog. Built from the reference design's inline styles, restated on the site tokens so
 * light, dark and the brand accent follow the rest of the site. The design's own palette maps as:
 * accent → --color-brand, surface-2 → --color-surface-subtle, border-2 → --color-border-soft,
 * text-2 → --color-text-secondary, text-3 → --color-text-muted, ok/warn → success/warning.
 */
.campaigns-page {
  /* One knob for every text size on the campaign list and campaign pages; widths that hold text follow it. */
  --campaign-scale: 1.12;
  --campaign-accent-soft: rgb(var(--color-brand-rgb) / 10%);
  --campaign-accent-line: rgb(var(--color-brand-rgb) / 34%);
  --campaign-indent: 4.375rem;
  min-width: 0;
  padding-block: 1.625rem 3.75rem;
}
:root[data-theme="dark"] .campaigns-page {
  --campaign-accent-soft: rgb(var(--color-brand-rgb) / 16%);
  --campaign-accent-line: rgb(var(--color-brand-rgb) / 40%);
}

/* Heading and live counters */
.campaigns-head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: .625rem 1rem; margin-bottom: 1rem; min-width: 0; }
.campaigns-head h1 { margin: 0 0 .375rem; font-size: 1.875rem; line-height: 1.1; letter-spacing: -.07rem; font-weight: 700; }
.campaigns-head p { margin: 0; font-size: calc(var(--text-sm) * var(--campaign-scale, 1)); color: var(--color-text-secondary); }
.campaigns-head__stats { display: flex; align-items: center; flex-wrap: wrap; gap: .375rem .875rem; flex: 0 1 auto; font-size: calc(.8125rem * var(--campaign-scale, 1)); color: var(--color-text-secondary); }
.campaigns-stat { display: inline-flex; align-items: center; gap: .375rem; white-space: nowrap; }
.campaigns-stat::before { content: ""; width: 7px; height: 7px; border-radius: var(--radius-pill); flex: none; }
.campaigns-stat--active::before { background: var(--color-success); animation: campaign-pulse 2s infinite; }
.campaigns-stat--ending::before { background: var(--color-warning); }
.campaigns-stat--plain::before { display: none; }
@keyframes campaign-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
@media (prefers-reduced-motion: reduce) { .campaigns-stat--active::before { animation: none; } }

/* Filter panel: only useful with scripting, so it stays out of the way until site.js marks the page. */
.campaigns-filters { display: none; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: .375rem; margin-bottom: .75rem; min-width: 0; }
.has-js .campaigns-filters { display: block; }
.campaigns-filters__row { display: grid; grid-template-columns: minmax(0, 1fr) 11.25rem 10.625rem; gap: .625rem; padding: .875rem 1rem; align-items: end; }
.campaigns-filters .campaigns-filter-field { display: block; min-width: 0; }
.campaigns-filters__label { display: block; font-size: calc(.75rem * var(--campaign-scale, 1)); font-weight: 600; color: var(--color-text-muted); margin-bottom: .3125rem; }
.campaigns-filters__search { position: relative; display: block; }
.campaigns-filters__search svg { position: absolute; left: .6875rem; top: 50%; transform: translateY(-50%); pointer-events: none; }
.campaigns-filters input,
.campaigns-filters select { width: 100%; height: 2.375rem; border-radius: .3125rem; border: 1px solid var(--color-border); background: var(--color-surface-subtle); color: var(--color-text); font: inherit; font-size: calc(var(--text-sm) * var(--campaign-scale, 1)); }
.campaigns-filters input { padding: 0 .6875rem 0 2.0625rem; }
.campaigns-filters select { padding: 0 .5625rem; }
.campaigns-filters input:focus-visible,
.campaigns-filters select:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 1px; border-color: var(--color-brand); }
.campaigns-filters__types { display: flex; align-items: center; gap: .375rem; padding: .625rem 1rem; border-top: 1px solid var(--color-border-soft); flex-wrap: wrap; }
.campaign-chip-button { height: 1.875rem; padding: 0 .6875rem; border-radius: var(--radius-pill); border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-text-secondary); font: inherit; font-size: calc(.78125rem * var(--campaign-scale, 1)); font-weight: 500; white-space: nowrap; cursor: pointer; }
.campaign-chip-button span { font-family: var(--font-mono); color: var(--color-text-muted); margin-left: .25rem; }
.campaign-chip-button:hover { background: var(--campaign-accent-soft); border-color: var(--campaign-accent-line); color: var(--color-text); }
.campaign-chip-button[aria-pressed="true"] { background: var(--campaign-accent-soft); border-color: var(--campaign-accent-line); color: var(--color-text); font-weight: 600; }
.campaign-chip-button[aria-pressed="true"] span { color: var(--color-text-secondary); }
.campaigns-filters__clear { margin-left: auto; background: none; border: 0; padding: 0; font: inherit; font-size: calc(.78125rem * var(--campaign-scale, 1)); font-weight: 600; color: var(--color-text-muted); cursor: pointer; white-space: nowrap; }
.campaigns-filters__clear:hover { color: var(--color-text); }

/* Two columns: the list and a narrow side panel */
.campaigns-layout { display: grid; grid-template-columns: minmax(0, 1fr) 17.5rem; gap: .875rem; align-items: start; }
.campaigns-main,
.campaigns-side { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; min-width: 0; }
.campaigns-side { gap: .875rem; }
.campaigns-count { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.campaigns-count strong { font-size: calc(var(--text-sm) * var(--campaign-scale, 1)); font-weight: 600; white-space: nowrap; }
.campaigns-count span { font-size: calc(.8125rem * var(--campaign-scale, 1)); color: var(--color-text-muted); flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* One campaign */
.campaign { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: .375rem; min-width: 0; }
.campaign[hidden] { display: none; }
.campaign__top { display: flex; align-items: flex-start; gap: .875rem; padding: 1rem 1rem .75rem; min-width: 0; }
.campaign__mark { flex: none; display: inline-flex; }
.campaign__heading { flex: 1 1 0; min-width: 0; }
.campaign__meta { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; font-size: calc(.78125rem * var(--campaign-scale, 1)); color: var(--color-text-secondary); margin-bottom: .1875rem; }
.campaign__meta a { font-weight: 600; color: var(--color-text); text-decoration: none; }
.campaign__meta a:hover { color: var(--color-text-secondary); text-decoration: underline; }
.campaign__meta-sep { color: var(--color-text-muted); }
.campaign__new { font-size: calc(.6875rem * var(--campaign-scale, 1)); font-weight: 600; padding: 1px .375rem; border-radius: .25rem; background: var(--campaign-accent-soft); border: 1px solid var(--campaign-accent-line); color: var(--color-text); }
.campaign__phase { font-size: calc(.6875rem * var(--campaign-scale, 1)); font-weight: 600; padding: 1px .375rem; border-radius: .25rem; background: var(--color-warning-soft); color: var(--color-warning); }
.campaign__title { margin: 0; font-size: 1.0625rem; line-height: 1.25; letter-spacing: -.022rem; font-weight: 700; text-wrap: pretty; }
/* In the list the title leads to the campaign's page. */
.campaign__title a { color: var(--color-text); }
.campaign__title a:hover { color: var(--color-link); }
.campaign__value { flex: none; text-align: right; }
.campaign__value-number { font-family: var(--font-mono); font-size: 1.375rem; font-weight: 500; letter-spacing: -.0375rem; white-space: nowrap; }
/* The figure sets the column width; only its note wraps, at a width that grows with the text. */
.campaign__value-note { max-width: calc(11rem * var(--campaign-scale, 1)); margin-left: auto; font-size: calc(.71875rem * var(--campaign-scale, 1)); color: var(--color-text-muted); }
.campaign__body { padding: 0 1rem .875rem var(--campaign-indent); min-width: 0; }
.campaign__desc { margin: 0 0 .875rem; font-size: calc(var(--text-sm) * var(--campaign-scale, 1)); line-height: 1.6; color: var(--color-text-secondary); text-wrap: pretty; }
/* A list card ends its body with the description. */
.campaign__desc:last-child { margin-bottom: 0; }
.campaign__blocks { display: grid; grid-template-columns: minmax(0, 1fr); gap: .625rem; margin-bottom: .875rem; }

/* Structured blocks */
.campaign-block { border: 1px solid var(--color-border-soft); border-radius: .3125rem; padding: .75rem .875rem; min-width: 0; }
.campaign-block__head { display: flex; align-items: baseline; justify-content: space-between; gap: .625rem; margin-bottom: .625rem; min-width: 0; }
.campaign-block__title { font-size: calc(.71875rem * var(--campaign-scale, 1)); font-weight: 700; letter-spacing: .0375rem; text-transform: uppercase; color: var(--color-text-muted); white-space: nowrap; }
.campaign-block__note { font-size: calc(.75rem * var(--campaign-scale, 1)); color: var(--color-text-muted); text-align: right; min-width: 0; }

.campaign-hours { display: grid; grid-template-columns: repeat(24, 1fr); gap: 2px; height: 1.125rem; }
.campaign-hours span { border-radius: 2px; background: var(--color-surface-subtle); }
.campaign-hours span.is-on { background: var(--color-brand); }
.campaign-hours__scale { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: calc(.6875rem * var(--campaign-scale, 1)); color: var(--color-text-muted); margin-top: .3125rem; }
.campaign-days { display: flex; gap: .25rem; margin-top: .625rem; }
.campaign-days span { flex: 1; height: 1.5rem; border-radius: .25rem; display: flex; align-items: center; justify-content: center; font-size: calc(.75rem * var(--campaign-scale, 1)); font-weight: 600; border: 1px solid var(--color-border-soft); color: var(--color-text-muted); text-decoration: line-through; }
.campaign-days span.is-on { background: var(--campaign-accent-soft); border-color: var(--campaign-accent-line); color: var(--color-text); text-decoration: none; }

.campaign-price { display: grid; grid-template-columns: minmax(0, 1fr) 4.5rem 1rem 4.5rem 3.5rem; gap: .5rem; align-items: baseline; padding: .375rem 0; border-top: 1px solid var(--color-border-soft); font-size: calc(.8125rem * var(--campaign-scale, 1)); }
.campaign-price__label { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.campaign-price__old { font-family: var(--font-mono); color: var(--color-text-muted); text-decoration: line-through; text-align: right; white-space: nowrap; }
.campaign-price__arrow { color: var(--color-text-muted); text-align: center; }
.campaign-price__new { font-family: var(--font-mono); font-weight: 500; text-align: right; white-space: nowrap; }
.campaign-price__save { font-family: var(--font-mono); font-size: calc(.75rem * var(--campaign-scale, 1)); color: var(--color-success); text-align: right; white-space: nowrap; }

.campaign-tiers { display: grid; gap: 0; }
.campaign-tier { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem; align-items: center; padding: .4375rem .625rem; border-radius: .25rem; border: 1px solid transparent; font-size: calc(.8125rem * var(--campaign-scale, 1)); }
.campaign-tier__cond { color: var(--color-text-secondary); min-width: 0; }
.campaign-tier__benefit { font-family: var(--font-mono); font-weight: 500; white-space: nowrap; text-align: right; }
.campaign-tier--highlight { background: var(--campaign-accent-soft); border-color: var(--campaign-accent-line); }

.campaign-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); gap: .5rem; }
.campaign-plan { border-radius: .3125rem; padding: .625rem .6875rem; border: 1px solid var(--color-border-soft); min-width: 0; }
.campaign-plan--highlight { border-color: var(--campaign-accent-line); background: var(--campaign-accent-soft); }
.campaign-plan--past { opacity: .72; }
/* The reward calendar keeps its size: each phase box is a third of the block and a date range stays on one line. */
.campaign-plan__top { display: flex; justify-content: space-between; gap: .375rem; font-size: .78125rem; font-weight: 600; margin-bottom: .25rem; }
.campaign-plan__tag { font-size: .6875rem; color: var(--color-text-muted); font-weight: 500; white-space: nowrap; }
.campaign-plan__value { font-family: var(--font-mono); font-size: 1.0625rem; font-weight: 500; letter-spacing: -.025rem; }
.campaign-plan__detail { font-size: .75rem; color: var(--color-text-muted); margin-top: .125rem; }

.campaign-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: .625rem; margin: 0; padding: 0; list-style: none; counter-reset: campaign-step; }
.campaign-steps li { display: flex; gap: .5625rem; min-width: 0; counter-increment: campaign-step; font-size: calc(.8125rem * var(--campaign-scale, 1)); line-height: 1.4; color: var(--color-text-secondary); }
.campaign-steps li::before { content: counter(campaign-step); width: 1.375rem; height: 1.375rem; border-radius: var(--radius-pill); border: 1px solid var(--campaign-accent-line); background: var(--campaign-accent-soft); display: flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: calc(.71875rem * var(--campaign-scale, 1)); font-weight: 500; color: var(--color-text); flex: none; }

.campaign-quota { height: .5rem; border-radius: var(--radius-pill); background: var(--color-surface-subtle); overflow: hidden; }
.campaign-quota span { display: block; height: 100%; border-radius: var(--radius-pill); background: var(--color-brand); }
.campaign-quota--late span { background: var(--color-warning); }
.campaign-quota__legend { display: flex; justify-content: space-between; gap: .5rem; font-size: calc(.78125rem * var(--campaign-scale, 1)); margin-top: .375rem; }
.campaign-quota__legend span:first-child { color: var(--color-text-secondary); }
.campaign-quota__legend span:last-child { font-family: var(--font-mono); font-weight: 500; white-space: nowrap; }
.campaign-quota--late + .campaign-quota__legend span:last-child { color: var(--color-warning); }

.campaign-chips { display: flex; gap: .3125rem; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; }
.campaign-chips li { min-height: 1.625rem; padding: .125rem .5625rem; border-radius: .25rem; border: 1px solid var(--color-border); background: var(--color-surface-subtle); font-size: calc(.78125rem * var(--campaign-scale, 1)); display: flex; align-items: center; }
.campaign-chips__more summary { cursor: pointer; font-size: calc(.78125rem * var(--campaign-scale, 1)); font-weight: 600; color: var(--color-text-secondary); margin-top: .5rem; }
.campaign-chips__more[open] summary { margin-bottom: .375rem; }

/* Conditions */
.campaign__terms-title { font-size: calc(.71875rem * var(--campaign-scale, 1)); font-weight: 700; letter-spacing: .0375rem; text-transform: uppercase; color: var(--color-text-muted); margin-bottom: .375rem; }
.campaign__terms { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .25rem 1.25rem; margin: 0; padding: 0; list-style: none; }
.campaign__terms li { display: flex; gap: .5rem; font-size: calc(.8125rem * var(--campaign-scale, 1)); line-height: 1.45; color: var(--color-text-secondary); min-width: 0; }
.campaign__terms li::before { content: ""; width: 4px; height: 4px; border-radius: var(--radius-pill); background: var(--color-text-muted); flex: none; margin-top: .5rem; }
.campaign__more { margin-top: .375rem; }
.campaign__more summary { cursor: pointer; font-size: calc(.78125rem * var(--campaign-scale, 1)); font-weight: 600; color: var(--color-text-secondary); }
.campaign__more[open] summary { margin-bottom: .375rem; }

/* Footer strip */
.campaign__foot { display: flex; align-items: center; gap: .875rem; padding: .6875rem 1rem .6875rem var(--campaign-indent); border-top: 1px solid var(--color-border-soft); min-width: 0; flex-wrap: wrap; }
.campaign__due { display: inline-flex; align-items: center; gap: .375rem; font-size: calc(.8125rem * var(--campaign-scale, 1)); flex-wrap: wrap; }
.campaign__due strong { font-weight: 600; color: var(--color-success); }
.campaign__due::before { content: ""; width: 7px; height: 7px; border-radius: var(--radius-pill); background: var(--color-success); flex: none; }
.campaign__due--soon strong { color: var(--color-warning); }
.campaign__due--soon::before { background: var(--color-warning); }
.campaign__dates { color: var(--color-text-muted); white-space: nowrap; }
.campaign__scope { font-size: calc(.8125rem * var(--campaign-scale, 1)); color: var(--color-text-muted); }
.campaign__action { margin-left: auto; display: flex; align-items: center; gap: .5rem; flex: none; min-width: 0; }
.campaign__how { font-size: calc(.78125rem * var(--campaign-scale, 1)); color: var(--color-text-muted); }
.campaign__code { height: 2rem; padding: 0 .625rem; border-radius: .3125rem; border: 1px dashed var(--campaign-accent-line); background: var(--campaign-accent-soft); font-family: var(--font-mono); font-size: calc(.8125rem * var(--campaign-scale, 1)); font-weight: 500; display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; color: var(--color-text); cursor: pointer; }
.campaign__code:hover { border-style: solid; }
.campaign__code span { font-family: var(--font-sans); font-size: calc(.75rem * var(--campaign-scale, 1)); font-weight: 600; color: var(--color-text-secondary); }
.campaign__stations { font-size: calc(.78125rem * var(--campaign-scale, 1)); font-weight: 600; }

/* Empty state, archive, side panels */
.campaigns-empty { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: .375rem; padding: 2.25rem 1rem; text-align: center; }
.campaigns-empty[hidden] { display: none; }
.campaigns-empty strong { display: block; font-size: calc(.9375rem * var(--campaign-scale, 1)); margin-bottom: .25rem; }
.campaigns-empty p { margin: 0 0 .75rem; font-size: calc(.84375rem * var(--campaign-scale, 1)); color: var(--color-text-secondary); }
.campaigns-panel { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: .375rem; min-width: 0; }
.campaigns-panel h2 { margin: 0; font-size: .9375rem; font-weight: 700; letter-spacing: -.0125rem; }
.campaigns-panel__head { display: flex; align-items: center; gap: .75rem; padding: .875rem 1rem .625rem; }
.campaigns-panel__head span { font-size: calc(.78125rem * var(--campaign-scale, 1)); color: var(--color-text-muted); flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.campaigns-panel__body { padding: 1rem; }
.campaigns-panel__body p { margin: 0; font-size: calc(.78125rem * var(--campaign-scale, 1)); line-height: 1.55; color: var(--color-text-muted); }
.campaigns-panel__body .button { width: 100%; margin-top: .75rem; }
.campaigns-ending { display: block; padding: .625rem 1rem; border-top: 1px solid var(--color-border-soft); color: inherit; text-decoration: none; }
.campaigns-ending:hover { background: var(--color-surface-subtle); }
.campaigns-ending__top { display: flex; justify-content: space-between; gap: .5rem; margin-bottom: .125rem; }
.campaigns-ending__op { font-size: calc(.8125rem * var(--campaign-scale, 1)); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.campaigns-ending__due { font-size: calc(.78125rem * var(--campaign-scale, 1)); font-weight: 600; color: var(--color-warning); white-space: nowrap; }
.campaigns-ending__title { font-size: calc(.78125rem * var(--campaign-scale, 1)); line-height: 1.4; color: var(--color-text-secondary); }
.campaigns-operator { display: flex; align-items: center; gap: .625rem; width: 100%; text-align: left; padding: .5rem 1rem; border: 0; border-top: 1px solid var(--color-border-soft); background: none; font: inherit; color: inherit; cursor: pointer; }
.campaigns-operator:hover { background: var(--color-surface-subtle); }
.campaigns-operator[aria-pressed="true"] { background: var(--campaign-accent-soft); }
.campaigns-operator__name { font-size: calc(.8125rem * var(--campaign-scale, 1)); font-weight: 600; width: calc(5.75rem * var(--campaign-scale, 1)); flex: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.campaigns-operator__bar { flex: 1 1 0; height: 4px; border-radius: var(--radius-pill); background: var(--color-surface-subtle); overflow: hidden; min-width: 0; }
.campaigns-operator__bar span { display: block; height: 100%; border-radius: var(--radius-pill); background: var(--color-text-muted); }
.campaigns-operator[aria-pressed="true"] .campaigns-operator__bar span { background: var(--color-brand); }
.campaigns-operator__count { font-family: var(--font-mono); font-size: calc(.78125rem * var(--campaign-scale, 1)); color: var(--color-text-secondary); width: 1.125rem; text-align: right; flex: none; }
.campaigns-archive-row { display: grid; grid-template-columns: calc(6rem * var(--campaign-scale, 1)) minmax(0, 1fr) auto; gap: .75rem; align-items: center; padding: .625rem 1rem; border-top: 1px solid var(--color-border-soft); font-size: calc(.8125rem * var(--campaign-scale, 1)); }
.campaigns-archive-row__op { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.campaigns-archive-row__title { color: var(--color-text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* The title leads to the ended campaign's own page; the rest of the row opens its record here. */
.campaigns-archive-row__link { color: inherit; }
.campaigns-archive-row__link:hover { color: var(--color-link); }
.campaigns-archive-row__ended { font-family: var(--font-mono); font-size: calc(.78125rem * var(--campaign-scale, 1)); color: var(--color-text-muted); white-space: nowrap; }
.campaigns-archive__older summary { padding: .625rem 1rem; border-top: 1px solid var(--color-border-soft); cursor: pointer; font-size: calc(.8125rem * var(--campaign-scale, 1)); font-weight: 600; color: var(--color-text-secondary); }
.campaigns-disclaimer { margin: 1.25rem 0 0; font-size: calc(.78125rem * var(--campaign-scale, 1)); line-height: 1.6; color: var(--color-text-muted); }

/* Narrow screens: one column, the card body loses its logo indent, grids fold to a single track. */
@media (max-width: 61.99rem) {
  .campaigns-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 43.99rem) {
  /* A long status line wraps on a phone instead of running past the screen edge. */
  .campaigns-stat { white-space: normal; }
  .campaigns-page { --campaign-indent: 1rem; padding-block-start: 1rem; }
  .campaigns-head { flex-direction: column; align-items: flex-start; gap: .625rem; }
  .campaigns-head h1 { font-size: 1.625rem; }
  .campaigns-head__stats { flex-wrap: wrap; gap: .375rem .875rem; }
  .campaigns-filters__row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding: .75rem; }
  .campaigns-filters__row > .campaigns-filter-field:first-child { grid-column: 1 / -1; }
  .campaigns-filters__types { padding: .625rem .75rem; }
  .campaign__top { flex-wrap: wrap; gap: .75rem; padding: .875rem 1rem .625rem; }
  .campaign__heading { flex-basis: calc(100% - 3.5rem); }
  .campaign__value { order: 3; text-align: left; max-width: none; display: flex; flex: 1 1 100%; flex-wrap: wrap; min-width: 0; align-items: baseline; gap: 0 .5rem; padding-left: calc(36px + .75rem); }
  .campaign__value-note { max-width: none; margin-left: 0; }
  .campaign__terms { grid-template-columns: minmax(0, 1fr); }
  .campaign-price { grid-template-columns: minmax(0, 1fr) 3.75rem .75rem 3.75rem 2.75rem; gap: .3125rem; font-size: calc(.78125rem * var(--campaign-scale, 1)); }
  .campaign-days span { font-size: calc(.6875rem * var(--campaign-scale, 1)); }
  .campaign__action { margin-left: 0; width: 100%; }
  .campaigns-archive-row { grid-template-columns: minmax(0, 1fr) auto; }
  .campaigns-archive-row__op { grid-column: 1 / -1; }
}

/* Bar widths come from data-w in steps of five: the page CSP forbids style attributes. */
.campaign-meter[data-w="0"] > span { width: 0%; }
.campaign-meter[data-w="5"] > span { width: 5%; }
.campaign-meter[data-w="10"] > span { width: 10%; }
.campaign-meter[data-w="15"] > span { width: 15%; }
.campaign-meter[data-w="20"] > span { width: 20%; }
.campaign-meter[data-w="25"] > span { width: 25%; }
.campaign-meter[data-w="30"] > span { width: 30%; }
.campaign-meter[data-w="35"] > span { width: 35%; }
.campaign-meter[data-w="40"] > span { width: 40%; }
.campaign-meter[data-w="45"] > span { width: 45%; }
.campaign-meter[data-w="50"] > span { width: 50%; }
.campaign-meter[data-w="55"] > span { width: 55%; }
.campaign-meter[data-w="60"] > span { width: 60%; }
.campaign-meter[data-w="65"] > span { width: 65%; }
.campaign-meter[data-w="70"] > span { width: 70%; }
.campaign-meter[data-w="75"] > span { width: 75%; }
.campaign-meter[data-w="80"] > span { width: 80%; }
.campaign-meter[data-w="85"] > span { width: 85%; }
.campaign-meter[data-w="90"] > span { width: 90%; }
.campaign-meter[data-w="95"] > span { width: 95%; }
.campaign-meter[data-w="100"] > span { width: 100%; }

/* Card pieces added with the presenter */
.campaigns-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; min-width: 0; }
.campaign__mark-count { width: 36px; height: 36px; border-radius: .3125rem; background: var(--campaign-accent-soft); border: 1px solid var(--campaign-accent-line); display: flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: calc(.8125rem * var(--campaign-scale, 1)); font-weight: 600; color: var(--color-text); }
.campaign__networks { font-weight: 600; color: var(--color-text); }
.campaign__value--muted .campaign__value-number { color: var(--color-text-secondary); }
.campaign__terms li.is-pinned::before { background: var(--color-warning); }
.campaign__terms li.is-pinned { color: var(--color-text); }
.campaign__fulltext { margin: .375rem 0 0; font-size: calc(.8125rem * var(--campaign-scale, 1)); line-height: 1.6; color: var(--color-text-secondary); white-space: pre-line; }
.campaign-chips li.is-struck { color: var(--color-text-muted); text-decoration: line-through; background: none; border-color: var(--color-border-soft); }
.campaign-chips a { color: var(--color-text); text-decoration: none; }
.campaign-chips a:hover { text-decoration: underline; }
.campaign-places { margin: 0; padding-left: 1rem; font-size: calc(.78125rem * var(--campaign-scale, 1)); line-height: 1.6; color: var(--color-text-secondary); columns: 2 16rem; }
.campaigns-ending__group { padding: .625rem 1rem; border-top: 1px solid var(--color-border-soft); }
.campaigns-ending__group > strong { display: block; font-size: calc(.78125rem * var(--campaign-scale, 1)); font-weight: 600; color: var(--color-warning); margin-bottom: .25rem; }
.campaigns-ending__group a { font-size: calc(.78125rem * var(--campaign-scale, 1)); color: var(--color-text-secondary); }
.campaigns-ending__group a:hover { color: var(--color-text); }
.campaigns-ending__line { display: block; line-height: 1.45; }
.campaigns-ending__line strong { color: var(--color-text); font-weight: 600; }
.campaigns-operators__note { padding: 0 1rem .5rem; margin: -.25rem 0 0; font-size: calc(.75rem * var(--campaign-scale, 1)); color: var(--color-text-muted); }
.campaigns-operators__more summary { padding: .5rem 1rem; border-top: 1px solid var(--color-border-soft); cursor: pointer; font-size: calc(.78125rem * var(--campaign-scale, 1)); font-weight: 600; color: var(--color-text-secondary); }
.campaigns-panel--accent { border-color: var(--campaign-accent-line); }
.campaigns-panel__count { margin-top: .625rem !important; font-family: var(--font-mono); color: var(--color-text-secondary) !important; }
.campaigns-js-only { display: none; }
.has-js .campaigns-js-only { display: inline-flex; }
.campaigns-filters__sep { width: 1px; height: 1.125rem; background: var(--color-border); margin: 0 .25rem; }
.campaigns-archive-item > summary { list-style: none; cursor: pointer; }
.campaigns-archive-item > summary::-webkit-details-marker { display: none; }
.campaigns-archive-item > summary:hover { background: var(--color-surface-subtle); }
.campaigns-archive-item[open] > summary { background: var(--color-surface-subtle); }
.campaigns-archive-body { padding: .75rem 1rem 1rem; border-top: 1px dashed var(--color-border-soft); }
.campaigns-archive-body__note { margin: 0 0 .625rem; font-size: calc(.78125rem * var(--campaign-scale, 1)); color: var(--color-text-muted); }
.campaigns-archive-body__value { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; margin-bottom: .5rem; }
.campaigns-archive-body__value strong { font-family: var(--font-mono); font-size: 1.0625rem; font-weight: 500; }
.campaigns-archive-body__value span { font-size: calc(.78125rem * var(--campaign-scale, 1)); color: var(--color-text-muted); }

/* Section title directly above the result count. */
.campaigns-title { margin: 0; font-size: var(--text-card-title); font-weight: 700; letter-spacing: -.01em; line-height: 1.3; }

/* The shared sign-up promo, stacked to fit the side column. */
.campaigns-side .signup-promo { flex-direction: column; align-items: stretch; gap: .75rem; margin: 0; padding: 1rem; border-radius: .375rem; }
.campaigns-side .signup-promo__copy { flex: 0 0 auto; }
.campaigns-side .signup-promo__cta { justify-content: center; width: 100%; }