/* CCSA Natal Midlands App v55.12.21 — consolidated stylesheet. */

/* ===== BEGIN styles.css ===== */
@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=Public+Sans:wght@400;500;600;700;800&display=swap");

:root,
[data-theme="bark"] {
  --bg: #17110d;
  --bg-soft: #201711;
  --surface: #211711;
  --surface-raised: #2a1d15;
  --surface-soft: #312219;
  --cream: #f8f0e3;
  --ink: #17100b;
  --muted: #b8aa98;
  --border: rgba(224, 186, 112, 0.16);
  --border-strong: rgba(224, 186, 112, 0.34);
  --gold: #d6aa4b;
  --gold-light: #f0d38c;
  --rust: #b9532b;
  --rust-light: #d87342;
  --green: #4f8e5e;
  --blue: #4f7d91;
  --plum: #80617e;
  --amber: #c78c3f;
  --crest-bg: #f7efe1;
  --hero-text: #fff9ef;
  --hero-muted: rgba(255, 249, 239, 0.72);
  --shadow: 0 18px 46px rgba(0, 0, 0, 0.34);
  --card-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
}


[data-theme="ccsa-green"] {
  --bg: #102017;
  --bg-soft: #172b1e;
  --surface: #17281c;
  --surface-raised: #1e3324;
  --surface-soft: #26402d;
  --cream: #f7f2e1;
  --ink: #0b160f;
  --muted: #b7c1b4;
  --border: rgba(239, 198, 47, 0.15);
  --border-strong: rgba(239, 198, 47, 0.34);
  --gold: #efc62f;
  --gold-light: #ffe27c;
  --rust: #c4902d;
  --rust-light: #d8ad4a;
  --green: #3d8c55;
  --blue: #4e8190;
  --plum: #78647f;
  --amber: #ce9b35;
  --crest-bg: #f7f2e1;
  --hero-text: #fffbea;
  --hero-muted: rgba(255, 251, 234, 0.75);
  --shadow: 0 20px 52px rgba(0, 0, 0, 0.34);
  --card-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
}


:root {
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --radius-xl: 26px;
  --radius-lg: 20px;
  --radius-md: 16px;
  --tap-min: 72px;
}

* { box-sizing: border-box; }
html { background: var(--bg);  }
html, body { margin: 0; padding: 0; }
body {
  min-height: 100vh;
  min-height: 100dvh;
  background:
    radial-gradient(circle at 50% -10%, color-mix(in srgb, var(--gold) 8%, transparent), transparent 34rem),
    var(--bg);
  color: var(--cream);
  font-family: var(--font-body);
  -webkit-tap-highlight-color: transparent;
  
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; cursor: pointer; }
button, a { -webkit-touch-callout: none; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }

/* ---------- App shell ---------- */
.app {
  width: 100%;
  max-width: 560px;
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0 auto;
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--bg);
  box-shadow: var(--shadow);
  overflow: clip;
}

@media (min-width: 600px) {
  body { padding: 20px 0; }
  .app {
    min-height: calc(100dvh - 40px);
    border: 1px solid var(--border);
    border-radius: 30px;
  }
}

/* ---------- Install banner ---------- */
.install-banner {
  display: none;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: linear-gradient(135deg, var(--gold), var(--gold-light));
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 8px 22px rgba(0,0,0,.16);
  position: relative;
  z-index: 30;
}
.install-banner.visible { display: flex; }
.install-symbol {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(255,255,255,.35);
  flex: 0 0 auto;
}
.install-symbol svg { width: 18px; height: 18px; }
.install-banner button {
  border: 0;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}
.install-banner #installBtn {
  margin-left: auto;
  padding: 8px 13px;
  background: var(--ink);
  color: #fff;
}
.install-banner .dismiss {
  background: transparent;
  color: var(--ink);
  font-size: 21px;
  line-height: 1;
  padding: 3px 4px;
}

/* ---------- Premium hero ---------- */
.hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding: 26px 22px 28px;
  text-align: center;
  color: var(--hero-text);
  background:
    linear-gradient(165deg, color-mix(in srgb, var(--surface-soft) 75%, var(--bg)) 0%, var(--bg) 72%);
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: .18;
  background-image:
    linear-gradient(115deg, transparent 0 48%, rgba(255,255,255,.04) 49% 50%, transparent 51% 100%),
    radial-gradient(circle, rgba(255,255,255,.18) .7px, transparent .8px);
  background-size: 100% 100%, 18px 18px;
}
.hero-glow {
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  filter: blur(1px);
  pointer-events: none;
}
.hero-glow-one {
  width: 230px;
  height: 230px;
  top: -130px;
  left: -70px;
  background: color-mix(in srgb, var(--gold) 22%, transparent);
}
.hero-glow-two {
  width: 180px;
  height: 180px;
  right: -90px;
  bottom: -75px;
  background: color-mix(in srgb, var(--rust) 18%, transparent);
}
.theme-toggle {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 42px;
  height: 42px;
  z-index: 3;
  display: grid;
  place-items: center;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.08);
  color: var(--hero-text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter: blur(12px);
}
.theme-toggle svg { width: 20px; height: 20px; }
.eyebrow {
  margin-bottom: 12px;
  color: var(--gold-light);
  font-size: 10px;
  line-height: 1.4;
  font-weight: 800;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.crest-wrap {
  position: relative;
  width: 100px;
  height: 100px;
  margin: 0 auto 15px;
  display: grid;
  place-items: center;
}
.crest-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(from 180deg, var(--gold), var(--gold-light), var(--gold), color-mix(in srgb, var(--gold) 60%, transparent), var(--gold));
  box-shadow:
    0 15px 36px rgba(0,0,0,.28),
    0 0 0 5px rgba(255,255,255,.035);
}
.crest {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  padding: 10px;
  display: grid;
  place-items: center;
  background: var(--crest-bg);
  position: relative;
  z-index: 1;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
}
.crest img { width: 100%; height: 100%; object-fit: contain; }
.hero h1 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(26px, 7.2vw, 34px);
  font-weight: 700;
  letter-spacing: -.02em;
  text-shadow: 0 3px 15px rgba(0,0,0,.28);
}
.tagline {
  margin: 7px 0 20px;
  color: var(--hero-muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.6;
}
.tagline span { color: var(--gold); padding: 0 2px; }
.clock {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
  width: min(100%, 380px);
  margin: 0 auto;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  background: rgba(0,0,0,.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(12px);
}
.clock-marker {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--gold) 16%, transparent);
}
.clock .date {
  color: var(--hero-muted);
  font-size: 11px;
  line-height: 1.35;
  text-align: left;
}
.clock .time {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
}

/* ---------- Main navigation ---------- */
main { padding: 2px 16px 112px; }
.menu-section { margin-top: 26px; }
.menu-section:first-child { margin-top: 8px; }
.section-heading {
  display: flex;
  align-items: flex-end;
  gap: 14px;
  margin: 0 4px 13px;
}
.section-kicker {
  display: block;
  margin-bottom: 2px;
  color: var(--gold);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.section-heading h2 {
  margin: 0;
  color: var(--cream);
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: -.01em;
}
.section-rule {
  height: 1px;
  flex: 1;
  margin-bottom: 6px;
  background: linear-gradient(90deg, var(--border-strong), transparent);
}
.grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.tile {
  --accent: var(--gold);
  position: relative;
  min-width: 0;
  min-height: 126px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--accent) 9%, transparent), transparent 65%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow:
    var(--card-shadow),
    inset 0 1px 0 rgba(255,255,255,.04);
  
}
.tile::after {
  content: "";
  position: absolute;
  inset: auto 14px 0 14px;
  height: 2px;
  border-radius: 999px 999px 0 0;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 65%, transparent), transparent);
  opacity: .45;
}
.tile:active { transform: scale(.975); }
@media (hover:hover) {
  .tile:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--accent) 36%, var(--border));
    box-shadow: 0 18px 38px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.06);
  }
}
.tone-gold { --accent: var(--gold); }
.tone-rust { --accent: var(--rust-light); }
.tone-green { --accent: var(--green); }
.tone-blue { --accent: var(--blue); }
.tone-plum { --accent: var(--plum); }
.tone-amber { --accent: var(--amber); }
.icon-box {
  width: 50px;
  height: 50px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 16px;
  color: var(--accent);
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 18%, var(--surface-raised)), color-mix(in srgb, var(--accent) 7%, var(--surface)));
  border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 8px 18px color-mix(in srgb, var(--accent) 10%, transparent);
}
.icon-box svg { width: 30px; height: 30px; overflow: visible; }
.icon-soft {
  fill: currentColor;
  fill-opacity: .13;
  stroke: none;
}
.icon-line {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.icon-detail { fill: currentColor; stroke: none; opacity: .9; }
.tile-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
}
.tile .label {
  display: block;
  color: var(--cream);
  font-size: 15px;
  line-height: 1.22;
  font-weight: 750;
  letter-spacing: -.015em;
}
.tile .sub {
  display: block;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.38;
  font-weight: 500;
}
.mini-arrow {
  position: absolute;
  top: 18px;
  right: 14px;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  color: color-mix(in srgb, var(--accent) 80%, var(--cream));
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  font-size: 20px;
  line-height: 1;
}
.tile.featured {
  grid-column: 1 / -1;
  min-height: 122px;
  padding: 18px;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 15px;
  color: #fff;
  border-color: rgba(255,255,255,.13);
  background:
    radial-gradient(circle at 95% 0%, rgba(255,255,255,.18), transparent 38%),
    linear-gradient(135deg, color-mix(in srgb, var(--rust) 92%, #46180e), color-mix(in srgb, var(--rust-light) 82%, #7b260f));
  box-shadow: 0 18px 38px color-mix(in srgb, var(--rust) 26%, rgba(0,0,0,.28));
}
.tile.featured::after { display: none; }
.featured-shine {
  position: absolute;
  width: 190px;
  height: 190px;
  right: -70px;
  bottom: -120px;
  border-radius: 50%;
  border: 28px solid rgba(255,255,255,.045);
}
.icon-box-large {
  width: 66px;
  height: 66px;
  border-radius: 21px;
  color: #fff4df;
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 12px 24px rgba(0,0,0,.14);
}
.icon-box-large svg { width: 42px; height: 42px; }
.tile.featured .tile-copy { gap: 2px; flex: 1; }
.tile.featured .tile-overline {
  color: rgba(255,255,255,.65);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.tile.featured .label { color: #fff; font-size: 19px; font-weight: 800; }
.tile.featured .sub { color: rgba(255,255,255,.78); font-size: 12px; }
.tile-action {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.16);
}
.tile-action svg { width: 18px; height: 18px; }
.tile-wide {
  grid-column: 1 / -1;
  min-height: 82px;
  padding: 13px 14px;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 13px;
}
.tile-wide .icon-box { width: 48px; height: 48px; border-radius: 15px; }
.tile-wide .tile-copy { flex: 1; }
.tile-wide .label { font-size: 14px; }
.external-mark {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  color: color-mix(in srgb, var(--accent) 80%, var(--cream));
}
.external-mark svg { width: 18px; height: 18px; }
.admin-card { min-height: 88px; }
.locked-pill {
  padding: 7px 10px;
  border-radius: 999px;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

/* ---------- Placeholder screen ---------- */
.screen {
  flex: 1;
  min-height: calc(100dvh - 78px);
  padding: 24px 18px 120px;
  background:
    radial-gradient(circle at 90% 0%, color-mix(in srgb, var(--gold) 9%, transparent), transparent 24rem),
    var(--bg);
}
.screen-header {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 28px;
}
.back-btn {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--surface-raised);
  box-shadow: var(--card-shadow);
}
.screen-kicker {
  display: block;
  color: var(--gold);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.screen-header h2 {
  margin: 1px 0 0;
  font-family: var(--font-display);
  font-size: 24px;
  font-weight: 700;
}
.coming-soon {
  padding: 40px 24px;
  text-align: center;
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--gold) 10%, transparent), transparent 55%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: var(--card-shadow);
}
.status-icon {
  width: 72px;
  height: 72px;
  margin: 0 auto 16px;
  display: grid;
  place-items: center;
  border-radius: 24px;
  color: var(--gold);
  background: color-mix(in srgb, var(--gold) 10%, var(--surface-raised));
  border: 1px solid color-mix(in srgb, var(--gold) 24%, transparent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.status-icon svg { width: 40px; height: 40px; }
.status-pill {
  display: inline-block;
  margin-bottom: 10px;
  padding: 6px 10px;
  border-radius: 999px;
  color: var(--gold);
  background: color-mix(in srgb, var(--gold) 10%, transparent);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.coming-soon h3 {
  margin: 0 0 8px;
  font-family: var(--font-display);
  font-size: 21px;
}
.coming-soon p {
  max-width: 360px;
  margin: 0 auto;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.65;
}

/* ---------- Theme picker ---------- */
.theme-sheet {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: none;
}
.theme-sheet.open { display: block; }
.theme-sheet .backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.64);
  backdrop-filter: blur(4px);
}
.theme-sheet .panel {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 100%;
  max-width: 560px;
  padding: 10px 18px calc(20px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  border: 1px solid var(--border);
  border-bottom: 0;
  border-radius: 28px 28px 0 0;
  background: var(--bg-soft);
  box-shadow: 0 -20px 60px rgba(0,0,0,.34);
  max-height: min(92dvh, 760px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.sheet-handle {
  width: 42px;
  height: 4px;
  margin: 0 auto 18px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--cream) 20%, transparent);
}
.sheet-kicker {
  color: var(--gold);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.theme-sheet h3 {
  margin: 3px 0 4px;
  font-family: var(--font-display);
  font-size: 22px;
}
.theme-sheet .hint {
  margin: 0 0 16px;
  color: var(--muted);
  font-size: 12px;
}
.theme-options { display: grid; gap: 10px; }
.theme-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px;
  text-align: left;
  border: 1px solid var(--border);
  border-radius: 17px;
  background: var(--surface);
}
.theme-option.selected {
  border-color: var(--gold);
  box-shadow: inset 0 0 0 1px var(--gold);
}
.swatch-group { display: flex; padding-left: 8px; }
.swatch-group span {
  width: 24px;
  height: 24px;
  margin-left: -8px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,.55);
  box-shadow: 0 2px 6px rgba(0,0,0,.16);
}
.option-copy { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.theme-option .name { font-size: 13px; font-weight: 800; }
.theme-option .desc { color: var(--muted); font-size: 11px; }
.option-check {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--bg);
  background: transparent;
  font-size: 13px;
  opacity: 0;
}
.theme-option.selected .option-check { background: var(--gold); opacity: 1; }

/* ---------- Bottom navigation ---------- */
.tabbar {
  position: fixed;
  left: 50%;
  bottom: 0;
  width: 100%;
  max-width: 560px;
  z-index: 40;
  display: flex;
  gap: 4px;
  padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-soft) 92%, transparent);
  box-shadow: 0 -10px 30px rgba(0,0,0,.18);
  backdrop-filter: blur(18px);
}
.tabbar button {
  flex: 1;
  min-width: 0;
  padding: 6px 3px 5px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  
}
.tab-icon {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  border-radius: 11px;
}
.tab-icon svg { width: 21px; height: 21px; }
.tabbar button.active { color: var(--gold); }
.tabbar button.active .tab-icon {
  background: color-mix(in srgb, var(--gold) 12%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--gold) 18%, transparent);
}

@media (max-width: 370px) {
  .hero { padding-inline: 16px; }
  main { padding-inline: 12px; }
  .grid { gap: 10px; }
  .tile { min-height: 118px; padding: 12px; }
  .icon-box { width: 46px; height: 46px; border-radius: 14px; }
  .icon-box svg { width: 28px; height: 28px; }
  .tile .label { font-size: 14px; }
  .tile.featured { padding: 15px; gap: 12px; }
  .icon-box-large { width: 58px; height: 58px; }
  .tile.featured .label { font-size: 18px; }
  .clock { grid-template-columns: auto 1fr; }
  .clock .time { grid-column: 2; justify-self: start; }
}

/* ================================================================
   RALLIES 2026
   ================================================================ */
.sheet-open { overflow: hidden; }
.rallies-screen {
  padding-top: 20px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--rust) 12%, transparent), transparent 24rem),
    radial-gradient(circle at 0% 40%, color-mix(in srgb, var(--gold) 7%, transparent), transparent 22rem),
    var(--bg);
}
.rallies-page-header { margin-bottom: 18px; }

.rally-spotlight {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-bottom: 18px;
  padding: 19px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-xl);
  color: #fffaf0;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--rust) 94%, #3b160d), color-mix(in srgb, var(--rust-light) 74%, #6d250f));
  box-shadow: 0 22px 48px color-mix(in srgb, var(--rust) 27%, rgba(0,0,0,.32));
}
.rally-spotlight::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: .22;
  background-image: radial-gradient(circle, rgba(255,255,255,.25) .7px, transparent .8px);
  background-size: 17px 17px;
  mask-image: linear-gradient(to bottom, black, transparent 72%);
}
.spotlight-glow {
  position: absolute;
  z-index: -1;
  width: 210px;
  height: 210px;
  right: -90px;
  top: -105px;
  border-radius: 50%;
  background: rgba(255,255,255,.12);
  box-shadow: 0 0 0 34px rgba(255,255,255,.035), 0 0 0 70px rgba(255,255,255,.022);
}
.spotlight-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 17px;
}
.spotlight-label,
.spotlight-position {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.spotlight-label { display: flex; align-items: center; gap: 7px; color: rgba(255,255,255,.9); }
.spotlight-position {
  padding: 6px 9px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 999px;
  color: rgba(255,255,255,.72);
  background: rgba(255,255,255,.08);
}
.pulse-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff2c7;
  box-shadow: 0 0 0 0 rgba(255,242,199,.55);
  
}

.spotlight-content { display: flex; align-items: center; gap: 14px; }
.spotlight-icon {
  width: 64px;
  height: 64px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 20px;
  color: #fff5dd;
  background: rgba(255,255,255,.11);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 12px 24px rgba(0,0,0,.14);
}
.spotlight-icon svg { width: 40px; height: 40px; }
.spotlight-copy { min-width: 0; }
.spotlight-type {
  display: block;
  margin-bottom: 3px;
  color: rgba(255,255,255,.66);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.spotlight-copy h3 {
  margin: 0 0 4px;
  font-family: var(--font-display);
  font-size: 23px;
  line-height: 1.08;
  letter-spacing: -.02em;
}
.spotlight-copy p { margin: 0; color: rgba(255,255,255,.78); font-size: 12px; font-weight: 600; }
.countdown {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 18px;
  padding-top: 15px;
  border-top: 1px solid rgba(255,255,255,.13);
}
.countdown > div:not(.countdown-message) {
  min-width: 0;
  padding: 10px 6px 9px;
  text-align: center;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 15px;
  background: rgba(26,8,4,.13);
}
.countdown strong { display: block; font-family: var(--font-display); font-size: 23px; line-height: 1; }
.countdown span { display: block; margin-top: 5px; color: rgba(255,255,255,.62); font-size: 8px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.countdown-live { display: block; }
.countdown-message { text-align: center; padding: 6px 0 2px; }
.countdown-message strong { font-family: var(--font-body); font-size: 14px; }
.countdown-message span { margin-top: 4px; font-size: 10px; letter-spacing: 0; text-transform: none; }

.rally-toolbar {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin: 0 0 22px;
  padding: 5px;
  border: 1px solid var(--border);
  border-radius: 17px;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.rally-filter {
  min-width: 0;
  padding: 10px 5px;
  border: 0;
  border-radius: 12px;
  color: var(--muted);
  background: transparent;
  font-size: 10px;
  font-weight: 800;
}
.rally-filter span {
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  margin-left: 3px;
  padding: 0 5px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--cream) 7%, transparent);
  font-size: 9px;
}
.rally-filter.active {
  color: var(--ink);
  background: linear-gradient(135deg, var(--gold), var(--gold-light));
  box-shadow: 0 8px 16px color-mix(in srgb, var(--gold) 18%, transparent);
}
.rally-filter.active span { background: rgba(0,0,0,.09); }
.rally-list-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin: 0 2px 12px;
}
.rally-list-heading h3 { margin: 2px 0 0; font-family: var(--font-display); font-size: 22px; }
.rally-total { color: var(--muted); font-size: 10px; font-weight: 700; }
.rally-list { display: grid; gap: 10px; }
.rally-card {
  --state-accent: var(--gold);
  width: 100%;
  min-height: 112px;
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 12px;
  padding: 13px 12px;
  text-align: left;
  border: 1px solid var(--border);
  border-radius: 20px;
  color: var(--cream);
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--state-accent) 9%, transparent), transparent 48%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: var(--card-shadow);
  
  
  
}
.rally-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 22px;
  bottom: 22px;
  width: 3px;
  border-radius: 0 4px 4px 0;
  background: var(--state-accent);
  opacity: .75;
}
.rally-card:active { transform: scale(.985); }
.rally-card.is-next {
  --state-accent: var(--rust-light);
  border-color: color-mix(in srgb, var(--rust-light) 42%, var(--border));
  box-shadow: 0 15px 34px color-mix(in srgb, var(--rust) 16%, rgba(0,0,0,.22));
}
.rally-card.live { --state-accent: var(--green); }
.rally-card.completed { --state-accent: var(--muted); opacity: .68; box-shadow: none; }

.rally-date-block {
  width: 58px;
  min-height: 68px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid color-mix(in srgb, var(--state-accent) 22%, var(--border));
  border-radius: 16px;
  background: color-mix(in srgb, var(--state-accent) 8%, var(--surface));
}
.rally-date-block strong { font-family: var(--font-display); font-size: 18px; line-height: 1; letter-spacing: -.03em; }
.rally-date-block span { margin-top: 6px; color: var(--state-accent); font-size: 9px; font-weight: 850; letter-spacing: .14em; }
.rally-card-copy { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; }
.rally-card-topline { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 7px; margin-bottom: 7px; }
.rally-type {
  display: inline-block;
  padding: 5px 7px;
  border-radius: 999px;
  color: var(--gold);
  background: color-mix(in srgb, var(--gold) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--gold) 18%, transparent);
  font-size: 8px;
  line-height: 1;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.type-regional { color: var(--green); background: color-mix(in srgb, var(--green) 10%, transparent); border-color: color-mix(in srgb, var(--green) 18%, transparent); }
.type-provincial { color: var(--plum); background: color-mix(in srgb, var(--plum) 10%, transparent); border-color: color-mix(in srgb, var(--plum) 18%, transparent); }
.rally-status { display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: 8px; font-weight: 750; white-space: nowrap; }
.rally-status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.status-live { color: var(--green); }
.is-next .rally-status { color: var(--rust-light); }
.rally-venue { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--font-display); font-size: 17px; line-height: 1.2; font-weight: 700; }
.rally-marshal { max-width: 100%; margin-top: 7px; display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 10px; line-height: 1.25; }
.rally-marshal svg { width: 14px; height: 14px; flex: 0 0 auto; }
.marshal-needed { color: var(--amber); }
.rally-chevron { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: var(--muted); background: color-mix(in srgb, var(--cream) 5%, transparent); }
.rally-chevron svg { width: 15px; height: 15px; }
.rally-empty { padding: 28px; text-align: center; border: 1px dashed var(--border-strong); border-radius: 20px; color: var(--muted); font-size: 12px; }
.programme-note { margin: 18px 6px 0; color: var(--muted); font-size: 10px; line-height: 1.55; text-align: center; }

.rally-detail-sheet {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: none;
}
.rally-detail-sheet.open { display: block; }
.rally-detail-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  border: 0;
  background: rgba(0,0,0,.68);
  backdrop-filter: blur(5px);
}
.rally-detail-panel {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 100%;
  max-width: 560px;
  max-height: 88dvh;
  overflow-y: auto;
  padding: 10px 18px calc(24px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  border: 1px solid var(--border);
  border-bottom: 0;
  border-radius: 28px 28px 0 0;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--rust) 10%, transparent), transparent 18rem),
    var(--bg-soft);
  box-shadow: 0 -24px 64px rgba(0,0,0,.38);
  
}

.rally-detail-close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 13px;
  color: var(--muted);
  background: var(--surface-raised);
  font-size: 23px;
  line-height: 1;
}
.detail-hero { padding: 8px 48px 20px 2px; }
.detail-type {
  display: inline-block;
  margin-bottom: 10px;
  padding: 6px 9px;
  border-radius: 999px;
  color: var(--gold);
  background: color-mix(in srgb, var(--gold) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--gold) 20%, transparent);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.detail-hero h3 { margin: 0 0 6px; font-family: var(--font-display); font-size: 29px; line-height: 1.08; }
.detail-hero p { margin: 0; color: var(--muted); font-size: 13px; font-weight: 600; }
.detail-grid { display: grid; gap: 9px; }
.detail-row {
  min-height: 72px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 17px;
  background: linear-gradient(145deg, var(--surface-raised), var(--surface));
}
.detail-row-icon {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 13px;
  color: var(--gold);
  background: color-mix(in srgb, var(--gold) 9%, transparent);
}
.detail-row-icon svg { width: 22px; height: 22px; }
.detail-row span:last-child { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.detail-row small { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.detail-row strong { font-size: 13px; line-height: 1.3; }
.detail-status {
  margin-top: 12px;
  padding: 12px;
  text-align: center;
  border: 1px solid color-mix(in srgb, var(--gold) 20%, transparent);
  border-radius: 15px;
  color: var(--gold);
  background: color-mix(in srgb, var(--gold) 8%, transparent);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .1em;
  text-transform: uppercase;
}

@media (hover: hover) {
  .rally-card:hover { transform: translateY(-2px); border-color: var(--border-strong); }
}
@media (max-width: 370px) {
  .rallies-screen { padding-inline: 12px; }
  .rally-spotlight { padding: 16px; }
  .spotlight-icon { width: 56px; height: 56px; border-radius: 18px; }
  .spotlight-copy h3 { font-size: 20px; }
  .rally-card { grid-template-columns: 54px minmax(0, 1fr) 24px; gap: 9px; padding-inline: 10px; }
  .rally-date-block { width: 52px; }
  .rally-venue { font-size: 16px; }
  .rally-status { display: none; }
}

/* ================================================================
   MILESTONES LOOKUP
   ================================================================ */
.milestones-screen {
  padding-top: 20px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--green) 13%, transparent), transparent 25rem),
    radial-gradient(circle at 0% 48%, color-mix(in srgb, var(--gold) 7%, transparent), transparent 22rem),
    var(--bg);
}
.milestones-page-header { margin-bottom: 18px; }

.milestone-lookup-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 24px 20px 19px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: var(--radius-xl);
  color: #fffaf0;
  background:
    radial-gradient(circle at 110% -5%, rgba(255,255,255,.13), transparent 31%),
    linear-gradient(145deg, color-mix(in srgb, var(--green) 82%, #142319), color-mix(in srgb, var(--green) 55%, #0d1711));
  box-shadow: 0 24px 55px color-mix(in srgb, var(--green) 24%, rgba(0,0,0,.34));
}
.milestone-lookup-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: .18;
  background-image: radial-gradient(circle, rgba(255,255,255,.35) .65px, transparent .8px);
  background-size: 18px 18px;
  mask-image: linear-gradient(to bottom, black, transparent 76%);
}
.milestone-lookup-glow {
  position: absolute;
  z-index: -1;
  width: 230px;
  height: 230px;
  right: -118px;
  top: -120px;
  border-radius: 50%;
  background: rgba(255,255,255,.10);
  box-shadow: 0 0 0 34px rgba(255,255,255,.028), 0 0 0 72px rgba(255,255,255,.018);
}
.milestone-trophy {
  width: 72px;
  height: 72px;
  margin-bottom: 18px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 23px;
  color: #ffe79c;
  background: rgba(255,255,255,.105);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 16px 28px rgba(0,0,0,.16);
}
.milestone-trophy svg { width: 46px; height: 46px; }
.milestone-overline {
  display: block;
  margin-bottom: 6px;
  color: #f2d982;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.milestone-lookup-card h3 {
  max-width: 390px;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(26px, 7vw, 34px);
  line-height: 1.08;
  letter-spacing: -.025em;
}
.milestone-intro {
  max-width: 420px;
  margin: 11px 0 21px;
  color: rgba(255,250,240,.72);
  font-size: 13px;
  line-height: 1.6;
}
.milestone-form { display: grid; gap: 13px; }
.milestone-field { display: grid; gap: 7px; }
.milestone-field > span:first-child {
  color: rgba(255,250,240,.78);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .05em;
}
.milestone-input-wrap {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 16px;
  background: rgba(5,14,8,.20);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  
}
.milestone-input-wrap:focus-within {
  border-color: #f1d271;
  background: rgba(5,14,8,.29);
  box-shadow: 0 0 0 3px rgba(241,210,113,.12), inset 0 1px 0 rgba(255,255,255,.06);
}
.milestone-input-wrap svg {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  color: #efd67f;
}
.milestone-input-wrap input {
  width: 100%;
  min-width: 0;
  padding: 16px 0;
  border: 0;
  outline: 0;
  color: #fffdf7;
  background: transparent;
  font: 700 16px/1.2 var(--font-body);
}
.milestone-input-wrap input::placeholder { color: rgba(255,250,240,.42); font-weight: 500; }
.milestone-submit {
  min-height: 60px;
  margin-top: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 0;
  border-radius: 17px;
  color: #1b160a;
  background: linear-gradient(135deg, #f0cf65, #ffe59b);
  box-shadow: 0 14px 28px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.7);
  font-size: 14px;
  font-weight: 850;
  
}
.milestone-submit:active { transform: scale(.985); box-shadow: 0 8px 17px rgba(0,0,0,.2); }
.milestone-submit svg { width: 20px; height: 20px; }
.milestone-message {
  margin-top: 13px;
  padding: 12px 13px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 14px;
  color: #fff4ec;
  background: rgba(104,24,16,.34);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.45;
}
.milestone-message.success { background: rgba(15,78,40,.34); }
.milestone-privacy {
  margin: 17px 2px 0;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: rgba(255,250,240,.54);
  font-size: 9px;
  line-height: 1.55;
}
.milestone-privacy svg { width: 15px; height: 15px; flex: 0 0 auto; margin-top: 1px; }

.milestone-result { display: grid; gap: 14px;  }

.member-result-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 220px;
  padding: 23px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: var(--radius-xl);
  color: #fffaf0;
  background:
    radial-gradient(circle at 100% 0%, rgba(255,255,255,.15), transparent 38%),
    linear-gradient(145deg, color-mix(in srgb, var(--rust) 88%, #45170c), color-mix(in srgb, var(--gold) 55%, #684016));
  box-shadow: 0 23px 52px color-mix(in srgb, var(--rust) 23%, rgba(0,0,0,.3));
}
.member-result-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: .17;
  background-image: linear-gradient(135deg, transparent 0 46%, rgba(255,255,255,.11) 46% 47%, transparent 47% 100%);
  background-size: 25px 25px;
}
.member-result-glow {
  position: absolute;
  z-index: -1;
  width: 230px;
  height: 230px;
  right: -80px;
  top: -115px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 0 0 30px rgba(255,255,255,.035), 0 0 0 65px rgba(255,255,255,.02);
}
.member-result-eyebrow {
  display: block;
  margin-bottom: 7px;
  color: rgba(255,250,240,.67);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.member-result-hero h3 {
  max-width: 380px;
  margin: 0 0 18px;
  font-family: var(--font-display);
  font-size: clamp(28px, 7.5vw, 38px);
  line-height: 1.08;
  letter-spacing: -.025em;
}
.member-total-lockup {
  display: flex;
  align-items: end;
  gap: 11px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.16);
}
.member-total-lockup strong { font-family: var(--font-display); font-size: 38px; line-height: .9; }
.member-total-lockup span { max-width: 100px; color: rgba(255,250,240,.65); font-size: 9px; font-weight: 800; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }

.milestone-summary-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.milestone-summary {
  --summary-accent: var(--gold);
  min-width: 0;
  min-height: 92px;
  padding: 13px 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  text-align: center;
  border: 1px solid color-mix(in srgb, var(--summary-accent) 25%, var(--border));
  border-radius: 18px;
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--summary-accent) 11%, transparent), transparent 65%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: var(--card-shadow);
}
.summary-regional { --summary-accent: var(--green); }
.summary-national { --summary-accent: var(--gold); }
.summary-provincial { --summary-accent: var(--plum); }
.milestone-summary span { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.milestone-summary strong { color: var(--summary-accent); font-family: var(--font-display); font-size: 27px; line-height: 1; }

.milestone-progress-heading { margin: 12px 2px 0; }
.milestone-progress-heading h3 { margin: 3px 0 0; font-family: var(--font-display); font-size: 22px; line-height: 1.15; }
.milestone-progress-list { display: grid; gap: 10px; }
.milestone-progress-card {
  --milestone-accent: var(--gold);
  position: relative;
  overflow: hidden;
  padding: 15px;
  border: 1px solid color-mix(in srgb, var(--milestone-accent) 24%, var(--border));
  border-radius: 20px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--milestone-accent) 9%, transparent), transparent 46%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: var(--card-shadow);
}
.progress-regional { --milestone-accent: var(--green); }
.progress-national { --milestone-accent: var(--gold); }
.progress-provincial { --milestone-accent: var(--plum); }
.milestone-progress-top { display: flex; align-items: center; gap: 11px; }
.milestone-category-icon {
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 15px;
  color: var(--milestone-accent);
  background: color-mix(in srgb, var(--milestone-accent) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--milestone-accent) 19%, transparent);
}
.milestone-category-icon svg { width: 29px; height: 29px; }
.milestone-category-copy { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 1px; }
.milestone-category-label { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.milestone-category-copy strong { font-family: var(--font-display); font-size: 28px; line-height: 1; }
.milestone-achieved-badge {
  min-width: 40px;
  height: 40px;
  padding: 0 8px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--milestone-accent) 20%, transparent);
  border-radius: 999px;
  color: var(--milestone-accent);
  background: color-mix(in srgb, var(--milestone-accent) 8%, transparent);
  font-size: 11px;
  font-weight: 850;
}
.milestone-achieved-badge.is-exact { box-shadow: 0 0 0 4px color-mix(in srgb, var(--milestone-accent) 8%, transparent); }
.milestone-status-line { margin-top: 14px; display: flex; align-items: end; justify-content: space-between; gap: 10px; }
.milestone-status-line span { color: var(--muted); font-size: 9px; line-height: 1.3; }
.milestone-status-line strong { max-width: 160px; text-align: right; color: var(--milestone-accent); font-size: 10px; line-height: 1.3; }
.milestone-progress-track {
  height: 8px;
  margin-top: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: color-mix(in srgb, var(--cream) 7%, transparent);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.12);
}
.milestone-progress-track > span {
  display: block;
  height: 100%;
  min-width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, color-mix(in srgb, var(--milestone-accent) 80%, var(--cream)), var(--milestone-accent));
  box-shadow: 0 0 13px color-mix(in srgb, var(--milestone-accent) 35%, transparent);
  
  transform-origin: left;
}

.milestone-progress-footer { margin-top: 7px; display: flex; justify-content: space-between; color: var(--muted); font-size: 8px; font-weight: 700; }
.milestone-reset {
  min-height: 54px;
  margin-top: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px solid var(--border-strong);
  border-radius: 16px;
  color: var(--gold);
  background: var(--surface-raised);
  box-shadow: var(--card-shadow);
  font-size: 12px;
  font-weight: 800;
}
.milestone-reset svg { width: 19px; height: 19px; }
.milestone-data-note { margin: 0 8px; color: var(--muted); font-size: 9px; line-height: 1.5; text-align: center; }

@media (hover: hover) {
  .milestone-submit:hover { transform: translateY(-1px); box-shadow: 0 17px 32px rgba(0,0,0,.23); }
  .milestone-reset:hover { border-color: var(--gold); }
}
@media (max-width: 370px) {
  .milestones-screen { padding-inline: 12px; }
  .milestone-lookup-card { padding-inline: 16px; }
  .milestone-summary { min-height: 84px; padding-inline: 4px; }
  .milestone-summary span { font-size: 7px; letter-spacing: .06em; }
  .milestone-status-line { align-items: flex-start; flex-direction: column; }
  .milestone-status-line strong { max-width: none; text-align: left; }
}

/* Ensure scripted screen states always override component display rules. */
[hidden] { display: none !important; }


/* ---------- Daily birthday / anniversary banner ---------- */
.celebration-banner {
  position: relative;
  margin: 8px 16px 4px;
  padding: 18px;
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 14px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--gold) 34%, var(--border));
  border-radius: 22px;
  background:
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--gold-light) 18%, transparent), transparent 42%),
    linear-gradient(135deg, color-mix(in srgb, var(--gold) 14%, var(--surface-raised)), var(--surface));
  box-shadow: var(--card-shadow), inset 0 1px 0 rgba(255,255,255,.08);
}
.celebration-banner::after {
  content: "";
  position: absolute;
  width: 130px;
  height: 130px;
  right: -54px;
  bottom: -72px;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--gold) 24%, transparent);
  box-shadow: 0 0 0 18px color-mix(in srgb, var(--gold) 5%, transparent), 0 0 0 36px color-mix(in srgb, var(--gold) 3%, transparent);
}
.celebration-sparkles {
  position: absolute;
  inset: 0;
  opacity: .28;
  background-image: radial-gradient(circle, color-mix(in srgb, var(--gold-light) 85%, transparent) 1px, transparent 1.5px);
  background-size: 28px 28px;
  mask-image: linear-gradient(100deg, transparent 15%, #000 65%, transparent);
  pointer-events: none;
}
.celebration-icon {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  color: var(--gold-light);
  background: color-mix(in srgb, var(--gold) 14%, var(--surface-raised));
  border: 1px solid color-mix(in srgb, var(--gold) 30%, transparent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.18);
  position: relative;
  z-index: 1;
}
.celebration-icon svg { width: 34px; height: 34px; }
.celebration-copy { min-width: 0; position: relative; z-index: 1; }
.celebration-kicker {
  display: block;
  margin-bottom: 3px;
  color: var(--gold-light);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.celebration-copy h2 { margin: 0; font-family: var(--font-display); font-size: 19px; line-height: 1.15; }
.celebration-names { margin-top: 9px; display: flex; flex-wrap: wrap; gap: 7px; }
.celebration-person {
  min-width: 0;
  padding: 7px 10px;
  display: flex;
  flex-direction: column;
  border-radius: 12px;
  background: color-mix(in srgb, var(--cream) 6%, transparent);
  border: 1px solid var(--border);
}
.celebration-person small { color: var(--muted); font-size: 7px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.celebration-person strong { margin-top: 1px; font-size: 11px; line-height: 1.3; }
.celebration-person.anniversary { border-color: color-mix(in srgb, var(--rust-light) 30%, var(--border)); }

/* ---------- Secure committee admin ---------- */
.admin-screen { padding-inline: 14px; }
.admin-page-header { margin-inline: 4px; }
.admin-setup-card,
.admin-login-card,
.admin-dashboard {
  border: 1px solid var(--border);
  border-radius: 24px;
  background:
    radial-gradient(circle at 95% 0%, color-mix(in srgb, var(--gold) 9%, transparent), transparent 50%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: var(--card-shadow), inset 0 1px 0 rgba(255,255,255,.04);
}
.admin-setup-card {
  padding: 18px;
  display: flex;
  align-items: flex-start;
  gap: 13px;
}
.admin-status-light { width: 11px; height: 11px; margin-top: 5px; flex: 0 0 auto; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0 6px color-mix(in srgb, var(--amber) 12%, transparent); }
.admin-setup-card strong { font-size: 14px; }
.admin-setup-card p { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.admin-login-card { padding: 28px 20px 22px; text-align: center; }
.admin-lock-icon {
  width: 76px;
  height: 76px;
  margin: 0 auto 14px;
  display: grid;
  place-items: center;
  border-radius: 24px;
  color: var(--gold);
  background: color-mix(in srgb, var(--gold) 11%, var(--surface-raised));
  border: 1px solid color-mix(in srgb, var(--gold) 24%, transparent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.admin-lock-icon svg { width: 43px; height: 43px; }
.admin-overline { display: block; color: var(--gold); font-size: 8px; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.admin-login-card h3,
.admin-welcome h3,
.admin-modal-panel h3 { margin: 5px 0 7px; font-family: var(--font-display); font-size: 22px; }
.admin-login-card > p { max-width: 340px; margin: 0 auto 18px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.admin-login-form,
.admin-record-form { display: grid; gap: 12px; text-align: left; }
.admin-login-form label,
.admin-record-form label { display: grid; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .04em; }
.admin-login-form input,
.admin-record-form input,
.admin-record-form select,
.admin-search input {
  width: 100%;
  min-height: 50px;
  padding: 0 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  color: var(--cream);
  background: color-mix(in srgb, var(--surface) 84%, transparent);
  outline: none;
  font: inherit;
  font-size: 12px;
}
.admin-login-form input:focus,
.admin-record-form input:focus,
.admin-record-form select:focus,
.admin-search:focus-within { border-color: var(--gold); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 10%, transparent); }
.admin-primary-btn,
.admin-secondary-btn,
.admin-add-btn,
.admin-signout {
  min-height: 50px;
  border-radius: 14px;
  border: 1px solid transparent;
  font-size: 11px;
  font-weight: 850;
}
.admin-primary-btn { display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--ink); background: linear-gradient(135deg, var(--gold), var(--gold-light)); box-shadow: 0 12px 24px color-mix(in srgb, var(--gold) 16%, transparent); }
.admin-primary-btn svg { width: 18px; height: 18px; }
.admin-primary-btn:disabled { opacity: .58; cursor: wait; }
.admin-secondary-btn { color: var(--cream); border-color: var(--border); background: var(--surface-raised); }
.admin-message { margin-top: 12px; padding: 11px 12px; border-radius: 12px; border: 1px solid color-mix(in srgb, #d45a4f 30%, transparent); color: #f1a39c; background: color-mix(in srgb, #d45a4f 9%, transparent); font-size: 10px; line-height: 1.5; }
.admin-message.success { color: #a9d7b1; border-color: color-mix(in srgb, var(--green) 35%, transparent); background: color-mix(in srgb, var(--green) 10%, transparent); }
.admin-dashboard { padding: 16px; }
.admin-welcome { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 4px 2px 15px; }
.admin-welcome h3 { margin-bottom: 0; font-size: 19px; }
.admin-signout { min-height: 38px; padding: 0 12px; color: var(--muted); border-color: var(--border); background: transparent; }
.admin-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.admin-stats > div { min-width: 0; padding: 12px 8px; text-align: center; border: 1px solid var(--border); border-radius: 15px; background: color-mix(in srgb, var(--surface) 80%, transparent); }
.admin-stats span { display: block; color: var(--muted); font-size: 7px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.admin-stats strong { display: block; margin-top: 3px; font-family: var(--font-display); font-size: 23px; }
.admin-tabs { margin-top: 14px; padding: 4px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; border: 1px solid var(--border); border-radius: 14px; background: color-mix(in srgb, var(--surface) 82%, transparent); }
.admin-tabs button { min-height: 40px; padding: 0 5px; border: 0; border-radius: 10px; color: var(--muted); background: transparent; font-size: 9px; font-weight: 800; }
.admin-tabs button.active { color: var(--ink); background: linear-gradient(135deg, var(--gold), var(--gold-light)); box-shadow: 0 7px 16px color-mix(in srgb, var(--gold) 14%, transparent); }
.admin-toolbar { margin: 12px 0; display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.admin-search { min-width: 0; min-height: 46px; padding-left: 12px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--border); border-radius: 14px; background: color-mix(in srgb, var(--surface) 84%, transparent); }
.admin-search svg { width: 17px; height: 17px; flex: 0 0 auto; color: var(--muted); }
.admin-search input { min-height: 42px; padding: 0 9px 0 0; border: 0; background: transparent; box-shadow: none !important; }
.admin-add-btn { min-height: 46px; padding: 0 14px; color: var(--ink); background: var(--gold); }
.admin-add-btn span { font-size: 16px; }
.admin-record-list { display: grid; gap: 9px; }
.admin-record-card { padding: 13px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; border: 1px solid var(--border); border-radius: 16px; background: color-mix(in srgb, var(--surface-raised) 85%, transparent); }
.admin-record-card.is-inactive { opacity: .55; }
.admin-record-main { min-width: 0; display: flex; flex-direction: column; }
.admin-record-number { color: var(--gold); font-size: 8px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.admin-record-main strong { margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.admin-record-main small { margin-top: 3px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.admin-count-pills { grid-column: 1 / -1; display: flex; gap: 5px; }
.admin-count-pills span { padding: 5px 8px; border-radius: 999px; color: var(--muted); background: color-mix(in srgb, var(--cream) 5%, transparent); border: 1px solid var(--border); font-size: 8px; font-weight: 800; }
.admin-record-actions { display: flex; align-items: flex-start; gap: 5px; }
.admin-record-actions button { min-height: 34px; padding: 0 9px; border: 1px solid var(--border); border-radius: 10px; color: var(--gold); background: transparent; font-size: 8px; font-weight: 850; }
.admin-record-actions .danger { color: #e38b82; }
.admin-loading,
.admin-empty { padding: 24px 12px; text-align: center; color: var(--muted); font-size: 10px; }
.admin-loading span { width: 16px; height: 16px; margin: 0 auto 8px; display: block; border: 2px solid var(--border); border-top-color: var(--gold); border-radius: 50%;  }

.admin-modal { position: fixed; inset: 0; z-index: 80; display: flex; align-items: flex-end; justify-content: center; }
.admin-modal-backdrop { position: absolute; inset: 0; border: 0; background: rgba(0,0,0,.64); opacity: 0;  }
.admin-modal-panel { position: relative; width: min(560px, 100%); max-height: 88dvh; padding: 18px 18px calc(20px + env(safe-area-inset-bottom)); overflow-y: auto; border: 1px solid var(--border); border-radius: 26px 26px 0 0; background: var(--surface-raised); box-shadow: 0 -24px 60px rgba(0,0,0,.38); transform: translateY(102%);  }
.admin-modal.open .admin-modal-backdrop { opacity: 1; }
.admin-modal.open .admin-modal-panel { transform: translateY(0); }
.admin-modal-close { position: absolute; top: 15px; right: 15px; width: 38px; height: 38px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); font-size: 22px; }
.admin-record-form { margin-top: 16px; }
.admin-record-form #adminRecordFields { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 11px; }
.admin-record-form label.full { grid-column: 1 / -1; }
.admin-record-form select { appearance: none; }
.admin-check { min-height: 46px; padding: 0 12px; display: flex !important; flex-direction: row !important; align-items: center; gap: 9px !important; border: 1px solid var(--border); border-radius: 14px; background: color-mix(in srgb, var(--surface) 84%, transparent); }
.admin-check input { width: 18px; min-height: 18px; padding: 0; accent-color: var(--gold); }
.admin-check span { color: var(--cream); font-size: 10px; }
.admin-form-actions { display: grid; grid-template-columns: 1fr 1.3fr; gap: 9px; margin-top: 4px; }
.milestone-submit.is-loading::after { content: ""; width: 15px; height: 15px; border: 2px solid rgba(0,0,0,.22); border-top-color: var(--ink); border-radius: 50%;  }

@media (max-width: 390px) {
  .celebration-banner { grid-template-columns: 48px 1fr; padding: 15px; }
  .celebration-icon { width: 48px; height: 48px; border-radius: 15px; }
  .celebration-icon svg { width: 29px; height: 29px; }
  .admin-screen { padding-inline: 10px; }
  .admin-record-card { grid-template-columns: 1fr; }
  .admin-record-actions { grid-row: auto; }
  .admin-record-form #adminRecordFields { grid-template-columns: 1fr; }
  .admin-record-form label.full { grid-column: auto; }
}
.admin-field-group-title {
  margin-top: 4px;
  padding: 10px 2px 2px;
  color: var(--gold);
  border-bottom: 1px solid var(--border);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.milestone-message.info {
  color: var(--gold-light);
  background: color-mix(in srgb, var(--gold) 10%, transparent);
  border-color: color-mix(in srgb, var(--gold) 26%, transparent);
}

/* ---------- Committee contacts ---------- */
.committee-contacts-screen {
  padding-inline: 14px;
  background:
    radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--green) 13%, transparent), transparent 24rem),
    radial-gradient(circle at 8% 28%, color-mix(in srgb, var(--gold) 8%, transparent), transparent 18rem),
    var(--bg);
}
.committee-page-header { margin: 0 4px 18px; }
.committee-overline {
  display: block;
  color: var(--gold);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.committee-hero {
  position: relative;
  min-height: 292px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--gold) 24%, var(--border));
  border-radius: 27px;
  background: var(--surface-raised);
  box-shadow: 0 24px 52px rgba(0,0,0,.28);
  isolation: isolate;
}
.committee-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(135deg, color-mix(in srgb, var(--gold) 12%, transparent), transparent 42%);
}
.committee-hero > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 52% center;
}
.committee-hero-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(to top, rgba(9,7,5,.96) 0%, rgba(9,7,5,.72) 32%, rgba(9,7,5,.08) 72%),
    linear-gradient(to right, rgba(9,7,5,.24), transparent 55%);
}
.committee-hero-copy {
  position: absolute;
  z-index: 2;
  left: 20px;
  right: 20px;
  bottom: 20px;
}
.committee-hero-copy h3 {
  margin: 2px 0 5px;
  font-family: var(--font-display);
  font-size: 30px;
  line-height: 1;
}
.committee-hero-copy p {
  max-width: 340px;
  margin: 0;
  color: rgba(255,255,255,.78);
  font-size: 10px;
  line-height: 1.55;
}
.committee-hero-count {
  position: absolute;
  z-index: 3;
  top: 15px;
  right: 15px;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  color: rgba(255,255,255,.82);
  background: rgba(15,12,8,.58);
  box-shadow: 0 8px 20px rgba(0,0,0,.16);
  backdrop-filter: blur(12px);
  font-size: 8px;
  font-weight: 750;
}
.committee-hero-count strong { color: var(--gold-light); font-size: 13px; }
.committee-intro {
  margin: 13px 2px 17px;
  padding: 13px 14px;
  display: grid;
  grid-template-columns: 42px minmax(0,1fr);
  gap: 11px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 17px;
  background: color-mix(in srgb, var(--surface-raised) 88%, transparent);
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}
.committee-intro-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  color: var(--gold);
  background: color-mix(in srgb, var(--gold) 11%, transparent);
  border: 1px solid color-mix(in srgb, var(--gold) 20%, transparent);
}
.committee-intro-icon svg { width: 23px; height: 23px; }
.committee-intro strong { display: block; font-family: var(--font-display); font-size: 14px; }
.committee-intro p { margin: 2px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.committee-list { display: grid; gap: 13px; }
.committee-card {
  position: relative;
  padding: 15px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 88px minmax(0,1fr);
  gap: 13px;
  border: 1px solid var(--border);
  border-radius: 23px;
  background:
    radial-gradient(circle at 0 0, color-mix(in srgb, var(--gold) 8%, transparent), transparent 46%),
    linear-gradient(145deg, var(--surface-raised), color-mix(in srgb, var(--surface) 90%, var(--bg)));
  box-shadow: 0 17px 38px rgba(0,0,0,.18);
}
.committee-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, rgba(255,255,255,.025), transparent 36%);
}
.committee-card-accent {
  position: absolute;
  left: 0;
  top: 21px;
  bottom: 21px;
  width: 3px;
  border-radius: 0 5px 5px 0;
  background: linear-gradient(var(--gold-light), var(--gold));
  box-shadow: 0 0 18px color-mix(in srgb, var(--gold) 40%, transparent);
}
.committee-profile {
  position: relative;
  width: 88px;
  height: 88px;
}
.committee-profile > img {
  width: 88px;
  height: 88px;
  object-fit: cover;
  border: 2px solid color-mix(in srgb, var(--gold) 52%, var(--cream));
  border-radius: 27px;
  background: var(--surface);
  box-shadow: 0 12px 25px rgba(0,0,0,.25);
}
.committee-role-icon {
  position: absolute;
  right: -5px;
  bottom: -4px;
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  border: 3px solid var(--surface-raised);
  border-radius: 11px;
  color: var(--ink);
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
  box-shadow: 0 8px 15px rgba(0,0,0,.22);
}
.committee-role-icon svg { width: 17px; height: 17px; }
.committee-card-copy { min-width: 0; padding-top: 3px; }
.committee-role {
  display: block;
  color: var(--gold);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .08em;
  line-height: 1.35;
  text-transform: uppercase;
}
.committee-card-copy h3 {
  margin: 3px 0 7px;
  font-family: var(--font-display);
  font-size: 20px;
  line-height: 1.05;
}
.committee-contact-line {
  min-width: 0;
  margin-top: 4px;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--cream);
  font-size: 9px;
  font-weight: 650;
}
.committee-contact-line.email { color: var(--muted); }
.committee-contact-line svg { width: 14px; height: 14px; flex: 0 0 auto; color: var(--gold); }
.committee-contact-line span { min-width: 0; overflow-wrap: anywhere; }
.committee-actions {
  grid-column: 1 / -1;
  margin-top: 1px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
}
.committee-action {
  min-height: 43px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--border);
  border-radius: 13px;
  color: var(--cream);
  background: color-mix(in srgb, var(--surface) 78%, transparent);
  font-size: 8px;
  font-weight: 850;
  box-shadow: 0 8px 18px rgba(0,0,0,.09);
}
.committee-action svg { width: 16px; height: 16px; }
.committee-action.call {
  color: var(--ink);
  border-color: transparent;
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
}
.committee-action.whatsapp { color: #9ad8aa; border-color: color-mix(in srgb, #36a85c 30%, var(--border)); }
.committee-action.email { color: var(--gold-light); }
.committee-payment {
  margin-top: 17px;
  padding: 18px;
  position: relative;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--gold) 28%, var(--border));
  border-radius: 24px;
  background:
    radial-gradient(circle at 100% 0, color-mix(in srgb, var(--gold) 12%, transparent), transparent 48%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: 0 22px 45px rgba(0,0,0,.22);
}
.committee-payment::after {
  content: "";
  position: absolute;
  width: 130px;
  height: 130px;
  right: -55px;
  bottom: -66px;
  border: 1px solid color-mix(in srgb, var(--gold) 17%, transparent);
  border-radius: 50%;
  box-shadow: 0 0 0 18px color-mix(in srgb, var(--gold) 3%, transparent), 0 0 0 36px color-mix(in srgb, var(--gold) 2%, transparent);
}
.committee-payment-heading {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 11px;
}
.committee-payment-icon {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: var(--gold-light);
  background: color-mix(in srgb, var(--gold) 11%, transparent);
  border: 1px solid color-mix(in srgb, var(--gold) 22%, transparent);
}
.committee-payment-icon svg { width: 25px; height: 25px; }
.committee-payment-heading h3 { margin: 2px 0 0; font-family: var(--font-display); font-size: 20px; }
.committee-payment-note {
  position: relative;
  z-index: 1;
  margin-top: 14px;
  padding: 12px 13px;
  border-left: 3px solid var(--gold);
  border-radius: 0 13px 13px 0;
  background: color-mix(in srgb, var(--gold) 7%, transparent);
}
.committee-payment-note strong { display: block; font-size: 10px; }
.committee-payment-note p { margin: 3px 0 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.committee-payment-note b { color: var(--cream); }
.committee-bank-grid {
  position: relative;
  z-index: 1;
  margin: 14px 0 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 7px;
}
.committee-bank-grid > div {
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: color-mix(in srgb, var(--surface) 78%, transparent);
}
.committee-bank-grid dt {
  color: var(--muted);
  font-size: 7px;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.committee-bank-grid dd {
  margin: 3px 0 0;
  overflow-wrap: anywhere;
  font-size: 10px;
  font-weight: 800;
}
.committee-payment-actions {
  position: relative;
  z-index: 1;
  margin-top: 10px;
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 7px;
}
.committee-copy-bank,
.committee-proof-email {
  min-height: 46px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid var(--border);
  border-radius: 14px;
  font-size: 8px;
  font-weight: 850;
}
.committee-copy-bank { color: var(--ink); border-color: transparent; background: linear-gradient(135deg, var(--gold-light), var(--gold)); }
.committee-proof-email { color: var(--gold-light); background: color-mix(in srgb, var(--surface) 78%, transparent); }
.committee-copy-bank svg,
.committee-proof-email svg { width: 16px; height: 16px; }
.committee-copy-message {
  position: relative;
  z-index: 1;
  margin-top: 9px;
  padding: 9px 10px;
  border-radius: 11px;
  color: #a9d7b1;
  background: color-mix(in srgb, var(--green) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--green) 28%, transparent);
  text-align: center;
  font-size: 8px;
  font-weight: 800;
}
.committee-update-note {
  margin: 14px 0 0;
  color: var(--muted);
  text-align: center;
  font-size: 8px;
  line-height: 1.5;
}
@media (max-width: 390px) {
  .committee-hero { min-height: 270px; }
  .committee-hero-copy h3 { font-size: 27px; }
  .committee-card { grid-template-columns: 78px minmax(0,1fr); padding: 13px; gap: 11px; }
  .committee-profile,
  .committee-profile > img { width: 78px; height: 78px; }
  .committee-card-copy h3 { font-size: 18px; }
  .committee-contact-line { font-size: 8px; }
  .committee-action { min-height: 41px; }
  .committee-bank-grid { grid-template-columns: 1fr 1fr; }
  .committee-payment-actions { grid-template-columns: 1fr; }
}

/* ================================================================
   V10 VISUAL MENU ICONS
   Friendly 3D artwork for rapid recognition, especially on phones.
   ================================================================ */
.tile.visual-tile {
  min-height: 166px;
  padding: 11px 12px 15px;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  text-align: center;
  background:
    radial-gradient(circle at 50% 22%, color-mix(in srgb, var(--accent) 13%, transparent), transparent 48%),
    linear-gradient(155deg, color-mix(in srgb, var(--surface-raised) 96%, white 4%), var(--surface));
}
.tile.visual-tile::before {
  content: "";
  position: absolute;
  inset: 1px;
  pointer-events: none;
  border-radius: calc(var(--radius-lg) - 1px);
  background: linear-gradient(135deg, rgba(255,255,255,.055), transparent 35%, transparent 70%, rgba(255,255,255,.018));
}
.visual-icon-wrap {
  position: relative;
  z-index: 1;
  width: 98px;
  height: 98px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  margin: -5px auto -4px;
}
.visual-icon-wrap img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  user-select: none;
  -webkit-user-drag: none;
  filter: drop-shadow(0 10px 12px rgba(0,0,0,.22));
  
}
.tile.visual-tile .tile-copy {
  position: relative;
  z-index: 1;
  width: 100%;
  align-items: center;
  gap: 4px;
}
.tile.visual-tile .label {
  font-size: 15px;
  line-height: 1.18;
  text-align: center;
}
.tile.visual-tile .sub {
  max-width: 18rem;
  text-align: center;
}
.tile.visual-tile .mini-arrow {
  z-index: 2;
  top: 12px;
  right: 12px;
  background: color-mix(in srgb, var(--surface-raised) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--border));
  backdrop-filter: blur(8px);
}
@media (hover:hover) {
  .tile.visual-tile:hover .visual-icon-wrap img {
    transform: translateY(-3px) scale(1.035);
    filter: drop-shadow(0 14px 15px rgba(0,0,0,.26));
  }
}

.tile.featured.visual-tile {
  min-height: 154px;
  padding: 14px 16px 14px 12px;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 7px;
  text-align: left;
}
.tile.featured.visual-tile .visual-icon-wrap {
  width: 122px;
  height: 122px;
  margin: -6px -4px -6px -5px;
}
.tile.featured.visual-tile .tile-copy {
  align-items: flex-start;
  text-align: left;
}
.tile.featured.visual-tile .label,
.tile.featured.visual-tile .sub {
  text-align: left;
}
.tile.featured.visual-tile .tile-action {
  position: relative;
  z-index: 2;
}

.tile-wide.visual-tile {
  min-height: 118px;
  padding: 10px 14px 10px 8px;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
  text-align: left;
}
.tile-wide.visual-tile .visual-icon-wrap {
  width: 96px;
  height: 96px;
  margin: -4px 0 -4px -2px;
}
.tile-wide.visual-tile .tile-copy {
  align-items: flex-start;
  text-align: left;
}
.tile-wide.visual-tile .label,
.tile-wide.visual-tile .sub {
  text-align: left;
}
.tile-wide.visual-tile .external-mark,
.tile-wide.visual-tile .locked-pill {
  position: relative;
  z-index: 2;
}

@media (max-width: 370px) {
  .tile.visual-tile { min-height: 154px; padding-inline: 9px; }
  .visual-icon-wrap { width: 88px; height: 88px; }
  .tile.visual-tile .label { font-size: 14px; }
  .tile.featured.visual-tile { min-height: 143px; padding-left: 8px; }
  .tile.featured.visual-tile .visual-icon-wrap { width: 108px; height: 108px; }
  .tile-wide.visual-tile { min-height: 108px; padding-left: 6px; }
  .tile-wide.visual-tile .visual-icon-wrap { width: 88px; height: 88px; }
}

/* Keep the featured rally card visually prominent after the visual-icon override. */
.tile.featured.visual-tile {
  border-color: rgba(255,255,255,.13);
  background:
    radial-gradient(circle at 94% 0%, rgba(255,255,255,.16), transparent 38%),
    radial-gradient(circle at 18% 50%, rgba(247,212,132,.10), transparent 42%),
    linear-gradient(135deg, color-mix(in srgb, var(--rust) 90%, #3c1710), color-mix(in srgb, var(--rust-light) 76%, #6a260f));
  box-shadow: 0 18px 38px color-mix(in srgb, var(--rust) 24%, rgba(0,0,0,.28));
}

/* Version 12 admin extensions */
.admin-record-form textarea {
  width: 100%;
  min-height: 110px;
  padding: 13px 14px;
  resize: vertical;
  border: 1px solid var(--border);
  border-radius: 14px;
  color: var(--cream);
  background: color-mix(in srgb, var(--surface) 84%, transparent);
  outline: none;
  font: 500 12px/1.55 var(--font-body);
}
.admin-record-form textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 10%, transparent); }
.admin-record-form input[type="file"] { min-height: 52px; padding: 11px 12px; }
.admin-stats-five { grid-template-columns: repeat(5, minmax(0,1fr)); }
.admin-record-card:has(.admin-notice-preview) { grid-template-columns: 64px minmax(0,1fr) auto; align-items: center; }
@media (max-width: 560px) {
  .admin-stats-five { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .admin-record-card:has(.admin-notice-preview) { grid-template-columns: 54px minmax(0,1fr); }
  .admin-record-card:has(.admin-notice-preview) .admin-record-actions { grid-column: 1 / -1; }
  .admin-notice-preview { width:54px; height:54px; }
}


/* Version 26: complete member profiles and pinned celebrations */
.celebration-pin {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 5px;
  padding: 4px 8px;
  border-radius: 999px;
  color: #171109;
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
  box-shadow: 0 6px 14px rgba(0,0,0,.2);
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.admin-dependent-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-raised) 88%, transparent);
}
.admin-dependent-row > strong {
  grid-column: 1 / -1;
  color: var(--gold-light);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.admin-record-main small + small { margin-top: 3px; color: var(--gold-light); }
@media (max-width: 620px) {
  .admin-dependent-row { grid-template-columns: 1fr; }
  .admin-dependent-row > strong { grid-column: auto; }
}

/* Version 27: committee guidance card repair */
.committee-intro {
  display: block;
  grid-template-columns: none;
  padding: 16px 18px;
}
.committee-intro > div { width: 100%; min-width: 0; }
.committee-intro strong { display: block; font-size: 18px; line-height: 1.2; }
.committee-intro p { max-width: none; margin-top: 5px; font-size: 13px; line-height: 1.55; }
.committee-hero-copy { padding-left: 0 !important; }

/* ===== END styles.css ===== */

/* ===== BEGIN newsletters.css ===== */
/* ================================================================
   NEWSLETTER LIBRARY
   Premium, large-touch interface for PDF newsletters stored in Drive
   ================================================================ */

.newsletters-screen {
  padding-inline: 14px;
  padding-bottom: 112px;
}

.newsletters-page-header { margin-inline: 4px; }

.newsletter-hero {
  position: relative;
  overflow: hidden;
  padding: 22px 18px 18px;
  border: 1px solid color-mix(in srgb, var(--plum) 28%, var(--border));
  border-radius: 25px;
  background:
    radial-gradient(circle at 96% 0%, color-mix(in srgb, var(--plum) 23%, transparent), transparent 48%),
    radial-gradient(circle at 8% 105%, color-mix(in srgb, var(--gold) 12%, transparent), transparent 46%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: var(--card-shadow), inset 0 1px 0 rgba(255,255,255,.045);
}
.newsletter-hero::after {
  content: "";
  position: absolute;
  top: -30px;
  right: -16px;
  width: 124px;
  height: 164px;
  border: 1px solid color-mix(in srgb, var(--plum) 22%, transparent);
  border-radius: 18px;
  transform: rotate(12deg);
  opacity: .42;
  pointer-events: none;
}
.newsletter-hero-top {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
}
.newsletter-hero-icon {
  width: 62px;
  height: 62px;
  display: grid;
  place-items: center;
  border-radius: 20px;
  color: var(--gold-light);
  background: linear-gradient(145deg, color-mix(in srgb, var(--plum) 20%, var(--surface-raised)), color-mix(in srgb, var(--gold) 7%, var(--surface)));
  border: 1px solid color-mix(in srgb, var(--plum) 35%, var(--border));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 24px rgba(0,0,0,.17);
}
.newsletter-hero-icon svg { width: 34px; height: 34px; }
.newsletter-hero .newsletter-overline,
.newsletter-card-overline {
  display: block;
  color: var(--gold);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.newsletter-hero h3 {
  margin: 4px 0 5px;
  font-family: var(--font-display);
  font-size: 24px;
  line-height: 1.06;
}
.newsletter-hero p {
  margin: 0;
  max-width: 390px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.55;
}
.newsletter-hero-stats {
  position: relative;
  z-index: 1;
  margin-top: 17px;
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 8px;
}
.newsletter-stat {
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface) 72%, transparent);
}
.newsletter-stat span {
  display: block;
  color: var(--muted);
  font-size: 7px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.newsletter-stat strong {
  display: block;
  margin-top: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}
.newsletter-stat:first-child strong {
  color: var(--gold-light);
  font-family: var(--font-display);
  font-size: 21px;
}

.newsletter-setup,
.newsletter-error,
.newsletter-offline-note {
  margin-top: 12px;
  padding: 14px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  border: 1px solid color-mix(in srgb, var(--amber) 32%, var(--border));
  border-radius: 17px;
  background: color-mix(in srgb, var(--amber) 8%, var(--surface));
}
.newsletter-setup-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  color: var(--amber);
  border-radius: 12px;
  background: color-mix(in srgb, var(--amber) 12%, transparent);
}
.newsletter-setup-icon svg { width: 21px; height: 21px; }
.newsletter-setup strong,
.newsletter-error strong { display: block; font-size: 11px; }
.newsletter-setup p,
.newsletter-error p,
.newsletter-offline-note p { margin: 4px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.newsletter-setup-actions { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.newsletter-setup-actions a,
.newsletter-setup-actions button {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid var(--border);
  border-radius: 13px;
  color: var(--cream);
  background: var(--surface-raised);
  font-size: 9px;
  font-weight: 850;
}
.newsletter-setup-actions a:first-child { color: var(--ink); border-color: transparent; background: linear-gradient(135deg, var(--gold), var(--gold-light)); }
.newsletter-setup-actions svg { width: 16px; height: 16px; }

.newsletter-controls {
  margin-top: 14px;
  display: grid;
  gap: 10px;
}
.newsletter-search {
  min-height: 52px;
  padding: 0 13px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-raised) 88%, transparent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.newsletter-search:focus-within { border-color: var(--gold); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 10%, transparent); }
.newsletter-search svg { width: 19px; height: 19px; flex: 0 0 auto; color: var(--muted); }
.newsletter-search input {
  width: 100%;
  min-width: 0;
  height: 48px;
  padding: 0;
  border: 0;
  outline: 0;
  color: var(--cream);
  background: transparent;
  font: inherit;
  font-size: 12px;
}
.newsletter-search input::placeholder { color: color-mix(in srgb, var(--muted) 74%, transparent); }
.newsletter-control-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.newsletter-year-filters {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  gap: 7px;
  overflow-x: auto;
  scrollbar-width: none;
  padding-bottom: 2px;
}
.newsletter-year-filters::-webkit-scrollbar { display: none; }
.newsletter-year-filter,
.newsletter-refresh {
  min-height: 40px;
  padding: 0 13px;
  flex: 0 0 auto;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  background: color-mix(in srgb, var(--surface-raised) 82%, transparent);
  font-size: 9px;
  font-weight: 850;
}
.newsletter-year-filter.active { color: var(--ink); border-color: transparent; background: linear-gradient(135deg, var(--gold), var(--gold-light)); }
.newsletter-refresh {
  width: 40px;
  padding: 0;
  display: grid;
  place-items: center;
  border-radius: 13px;
}
.newsletter-refresh svg { width: 17px; height: 17px; }
.newsletter-refresh.is-loading svg {  }


.newsletter-library-heading {
  margin: 19px 2px 10px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
}
.newsletter-library-heading h3 { margin: 3px 0 0; font-family: var(--font-display); font-size: 20px; }
.newsletter-library-heading > span { color: var(--muted); font-size: 8px; font-weight: 800; }

.newsletter-list { display: grid; gap: 12px; }
.newsletter-year-group { display: grid; gap: 9px; }
.newsletter-year-heading {
  margin: 7px 2px 0;
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--gold-light);
  font-family: var(--font-display);
  font-size: 17px;
}
.newsletter-year-heading::after { content: ""; height: 1px; flex: 1; background: linear-gradient(90deg, var(--border-strong), transparent); }

.newsletter-card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 13px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 21px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--plum) 8%, transparent), transparent 45%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: var(--card-shadow), inset 0 1px 0 rgba(255,255,255,.035);
  
  
}

.newsletter-cover {
  position: relative;
  min-height: 126px;
  overflow: hidden;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--plum) 24%, var(--border));
  border-radius: 15px;
  color: var(--gold-light);
  background:
    linear-gradient(155deg, color-mix(in srgb, var(--plum) 20%, var(--surface-soft)), color-mix(in srgb, var(--surface) 82%, var(--bg)));
}
.newsletter-cover::before {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  pointer-events: none;
}
.newsletter-cover img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: var(--surface-soft);
}
.newsletter-cover img.is-broken { display: none; }
.newsletter-cover-fallback {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  text-align: center;
}
.newsletter-cover-fallback svg { width: 34px; height: 34px; }
.newsletter-cover-fallback strong { margin-top: 7px; font-family: var(--font-display); font-size: 14px; }
.newsletter-cover-fallback span { margin-top: 2px; color: var(--muted); font-size: 7px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.newsletter-card-copy { min-width: 0; display: flex; flex-direction: column; }
.newsletter-card h4 {
  margin: 4px 0 5px;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-family: var(--font-display);
  font-size: 17px;
  line-height: 1.14;
}
.newsletter-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.4;
}
.newsletter-card-meta span { display: inline-flex; align-items: center; gap: 4px; }
.newsletter-card-meta span + span::before { content: "•"; margin-right: 1px; color: var(--border-strong); }
.newsletter-card-actions {
  margin-top: auto;
  padding-top: 11px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}
.newsletter-action {
  min-height: 39px;
  padding: 0 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--border);
  border-radius: 11px;
  color: var(--cream);
  background: color-mix(in srgb, var(--surface-soft) 70%, transparent);
  font-size: 8px;
  font-weight: 850;
}
.newsletter-action svg { width: 15px; height: 15px; flex: 0 0 auto; }
.newsletter-action.primary { color: var(--ink); border-color: transparent; background: linear-gradient(135deg, var(--gold), var(--gold-light)); }
.newsletter-action.email { color: var(--gold-light); }

.newsletter-loading,
.newsletter-empty {
  min-height: 180px;
  padding: 30px 18px;
  display: grid;
  place-items: center;
  align-content: center;
  text-align: center;
  border: 1px dashed var(--border-strong);
  border-radius: 20px;
  color: var(--muted);
  background: color-mix(in srgb, var(--surface) 72%, transparent);
}
.newsletter-loading span {
  width: 28px;
  height: 28px;
  margin-bottom: 10px;
  border: 3px solid var(--border);
  border-top-color: var(--gold);
  border-radius: 50%;
  
}
.newsletter-loading strong,
.newsletter-empty strong { color: var(--cream); font-size: 12px; }
.newsletter-loading p,
.newsletter-empty p { margin: 5px 0 0; font-size: 9px; line-height: 1.5; }

.newsletter-reader,
.newsletter-email-modal {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.newsletter-reader-backdrop,
.newsletter-email-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(0,0,0,.72);
  opacity: 0;
  
}
.newsletter-reader-panel,
.newsletter-email-panel {
  position: relative;
  width: min(760px, 100%);
  border: 1px solid var(--border);
  border-radius: 25px 25px 0 0;
  background: var(--surface-raised);
  box-shadow: 0 -28px 70px rgba(0,0,0,.46);
  transform: translateY(102%);
  
}
.newsletter-reader.open .newsletter-reader-backdrop,
.newsletter-email-modal.open .newsletter-email-backdrop { opacity: 1; }
.newsletter-reader.open .newsletter-reader-panel,
.newsletter-email-modal.open .newsletter-email-panel { transform: translateY(0); }
.newsletter-reader-panel {
  height: 94dvh;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}
.newsletter-reader-header {
  padding: 14px 15px 12px;
  display: flex;
  align-items: center;
  gap: 11px;
  border-bottom: 1px solid var(--border);
}
.newsletter-reader-header > div { min-width: 0; flex: 1; }
.newsletter-reader-header span { display: block; color: var(--gold); font-size: 7px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.newsletter-reader-header strong { display: block; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.newsletter-modal-close {
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  border: 1px solid var(--border);
  border-radius: 13px;
  color: var(--cream);
  background: var(--surface);
  font-size: 23px;
  line-height: 1;
}
.newsletter-reader-frame-wrap { position: relative; min-height: 0; background: #2f3136; }
.newsletter-reader-frame {
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}
.newsletter-reader-actions {
  padding: 10px 12px calc(12px + env(safe-area-inset-bottom));
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
  border-top: 1px solid var(--border);
}
.newsletter-reader-actions button,
.newsletter-reader-actions a {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--border);
  border-radius: 13px;
  color: var(--cream);
  background: var(--surface);
  font-size: 9px;
  font-weight: 850;
}
.newsletter-reader-actions a { color: var(--ink); border-color: transparent; background: linear-gradient(135deg, var(--gold), var(--gold-light)); }
.newsletter-reader-actions svg { width: 17px; height: 17px; }

.newsletter-email-panel { padding: 19px 18px calc(20px + env(safe-area-inset-bottom)); }
.newsletter-email-icon {
  width: 58px;
  height: 58px;
  margin-bottom: 13px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  color: var(--gold-light);
  background: color-mix(in srgb, var(--plum) 16%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--plum) 30%, var(--border));
}
.newsletter-email-icon svg { width: 31px; height: 31px; }
.newsletter-email-panel h3 { margin: 5px 44px 6px 0; font-family: var(--font-display); font-size: 23px; }
.newsletter-email-panel > p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.newsletter-email-title {
  margin-top: 13px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 13px;
  color: var(--gold-light);
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  font-size: 10px;
  font-weight: 800;
}
.newsletter-email-form { margin-top: 14px; display: grid; gap: 10px; }
.newsletter-email-form label { display: grid; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 800; }
.newsletter-email-form input[type="email"] {
  width: 100%;
  min-height: 52px;
  padding: 0 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  outline: 0;
  color: var(--cream);
  background: var(--surface);
  font: inherit;
  font-size: 12px;
}
.newsletter-email-form input[type="email"]:focus { border-color: var(--gold); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 10%, transparent); }
.newsletter-honeypot { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.newsletter-email-submit {
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 14px;
  color: var(--ink);
  background: linear-gradient(135deg, var(--gold), var(--gold-light));
  box-shadow: 0 12px 24px color-mix(in srgb, var(--gold) 16%, transparent);
  font-size: 10px;
  font-weight: 900;
}
.newsletter-email-submit:disabled { opacity: .58; cursor: wait; }
.newsletter-email-submit.is-loading::after { content: ""; width: 15px; height: 15px; border: 2px solid rgba(0,0,0,.22); border-top-color: var(--ink); border-radius: 50%;  }
.newsletter-email-message { padding: 10px 11px; border: 1px solid color-mix(in srgb, #d45a4f 30%, transparent); border-radius: 12px; color: #f1a39c; background: color-mix(in srgb, #d45a4f 9%, transparent); font-size: 9px; line-height: 1.5; }
.newsletter-email-message.success { color: #a9d7b1; border-color: color-mix(in srgb, var(--green) 35%, transparent); background: color-mix(in srgb, var(--green) 10%, transparent); }
.newsletter-email-note { margin: 0; text-align: center; color: var(--muted); font-size: 8px; line-height: 1.45; }

.newsletter-toast {
  position: fixed;
  left: 50%;
  bottom: calc(88px + env(safe-area-inset-bottom));
  z-index: 120;
  width: min(420px, calc(100% - 28px));
  padding: 12px 14px;
  border: 1px solid var(--border-strong);
  border-radius: 14px;
  color: var(--cream);
  background: color-mix(in srgb, var(--surface-raised) 94%, transparent);
  box-shadow: 0 16px 40px rgba(0,0,0,.34);
  backdrop-filter: blur(14px);
  text-align: center;
  font-size: 9px;
  font-weight: 750;
  line-height: 1.45;
  transform: translate(-50%, 18px);
  opacity: 0;
  pointer-events: none;
  
}
.newsletter-toast.visible { opacity: 1; transform: translate(-50%, 0); }

/* Admin hand-off to Google Drive */
.admin-newsletter-sync {
  margin-top: 12px;
  padding: 13px;
  display: grid;
  grid-template-columns: 43px minmax(0,1fr);
  gap: 10px;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--plum) 28%, var(--border));
  border-radius: 17px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--plum) 14%, transparent), transparent 55%),
    color-mix(in srgb, var(--surface) 78%, transparent);
}
.admin-newsletter-sync-icon {
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: var(--gold-light);
  background: color-mix(in srgb, var(--plum) 16%, var(--surface-raised));
  border: 1px solid color-mix(in srgb, var(--plum) 28%, var(--border));
}
.admin-newsletter-sync-icon svg { width: 23px; height: 23px; }
.admin-newsletter-sync-copy strong { display: block; font-size: 11px; }
.admin-newsletter-sync-copy span { display: block; margin-top: 3px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.admin-newsletter-sync-actions { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.admin-newsletter-sync-actions a,
.admin-newsletter-sync-actions button {
  min-height: 41px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--border);
  border-radius: 12px;
  color: var(--cream);
  background: var(--surface-raised);
  font-size: 8px;
  font-weight: 850;
}
.admin-newsletter-sync-actions a { color: var(--ink); border-color: transparent; background: var(--gold); }
.admin-newsletter-sync-actions svg { width: 15px; height: 15px; }

@media (min-width: 700px) {
  .newsletter-reader { align-items: center; }
  .newsletter-reader-panel { height: min(92dvh, 900px); border-radius: 25px; }
  .newsletter-email-modal { align-items: center; }
  .newsletter-email-panel { width: min(500px, calc(100% - 32px)); border-radius: 25px; }
}

@media (max-width: 390px) {
  .newsletters-screen { padding-inline: 10px; }
  .newsletter-card { grid-template-columns: 82px minmax(0, 1fr); gap: 10px; padding: 10px; }
  .newsletter-cover { min-height: 122px; }
  .newsletter-card h4 { font-size: 15px; }
  .newsletter-action { min-height: 38px; padding-inline: 5px; font-size: 7.5px; }
  .newsletter-reader-actions button,
  .newsletter-reader-actions a { font-size: 8px; }
}

.admin-stats.admin-stats-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.admin-stats.admin-stats-four > div { padding-inline: 4px; }
.admin-stats.admin-stats-four span { font-size: 6.5px; }
.admin-stats.admin-stats-four strong { font-size: 20px; }
@media (max-width: 370px) {
  .admin-stats.admin-stats-four { grid-template-columns: repeat(2, 1fr); }
}

/* ===== END newsletters.css ===== */

/* ===== BEGIN calendars.css ===== */
/* ================================================================
   CLUB CALENDARS
   ================================================================ */
.calendars-screen {
  padding-top: 20px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--blue) 13%, transparent), transparent 24rem),
    radial-gradient(circle at 0% 44%, color-mix(in srgb, var(--gold) 7%, transparent), transparent 23rem),
    var(--bg);
}
.calendars-page-header { margin-bottom: 18px; }

.calendar-hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  margin-bottom: 17px;
  padding: 19px;
  border: 1px solid color-mix(in srgb, var(--blue) 28%, var(--border));
  border-radius: var(--radius-xl);
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--blue) 19%, transparent), transparent 56%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: var(--card-shadow), inset 0 1px 0 rgba(255,255,255,.05);
}
.calendar-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .16;
  background-image: radial-gradient(circle, rgba(255,255,255,.22) .7px, transparent .8px);
  background-size: 18px 18px;
  mask-image: linear-gradient(125deg, black, transparent 72%);
}
.calendar-hero-main { display: flex; align-items: center; gap: 14px; }
.calendar-hero-icon {
  width: 66px;
  height: 66px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 21px;
  color: color-mix(in srgb, var(--blue) 76%, var(--cream));
  border: 1px solid color-mix(in srgb, var(--blue) 34%, var(--border));
  background: color-mix(in srgb, var(--blue) 13%, var(--surface-raised));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 13px 26px rgba(0,0,0,.16);
}
.calendar-hero-icon svg { width: 39px; height: 39px; }
.calendar-overline {
  display: block;
  margin-bottom: 3px;
  color: var(--gold);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.calendar-hero h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 24px;
  line-height: 1.05;
}
.calendar-hero p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.55;
}
.calendar-hero-stats {
  margin-top: 16px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.calendar-hero-stat {
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface) 78%, transparent);
}
.calendar-hero-stat span {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 7px;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.calendar-hero-stat strong { font-family: var(--font-display); font-size: 17px; }

.calendar-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin: 22px 2px 11px;
}
.calendar-section-heading h3 { margin: 0; font-family: var(--font-display); font-size: 19px; }
.calendar-section-heading p { margin: 3px 0 0; color: var(--muted); font-size: 9px; }

.calendar-selector {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.calendar-choice {
  --choice-accent: var(--blue);
  min-width: 0;
  min-height: 88px;
  padding: 12px;
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) 22px;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--border);
  border-radius: 17px;
  color: var(--cream);
  text-align: left;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--choice-accent) 10%, transparent), transparent 68%),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: var(--card-shadow), inset 0 1px 0 rgba(255,255,255,.04);
  
  
}

.calendar-choice:nth-child(2) { --choice-accent: var(--gold); }
.calendar-choice:nth-child(3) { --choice-accent: var(--green); }
.calendar-choice:nth-child(4) { --choice-accent: var(--rust-light); }
.calendar-choice.active {
  border-color: color-mix(in srgb, var(--choice-accent) 66%, var(--border));
  box-shadow: 0 15px 32px color-mix(in srgb, var(--choice-accent) 12%, rgba(0,0,0,.2)), inset 0 0 0 1px color-mix(in srgb, var(--choice-accent) 34%, transparent);
}
.calendar-choice-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: color-mix(in srgb, var(--choice-accent) 86%, var(--cream));
  background: color-mix(in srgb, var(--choice-accent) 12%, var(--surface-raised));
  border: 1px solid color-mix(in srgb, var(--choice-accent) 26%, transparent);
}
.calendar-choice-icon svg { width: 24px; height: 24px; }
.calendar-choice-copy { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.calendar-choice-copy small {
  color: var(--muted);
  font-size: 6.5px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.calendar-choice-copy strong { font-size: 10px; line-height: 1.25; overflow-wrap: anywhere; }
.calendar-choice-check {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--ink);
  background: var(--choice-accent);
  font-size: 11px;
  font-weight: 900;
  opacity: 0;
  transform: scale(.7);
  
}
.calendar-choice.active .calendar-choice-check { opacity: 1; transform: scale(1); }

.calendar-viewer {
  scroll-margin-top: 14px;
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  background: var(--surface);
  box-shadow: var(--card-shadow);
}
.calendar-viewer-header {
  padding: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(145deg, var(--surface-raised), var(--surface));
}
.calendar-viewer-title { min-width: 0; }
.calendar-viewer-title span {
  display: block;
  margin-bottom: 2px;
  color: var(--gold);
  font-size: 7px;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.calendar-viewer-title strong { display: block; font-family: var(--font-display); font-size: 17px; }
.calendar-view-toggle {
  flex: 0 0 auto;
  display: flex;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-soft);
}
.calendar-view-toggle button {
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 9px;
  color: var(--muted);
  background: transparent;
  font-size: 8px;
  font-weight: 850;
}
.calendar-view-toggle button.active { color: var(--ink); background: linear-gradient(135deg, var(--gold-light), var(--gold)); }
.calendar-frame-wrap { position: relative; min-height: 560px; background: #fff; }
.calendar-frame {
  width: 100%;
  height: 620px;
  display: block;
  border: 0;
  background: #fff;
  
}
.calendar-frame.is-loading { opacity: .2; }
.calendar-loading {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 9px;
  color: #4f463d;
  background: rgba(255,255,255,.92);
  font-size: 10px;
  font-weight: 800;
}
.calendar-loading[hidden] { display: none; }
.calendar-loading span {
  width: 28px;
  height: 28px;
  border: 3px solid rgba(79,70,61,.2);
  border-top-color: #b48830;
  border-radius: 50%;
  
}

.calendar-viewer-footer {
  padding: 10px 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-top: 1px solid var(--border);
  background: var(--surface-raised);
}
.calendar-status {
  min-width: 0;
  color: var(--muted);
  font-size: 8px;
  font-weight: 750;
}
.calendar-refresh {
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}
.calendar-refresh svg { width: 18px; height: 18px; }

.calendar-actions {
  margin-top: 12px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}
.calendar-action {
  min-height: 54px;
  padding: 0 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--border);
  border-radius: 15px;
  color: var(--cream);
  background: linear-gradient(145deg, var(--surface-raised), var(--surface));
  font-size: 9px;
  font-weight: 850;
  text-align: center;
}
.calendar-action.primary { color: var(--ink); border-color: transparent; background: linear-gradient(135deg, var(--gold-light), var(--gold)); }
.calendar-action svg { width: 18px; height: 18px; flex: 0 0 auto; }
.calendar-help {
  margin: 13px 0 0;
  padding: 13px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: 1px solid color-mix(in srgb, var(--blue) 23%, var(--border));
  border-radius: 16px;
  background: color-mix(in srgb, var(--blue) 7%, var(--surface));
}
.calendar-help-icon {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: color-mix(in srgb, var(--blue) 80%, var(--cream));
  background: color-mix(in srgb, var(--blue) 12%, transparent);
}
.calendar-help-icon svg { width: 19px; height: 19px; }
.calendar-help strong { display: block; margin-bottom: 3px; font-size: 10px; }
.calendar-help p { margin: 0; color: var(--muted); font-size: 8px; line-height: 1.5; }

@media (max-width: 390px) {
  .calendar-selector { grid-template-columns: 1fr; }
  .calendar-choice { min-height: 74px; }
  .calendar-frame { height: 560px; }
  .calendar-actions { grid-template-columns: 1fr; }
  .calendar-viewer-header { align-items: flex-start; flex-direction: column; }
  .calendar-view-toggle { width: 100%; }
  .calendar-view-toggle button { flex: 1; }
}

.calendar-choice-logo{overflow:hidden;background:#fff!important;padding:4px!important;border-radius:50%!important;}.calendar-choice-logo img{width:100%;height:100%;object-fit:contain;border-radius:50%;}.calendar-choice.active .calendar-choice-logo{box-shadow:0 0 0 2px rgba(255,215,88,.75);}

/* ===== END calendars.css ===== */

/* ===== BEGIN gallery.css ===== */
/* =====================================================================
   CCSA NATAL MIDLANDS — GOOGLE DRIVE PHOTO GALLERY
   ===================================================================== */

.gallery-screen {
  min-height: 100dvh;
  padding-bottom: 118px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--green) 18%, transparent), transparent 24rem),
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 88%, #0d2115 12%), var(--bg));
}

.gallery-page-header {
  border-bottom: 1px solid color-mix(in srgb, var(--gold) 24%, transparent);
  background:
    radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--gold) 14%, transparent), transparent 18rem),
    linear-gradient(180deg, color-mix(in srgb, var(--surface-raised) 74%, #100c08 26%), color-mix(in srgb, var(--surface) 88%, #0c160f 12%));
}

.gallery-hero {
  position: relative;
  overflow: hidden;
  margin: 18px;
  min-height: 310px;
  padding: 26px 24px 22px;
  border: 1px solid color-mix(in srgb, var(--gold) 46%, transparent);
  border-radius: 28px;
  background:
    linear-gradient(180deg, transparent 0 38%, rgba(4,13,8,.72) 77%, rgba(5,14,9,.96) 100%),
    radial-gradient(circle at 18% 8%, color-mix(in srgb, var(--gold) 24%, transparent), transparent 20rem),
    linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 86%, #143923 14%), color-mix(in srgb, var(--surface) 92%, #07140d 8%));
  box-shadow: var(--card-shadow), inset 0 1px 0 rgba(255,255,255,.06);
}

.gallery-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .34;
  background-image:
    linear-gradient(125deg, transparent 0 44%, rgba(255,255,255,.035) 45% 47%, transparent 48% 100%),
    radial-gradient(circle, rgba(255,255,255,.18) .55px, transparent .75px);
  background-size: 100% 100%, 19px 19px;
}

.gallery-hero-art {
  position: relative;
  height: 122px;
  margin: -2px 0 10px;
}

.gallery-polaroid {
  position: absolute;
  display: block;
  width: 108px;
  height: 86px;
  padding: 7px 7px 17px;
  border-radius: 5px;
  background: #f7efde;
  box-shadow: 0 18px 28px rgba(0,0,0,.32), inset 0 0 0 1px rgba(94,63,27,.22);
}

.gallery-polaroid::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background:
    radial-gradient(circle at 72% 22%, #f3d478 0 6%, transparent 7%),
    linear-gradient(165deg, #5c8da2 0 42%, #8eb267 43% 58%, #325a38 59% 100%);
}
.gallery-polaroid::after {
  content: "";
  position: absolute;
  top: -9px;
  left: 50%;
  width: 31px;
  height: 17px;
  transform: translateX(-50%) rotate(-3deg);
  background: rgba(224,190,104,.66);
  box-shadow: 0 2px 4px rgba(0,0,0,.16);
}
.gallery-polaroid.one { left: 8%; top: 23px; transform: rotate(-9deg); }
.gallery-polaroid.two { left: 50%; top: 5px; transform: translateX(-50%) rotate(2deg) scale(1.12); z-index: 2; }
.gallery-polaroid.three { right: 8%; top: 23px; transform: rotate(10deg); }
.gallery-polaroid.two::before { background: linear-gradient(160deg, #efb14e 0 32%, #476a39 33% 52%, #1c3d28 53% 100%); }
.gallery-polaroid.three::before { background: linear-gradient(145deg, #87b4cf 0 38%, #e7c887 39% 55%, #456340 56% 100%); }

.gallery-hero-copy,
.gallery-hero-stats { position: relative; z-index: 3; }
.gallery-overline {
  display: block;
  color: var(--gold-light);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.gallery-hero h3 {
  margin: 5px 0 8px;
  color: var(--cream);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.75rem, 7vw, 2.35rem);
  line-height: .98;
  letter-spacing: -.035em;
}
.gallery-hero p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}
.gallery-hero-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}
.gallery-hero-stats div {
  padding: 13px 15px;
  border: 1px solid color-mix(in srgb, var(--gold) 24%, transparent);
  border-radius: 17px;
  background: color-mix(in srgb, var(--surface) 76%, transparent);
  backdrop-filter: blur(8px);
}
.gallery-hero-stats strong {
  display: block;
  color: var(--gold-light);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.6rem;
  line-height: 1;
}
.gallery-hero-stats span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 9px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.gallery-controls {
  position: relative;
  z-index: 4;
  margin: 0 18px 18px;
}
.gallery-search {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 57px;
  padding: 0 18px;
  border: 1px solid color-mix(in srgb, var(--gold) 34%, transparent);
  border-radius: 19px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 76%, transparent), color-mix(in srgb, var(--surface) 90%, transparent));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 12px 24px rgba(0,0,0,.15);
}
.gallery-search svg { width: 22px; color: var(--gold); flex: 0 0 auto; }
.gallery-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--cream);
  font: inherit;
  font-size: 14px;
}
.gallery-search input::placeholder { color: color-mix(in srgb, var(--muted) 80%, transparent); }

.gallery-year-row {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  padding-bottom: 4px;
  overflow-x: auto;
  scrollbar-width: none;
}
.gallery-year-row::-webkit-scrollbar { display: none; }
.gallery-year-row button {
  min-height: 42px;
  padding: 0 16px;
  flex: 0 0 auto;
  border: 1px solid color-mix(in srgb, var(--gold) 34%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-raised) 78%, transparent);
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}
.gallery-year-row button.active {
  border-color: var(--gold-light);
  background: linear-gradient(145deg, var(--gold-light), var(--gold));
  color: #17110d;
  box-shadow: 0 8px 20px color-mix(in srgb, var(--gold) 26%, transparent);
}
.gallery-control-actions {
  display: flex;
  gap: 10px;
  margin-top: 11px;
}
.gallery-drive-link,
.gallery-refresh {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 45px;
  padding: 0 14px;
  border: 1px solid color-mix(in srgb, var(--gold) 28%, transparent);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  color: var(--cream);
  text-decoration: none;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
}
.gallery-drive-link { flex: 1; }
.gallery-refresh { color: var(--gold-light); }
.gallery-drive-link svg,
.gallery-refresh svg { width: 18px; }
.gallery-refresh.is-loading svg {  }


.gallery-setup,
.gallery-error,
.gallery-empty,
.gallery-loading {
  margin: 18px;
  padding: 20px;
  border: 1px solid color-mix(in srgb, var(--gold) 30%, transparent);
  border-radius: 22px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 84%, transparent), color-mix(in srgb, var(--surface) 95%, transparent));
  box-shadow: var(--card-shadow);
}
.gallery-setup { display: flex; align-items: center; gap: 16px; }
.gallery-setup-icon {
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  flex: 0 0 auto;
  border-radius: 16px;
  color: var(--gold-light);
  background: color-mix(in srgb, var(--gold) 15%, transparent);
}
.gallery-setup-icon svg { width: 27px; }
.gallery-setup strong,
.gallery-error strong,
.gallery-empty strong,
.gallery-loading strong { display: block; color: var(--cream); font-size: 15px; }
.gallery-setup p,
.gallery-error p,
.gallery-empty p,
.gallery-loading p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.gallery-loading { text-align: center; }
.gallery-loading > span,
.gallery-photo-loading > span,
.gallery-viewer-spinner > span {
  display: inline-block;
  width: 28px;
  height: 28px;
  margin-bottom: 8px;
  border: 3px solid color-mix(in srgb, var(--gold) 20%, transparent);
  border-top-color: var(--gold-light);
  border-radius: 50%;
  
}

.gallery-album-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0 18px 24px;
}
.gallery-album-card {
  position: relative;
  overflow: hidden;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--gold) 30%, transparent);
  border-radius: 23px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 90%, transparent), color-mix(in srgb, var(--surface) 98%, transparent));
  color: var(--cream);
  text-align: left;
  box-shadow: 0 14px 30px rgba(0,0,0,.21), inset 0 1px 0 rgba(255,255,255,.04);
  
  
}

.gallery-album-card:active { transform: scale(.985); }
.gallery-album-cover {
  position: relative;
  display: block;
  height: 154px;
  overflow: hidden;
  background: linear-gradient(150deg, #203f2b, #0c1f14);
}
.gallery-album-cover img {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  
}
.gallery-album-card:hover .gallery-album-cover img { transform: scale(1.035); }
.gallery-album-placeholder {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: color-mix(in srgb, var(--gold) 70%, var(--cream));
  opacity: .45;
}
.gallery-album-placeholder svg { width: 54px; }
.gallery-album-shade {
  position: absolute;
  z-index: 3;
  inset: 0;
  background: linear-gradient(180deg, transparent 42%, rgba(5,13,9,.78));
}
.gallery-photo-badge {
  position: absolute;
  z-index: 4;
  left: 10px;
  bottom: 10px;
  padding: 6px 9px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  background: rgba(7,18,12,.72);
  backdrop-filter: blur(8px);
  color: #fff9ed;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .05em;
}
.gallery-album-copy {
  display: block;
  min-height: 106px;
  padding: 15px 37px 15px 15px;
}
.gallery-album-overline {
  display: block;
  margin-bottom: 4px;
  color: var(--gold-light);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.gallery-album-copy strong {
  display: block;
  color: var(--cream);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1rem;
  line-height: 1.08;
}
.gallery-album-copy > span:last-child {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gallery-album-arrow {
  position: absolute;
  right: 12px;
  bottom: 18px;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid color-mix(in srgb, var(--gold) 42%, transparent);
  border-radius: 50%;
  color: var(--gold-light);
  font-size: 21px;
}

.gallery-album-modal,
.gallery-viewer {
  position: fixed;
  inset: 0;
  z-index: 170;
}
.gallery-viewer { z-index: 190; }
.gallery-modal-backdrop,
.gallery-viewer-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(2,8,5,.84);
  backdrop-filter: blur(9px);
}
.gallery-album-panel {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: min(100%, 760px);
  max-height: 94dvh;
  overflow: auto;
  transform: translateX(-50%);
  border: 1px solid color-mix(in srgb, var(--gold) 40%, transparent);
  border-bottom: 0;
  border-radius: 28px 28px 0 0;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--green) 17%, transparent), transparent 23rem),
    linear-gradient(180deg, color-mix(in srgb, var(--surface-raised) 92%, #11100b 8%), var(--bg));
  box-shadow: 0 -24px 80px rgba(0,0,0,.48);
}
.gallery-modal-handle {
  width: 52px;
  height: 4px;
  margin: 10px auto 4px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--gold) 50%, transparent);
}
.gallery-album-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px 10px;
}
.gallery-album-header h3 {
  margin: 5px 0 2px;
  color: var(--cream);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.55rem, 6vw, 2.2rem);
  line-height: 1;
}
.gallery-album-header p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.gallery-modal-close,
.gallery-viewer-header button {
  display: grid;
  place-items: center;
  width: 43px;
  height: 43px;
  flex: 0 0 auto;
  border: 1px solid color-mix(in srgb, var(--gold) 28%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 84%, transparent);
  color: var(--cream);
  font-size: 27px;
}
.gallery-album-toolbar {
  display: flex;
  gap: 10px;
  padding: 0 20px 16px;
}
.gallery-album-toolbar button,
.gallery-album-toolbar a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid color-mix(in srgb, var(--gold) 30%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 86%, transparent);
  color: var(--cream);
  text-decoration: none;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
}
.gallery-album-toolbar button { flex: 1; color: #17110d; background: linear-gradient(145deg, var(--gold-light), var(--gold)); }
.gallery-album-toolbar svg { width: 17px; }
.gallery-photo-loading { padding: 40px 20px; color: var(--muted); text-align: center; font-size: 12px; }
.gallery-photo-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3px;
  padding: 0 3px 22px;
}
.gallery-photo-card {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  padding: 0;
  border: 0;
  background: #14251a;
}
.gallery-photo-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  
}
.gallery-photo-hover {
  position: absolute;
  inset: auto 0 0;
  display: block;
  padding: 28px 9px 8px;
  background: linear-gradient(transparent, rgba(4,13,8,.92));
  color: #fff;
  text-align: left;
  opacity: 0;
  
}
.gallery-photo-hover strong,
.gallery-photo-hover small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gallery-photo-hover strong { font-size: 10px; }
.gallery-photo-hover small { margin-top: 2px; font-size: 8px; color: rgba(255,255,255,.72); }
.gallery-photo-card:hover img { transform: scale(1.045); filter: brightness(.82); }
.gallery-photo-card:hover .gallery-photo-hover { opacity: 1; }
.gallery-photo-empty,
.gallery-photo-error { grid-column: 1 / -1; padding: 42px 20px; color: var(--muted); text-align: center; }
.gallery-photo-empty strong,
.gallery-photo-error strong { color: var(--cream); }
.gallery-album-note { margin: 0 20px 22px; padding: 13px 15px; border-radius: 14px; background: color-mix(in srgb, var(--gold) 12%, transparent); color: var(--muted); font-size: 11px; }

.gallery-viewer-panel {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: #020604;
}
.gallery-viewer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  min-height: 67px;
  padding: max(10px, env(safe-area-inset-top)) 14px 10px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(4,12,8,.94);
}
.gallery-viewer-header span,
.gallery-viewer-header strong { display: block; }
.gallery-viewer-header span { color: rgba(255,255,255,.68); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.gallery-viewer-header strong { margin-top: 3px; color: #fff; font-size: 12px; }
.gallery-viewer-stage {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 0;
  overflow: hidden;
  touch-action: pan-y;
}
.gallery-viewer-stage img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  
}
.gallery-viewer-stage img.is-loading { opacity: .25; }
.gallery-viewer-nav {
  position: absolute;
  z-index: 3;
  top: 50%;
  display: grid;
  place-items: center;
  width: 46px;
  height: 58px;
  transform: translateY(-50%);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  background: rgba(4,13,8,.56);
  color: #fff;
  font-size: 37px;
  backdrop-filter: blur(8px);
}
.gallery-viewer-nav.previous { left: 11px; }
.gallery-viewer-nav.next { right: 11px; }
.gallery-viewer-nav:disabled { opacity: .25; }
.gallery-viewer-spinner { position: absolute; display: grid; place-items: center; }
.gallery-viewer-footer {
  padding: 14px 15px max(14px, env(safe-area-inset-bottom));
  border-top: 1px solid rgba(255,255,255,.08);
  background: rgba(4,12,8,.96);
}
.gallery-viewer-copy strong,
.gallery-viewer-copy span { display: block; }
.gallery-viewer-copy strong { color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: 1rem; }
.gallery-viewer-copy span { margin-top: 3px; color: rgba(255,255,255,.55); font-size: 10px; }
.gallery-viewer-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.gallery-viewer-actions button,
.gallery-viewer-actions a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 45px;
  border: 1px solid rgba(230,190,91,.26);
  border-radius: 14px;
  background: rgba(26,51,34,.72);
  color: #fff;
  text-decoration: none;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
}
.gallery-viewer-actions svg { width: 17px; }
.gallery-viewer-actions button.is-playing { color: #17110d; background: linear-gradient(145deg, var(--gold-light), var(--gold)); }
.gallery-toast {
  position: fixed;
  z-index: 230;
  left: 50%;
  bottom: calc(92px + env(safe-area-inset-bottom));
  max-width: calc(100vw - 36px);
  padding: 11px 16px;
  transform: translate(-50%, 18px);
  border: 1px solid color-mix(in srgb, var(--gold) 44%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-raised) 94%, #090b09 6%);
  color: var(--cream);
  font-size: 11px;
  font-weight: 800;
  box-shadow: 0 14px 34px rgba(0,0,0,.36);
  opacity: 0;
  pointer-events: none;
  
}
.gallery-toast.show { opacity: 1; transform: translate(-50%, 0); }
body.gallery-modal-open,
body.gallery-viewer-open { overflow: hidden; }


@media (min-width: 560px) {
  .gallery-album-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gallery-photo-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; padding-inline: 4px; }
  .gallery-hero { min-height: 330px; }
  .gallery-hero-art { height: 138px; }
  .gallery-polaroid { width: 128px; height: 100px; }
}

@media (max-width: 390px) {
  .gallery-album-cover { height: 136px; }
  .gallery-album-copy { min-height: 100px; padding-left: 13px; }
  .gallery-album-copy strong { font-size: .93rem; }
  .gallery-control-actions { flex-direction: column; }
  .gallery-photo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gallery-viewer-nav { width: 40px; height: 52px; }
}

@media (hover: none) {
  .gallery-photo-hover { opacity: 1; padding-top: 22px; }
}

/* ===== END gallery.css ===== */

/* ===== BEGIN notices.css ===== */
/* Notice Board — three switchable member views */
.notices-screen { padding-bottom: 110px; }
.notices-page-header { position: sticky; top: 0; z-index: 20; backdrop-filter: blur(16px); background: color-mix(in srgb, var(--bg) 88%, transparent); }
.notice-hero {
  position: relative; overflow: hidden; margin: 18px 18px 14px; padding: 24px;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 18px;
  border: 1px solid var(--border-strong); border-radius: 24px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--green) 24%, var(--surface-raised)), color-mix(in srgb, var(--surface) 88%, var(--gold) 12%));
  box-shadow: var(--card-shadow);
}
.notice-hero::after { content:""; position:absolute; inset:-45% -16% auto auto; width:240px; height:240px; border-radius:50%; background:radial-gradient(circle, color-mix(in srgb, var(--gold) 20%, transparent), transparent 68%); pointer-events:none; }
.notice-hero-copy { position: relative; z-index: 1; max-width: 430px; }
.notice-overline { display:block; margin-bottom:6px; color:var(--gold-light); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; font-weight:800; }
.notice-hero h3 { margin:0; font-family:var(--font-display); font-size:clamp(1.65rem,7vw,2.25rem); line-height:1.04; }
.notice-hero p { margin:10px 0 0; color:var(--muted); line-height:1.55; }
.notice-hero-count { position:relative; z-index:1; min-width:92px; padding:14px 12px; border-radius:18px; text-align:center; background:color-mix(in srgb, var(--bg) 60%, transparent); border:1px solid var(--border); }
.notice-hero-count strong { display:block; color:var(--gold-light); font:700 2rem/1 var(--font-display); }
.notice-hero-count span { display:block; margin-top:5px; color:var(--muted); font-size:.68rem; line-height:1.2; text-transform:uppercase; letter-spacing:.08em; }
.notice-controls { position:relative; margin:0 18px 18px; }
.notice-search { min-height:58px; display:flex; align-items:center; gap:12px; padding:0 17px; border-radius:17px; border:1px solid var(--border-strong); background:var(--surface); box-shadow:var(--card-shadow); }
.notice-search svg { width:22px; flex:0 0 auto; color:var(--gold); }
.notice-search input { width:100%; border:0; outline:0; background:transparent; color:var(--cream); font:600 1rem var(--font-body); }
.notice-search input::placeholder { color:color-mix(in srgb, var(--muted) 84%, transparent); }
.notice-view-button { width:100%; min-height:54px; margin-top:10px; padding:0 16px; display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid var(--border-strong); border-radius:16px; background:linear-gradient(135deg,var(--surface-raised),var(--surface)); box-shadow:var(--card-shadow); }
.notice-view-button svg { width:21px; color:var(--gold); }
.notice-view-button > span:nth-child(2) { margin-right:auto; }
.notice-view-button strong { color:var(--gold-light); }
.notice-view-menu { position:absolute; z-index:30; left:0; right:0; top:126px; padding:10px; border:1px solid var(--border-strong); border-radius:18px; background:color-mix(in srgb,var(--surface-raised) 96%, transparent); box-shadow:0 22px 60px rgba(0,0,0,.42); backdrop-filter:blur(18px); }
.notice-view-menu button { width:100%; min-height:68px; display:flex; align-items:center; gap:14px; padding:10px 12px; border:0; border-radius:14px; background:transparent; text-align:left; }
.notice-view-menu button:hover,.notice-view-menu button.selected { background:color-mix(in srgb,var(--gold) 12%, transparent); }
.notice-view-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; background:color-mix(in srgb,var(--gold) 14%, transparent); color:var(--gold-light); font-size:1.35rem; }
.notice-view-menu strong,.notice-view-menu small { display:block; }
.notice-view-menu small { margin-top:3px; color:var(--muted); }
.notice-filter-row { display:flex; gap:8px; margin-top:12px; overflow-x:auto; scrollbar-width:none; padding-bottom:3px; }
.notice-filter-row::-webkit-scrollbar { display:none; }
.notice-filter-row button { flex:0 0 auto; min-height:44px; padding:0 15px; border:1px solid var(--border-strong); border-radius:999px; background:var(--surface); color:var(--muted); font-weight:700; }
.notice-filter-row button.active { background:linear-gradient(135deg,var(--gold-light),var(--gold)); color:var(--ink); border-color:transparent; box-shadow:0 8px 22px color-mix(in srgb,var(--gold) 24%, transparent); }
.notice-loading,.notice-error,.notice-empty { margin:22px 18px; padding:24px; border-radius:20px; text-align:center; color:var(--muted); background:var(--surface); border:1px solid var(--border); }
.notice-loading span { display:inline-block; width:18px; height:18px; margin-right:8px; border:2px solid var(--border-strong); border-top-color:var(--gold); border-radius:50%; vertical-align:-4px;  }

.notice-list { margin:0 18px; display:grid; gap:14px; }
.notice-card { position:relative; overflow:hidden; border:1px solid var(--border); border-radius:22px; background:linear-gradient(145deg,var(--surface-raised),var(--surface)); box-shadow:var(--card-shadow); }
.notice-card-button { width:100%; padding:0; border:0; background:transparent; color:inherit; text-align:left; }
.notice-card-image { aspect-ratio:16/8.2; overflow:hidden; background:var(--surface-soft); }
.notice-card-image img { width:100%; height:100%; object-fit:cover; }
.notice-card-content { padding:19px; }
.notice-card-meta { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:9px; color:var(--muted); font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; }
.notice-category { padding:5px 9px; border-radius:999px; background:color-mix(in srgb,var(--green) 20%, transparent); color:color-mix(in srgb,var(--cream) 86%, var(--green)); }
.notice-pin,.notice-featured { color:var(--gold-light); }
.notice-card h3 { margin:0; font:700 clamp(1.28rem,5.6vw,1.72rem)/1.12 var(--font-display); }
.notice-card p { margin:10px 0 0; color:var(--muted); line-height:1.52; }
.notice-card-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:15px; }
.notice-card-date { color:var(--muted); font-size:.82rem; }
.notice-read-more { color:var(--gold-light); font-weight:800; }
.notice-doc-count { margin-left:auto; color:var(--gold-light); font-size:.75rem; font-weight:800; }

/* C — premium feed (default) */
.view-feed .notice-card:first-child { border-color:var(--gold); box-shadow:0 18px 44px color-mix(in srgb,var(--gold) 12%, rgba(0,0,0,.3)); }
.view-feed .notice-card:first-child .notice-card-image { aspect-ratio:16/8.5; }
.view-feed .notice-card:not(:first-child) .notice-card-button { display:grid; grid-template-columns:1fr 108px; }
.view-feed .notice-card:not(:first-child) .notice-card-image { order:2; aspect-ratio:auto; height:100%; min-height:150px; }
.view-feed .notice-card:not(:first-child) .notice-card-content { order:1; }

/* A — announcement cards */
.view-cards { gap:16px; }
.view-cards .notice-card { border-left:4px solid var(--gold); }
.view-cards .notice-card-button { display:grid; grid-template-columns:86px 1fr; }
.view-cards .notice-card-image { width:86px; height:100%; aspect-ratio:auto; min-height:174px; }
.view-cards .notice-card:not(.has-image) .notice-card-image { display:grid; place-items:center; background:linear-gradient(145deg,color-mix(in srgb,var(--green) 28%,var(--surface)),var(--surface)); }
.view-cards .notice-card:not(.has-image) .notice-card-image::after { content:"✦"; color:var(--gold); font-size:2rem; }
.view-cards .notice-card-content { padding:18px 16px; }

/* B — corkboard */
.view-board { grid-template-columns:repeat(2,minmax(0,1fr)); padding:14px; border-radius:24px; background:linear-gradient(rgba(80,45,20,.2),rgba(80,45,20,.2)), repeating-radial-gradient(circle at 12px 12px,#a87345 0 1.3px,#98673f 1.5px 3px); border:8px solid #6c4527; box-shadow:inset 0 0 0 2px #b17b47,var(--shadow); }
.view-board .notice-card { border-radius:8px; background:#f0e5cf; color:#253322; transform:rotate(var(--notice-tilt,0deg)); box-shadow:0 12px 18px rgba(44,23,9,.34); border:0; overflow:visible; }
.view-board .notice-card:nth-child(3n/**/+1) { --notice-tilt:-1.2deg; }
.view-board .notice-card:nth-child(3n/**/+2) { --notice-tilt:1.4deg; background:#f5eddf; }
.view-board .notice-card:nth-child(3n) { --notice-tilt:-.5deg; background:#e8d9a9; }
.view-board .notice-card::before { content:""; position:absolute; top:-9px; left:50%; width:18px; height:18px; transform:translateX(-50%); border-radius:50%; background:radial-gradient(circle at 35% 30%,#ffe6a1,#b77b1f 55%,#61400e); box-shadow:0 3px 5px rgba(0,0,0,.35); z-index:2; }
.view-board .notice-card-button { display:block; }
.view-board .notice-card-image { aspect-ratio:4/2.4; border-radius:6px 6px 0 0; }
.view-board .notice-card-content { padding:14px; }
.view-board .notice-card h3 { color:#17311f; font-size:1.08rem; }
.view-board .notice-card p,.view-board .notice-card-date { color:#5e554a; font-size:.8rem; }
.view-board .notice-card-meta { color:#665c50; }
.view-board .notice-category { background:#d6c69f; color:#273a27; }
.view-board .notice-read-more { color:#7c4d18; }
.view-board .notice-card-footer { display:block; }
.view-board .notice-doc-count { display:block; margin:7px 0 0; }

.notice-detail-modal,.notice-email-modal { position:fixed; inset:0; z-index:120; display:grid; align-items:end; }
.notice-detail-modal[hidden],.notice-email-modal[hidden] { display:none; }
.notice-modal-backdrop { position:absolute; inset:0; border:0; background:rgba(7,5,3,.74); backdrop-filter:blur(6px); }
.notice-detail-panel,.notice-email-panel { position:relative; z-index:1; width:min(100%,720px); max-height:92dvh; margin:0 auto; overflow:auto; border-radius:28px 28px 0 0; border:1px solid var(--border-strong); background:var(--bg-soft); box-shadow:0 -20px 60px rgba(0,0,0,.45); transform:translateY(14px); opacity:0;  }
.notice-detail-modal.open .notice-detail-panel,.notice-email-modal.open .notice-email-panel { transform:none; opacity:1; }
.notice-modal-handle { width:48px; height:5px; margin:10px auto 5px; border-radius:999px; background:var(--border-strong); }
.notice-modal-close { position:sticky; top:10px; z-index:4; float:right; width:46px; height:46px; margin:8px 12px -54px 0; border:1px solid var(--border-strong); border-radius:14px; background:color-mix(in srgb,var(--bg) 86%,transparent); font-size:1.8rem; line-height:1; }
.notice-detail-image { aspect-ratio:16/8.6; overflow:hidden; }
.notice-detail-image img { width:100%; height:100%; object-fit:cover; }
.notice-detail-content { padding:24px 20px 30px; }
.notice-detail-meta { display:flex; justify-content:space-between; gap:14px; color:var(--muted); font-size:.76rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.notice-detail-meta span { color:var(--gold-light); }
.notice-detail-content h3 { margin:10px 0 0; font:700 clamp(1.8rem,8vw,2.55rem)/1.05 var(--font-display); }
.notice-detail-summary { margin:12px 0 0; color:var(--gold-light); font-weight:700; line-height:1.5; }
.notice-detail-body { margin-top:18px; color:var(--cream); line-height:1.7; white-space:pre-wrap; }
.notice-documents { margin-top:24px; padding-top:20px; border-top:1px solid var(--border); }
.notice-documents-heading span,.notice-documents-heading small { display:block; }
.notice-documents-heading span { font:700 1.25rem var(--font-display); }
.notice-documents-heading small { margin-top:3px; color:var(--muted); }
.notice-document { margin-top:12px; padding:14px; border-radius:16px; background:var(--surface); border:1px solid var(--border); }
.notice-document-name { display:flex; align-items:center; gap:10px; font-weight:800; overflow-wrap:anywhere; }
.notice-document-name svg { width:24px; flex:0 0 auto; color:var(--gold); }
.notice-document-size { margin:5px 0 0 34px; color:var(--muted); font-size:.78rem; }
.notice-document-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:12px; }
.notice-document-actions a,.notice-document-actions button { min-height:44px; display:flex; align-items:center; justify-content:center; gap:6px; padding:0 8px; border:1px solid var(--border-strong); border-radius:12px; background:var(--surface-raised); color:var(--cream); font-size:.76rem; font-weight:800; }
.notice-document-actions .download { grid-column:span 3; background:linear-gradient(135deg,var(--gold-light),var(--gold)); color:var(--ink); border:0; }
.notice-email-panel { padding:20px; border-radius:26px 26px 0 0; }
.notice-email-panel h3 { margin:8px 0 0; font:700 1.6rem var(--font-display); }
.notice-email-panel p { color:var(--muted); line-height:1.55; }
.notice-email-panel label span { display:block; margin-bottom:7px; font-weight:800; }
.notice-email-panel input { width:100%; min-height:52px; padding:0 14px; border:1px solid var(--border-strong); border-radius:14px; background:var(--surface); color:var(--cream); font:600 1rem var(--font-body); }
.notice-email-panel button[type="submit"] { width:100%; min-height:52px; margin-top:12px; border:0; border-radius:14px; background:linear-gradient(135deg,var(--gold-light),var(--gold)); color:var(--ink); font-weight:900; }
.notice-honeypot { position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; opacity:0!important; }
.notice-email-message { margin-top:12px; padding:12px; border-radius:12px; background:color-mix(in srgb,var(--rust) 14%,transparent); color:var(--cream); }
.notice-email-message.success { background:color-mix(in srgb,var(--green) 22%,transparent); }
.notice-toast { position:fixed; z-index:150; left:50%; bottom:95px; width:min(calc(100% - 32px),520px); padding:13px 16px; transform:translate(-50%,22px); opacity:0; pointer-events:none; border-radius:14px; background:var(--cream); color:var(--ink); box-shadow:var(--shadow); text-align:center; font-weight:800;  }
.notice-toast.visible { transform:translate(-50%,0); opacity:1; }

/* Admin notice editor additions */
.admin-notice-preview { width:64px; height:64px; border-radius:12px; object-fit:cover; border:1px solid var(--border); }
.admin-notice-flags { display:flex; flex-wrap:wrap; gap:6px; }
.admin-notice-flags span { padding:4px 8px; border-radius:999px; background:color-mix(in srgb,var(--gold) 12%,transparent); color:var(--gold-light); font-size:.7rem; font-weight:800; }
.admin-existing-files { display:grid; gap:8px; margin-top:8px; }
.admin-existing-file { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-radius:12px; background:var(--surface); border:1px solid var(--border); }
.admin-existing-file span { min-width:0; overflow-wrap:anywhere; font-size:.82rem; }
.admin-existing-file button { flex:0 0 auto; border:1px solid color-mix(in srgb,var(--rust) 40%,var(--border)); border-radius:10px; background:transparent; color:var(--rust-light); padding:7px 10px; }
.admin-upload-note { color:var(--muted); font-size:.78rem; line-height:1.45; }

@media (max-width:560px) {
  .notice-hero { align-items:stretch; }
  .notice-hero-count { min-width:78px; }
  .view-feed .notice-card:not(:first-child) .notice-card-button { grid-template-columns:1fr 92px; }
  .view-board { gap:10px; padding:10px; border-width:6px; }
  .notice-document-actions { grid-template-columns:repeat(2,1fr); }
  .notice-document-actions .download { grid-column:span 2; }
}
@media (max-width:410px) {
  .notice-hero { display:block; }
  .notice-hero-count { width:max-content; margin-top:15px; }
  .view-board { grid-template-columns:1fr; }
  .view-cards .notice-card-button { grid-template-columns:72px 1fr; }
  .view-cards .notice-card-image { width:72px; }
}

/* ---------- V14 notice image and document improvements ---------- */
.notice-detail-image {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--border);
  overflow: visible;
  cursor: zoom-in;
  background: color-mix(in srgb, var(--bg) 88%, #000 12%);
}
.notice-detail-image[hidden] { display: none; }
.notice-detail-image img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: center;
}
.notice-image-enlarge {
  position: absolute;
  right: 12px;
  bottom: 12px;
  padding: 8px 11px;
  border: 1px solid color-mix(in srgb, var(--gold) 46%, transparent);
  border-radius: 999px;
  color: #fff9ea;
  background: rgba(7, 17, 11, .84);
  box-shadow: 0 8px 20px rgba(0,0,0,.32);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .02em;
  backdrop-filter: blur(8px);
}
.notice-image-modal {
  position: fixed;
  inset: 0;
  z-index: 150;
  display: grid;
  place-items: center;
  padding: max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));
}
.notice-image-modal[hidden] { display: none; }
.notice-image-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(3, 5, 3, .94);
  backdrop-filter: blur(12px);
}
.notice-image-panel {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: min(100%, 1200px);
  height: min(94dvh, 980px);
  margin: 0;
}
.notice-image-panel img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 14px;
  box-shadow: 0 24px 80px rgba(0,0,0,.65);
}
.notice-image-close {
  position: absolute;
  z-index: 3;
  top: 6px;
  right: 6px;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 16px;
  color: #fff;
  background: rgba(8, 17, 11, .82);
  font-size: 1.8rem;
  line-height: 1;
  box-shadow: 0 12px 28px rgba(0,0,0,.34);
}
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.notice-document-type {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  margin-left: 8px;
  border-radius: 999px;
  color: var(--gold-light);
  background: color-mix(in srgb, var(--gold) 12%, transparent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.notice-document.is-word .notice-document-name svg { color: #5aa1e3; }
.notice-document.is-pdf .notice-document-name svg { color: #d8785d; }

/* ===== END notices.css ===== */

/* ===== BEGIN resources.css ===== */
/* CCSA Natal Midlands Resource Library */
.resources-screen { padding-bottom: 122px; }
.resources-page-header { position: relative; }
.resource-hero {
  margin: 18px;
  padding: 22px;
  border: 1px solid var(--border-strong);
  border-radius: 26px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--gold) 16%, transparent), transparent 46%),
    linear-gradient(145deg, var(--premium-card-a, var(--surface-raised)), var(--premium-card-b, var(--surface)) 68%, var(--premium-card-c, var(--bg-soft)));
  box-shadow: var(--card-shadow);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
}
.resource-overline { display:block; color:var(--gold-light); font-size:9px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.resource-hero h3 { margin:6px 0 8px; color:var(--premium-card-text, var(--cream)); font-family:Georgia,serif; font-size:clamp(1.65rem,6vw,2.2rem); line-height:1; }
.resource-hero p { margin:0; color:var(--premium-card-muted, var(--muted)); font-size:13px; line-height:1.55; }
.resource-hero-count { min-width:92px; padding:15px 12px; border:1px solid var(--border); border-radius:20px; background:color-mix(in srgb, var(--premium-control-b, var(--surface)) 82%, transparent); text-align:center; }
.resource-hero-count strong { display:block; color:var(--gold-light); font-family:Georgia,serif; font-size:2rem; }
.resource-hero-count span { color:var(--premium-card-muted, var(--muted)); font-size:9px; text-transform:uppercase; letter-spacing:.11em; }
.resource-controls { position:relative; margin:0 18px 18px; }
.resource-search { display:flex; align-items:center; gap:10px; padding:0 16px; min-height:58px; border:1px solid var(--border); border-radius:18px; background:linear-gradient(145deg,var(--premium-control-a,var(--surface-raised)),var(--premium-control-b,var(--surface))); }
.resource-search svg { width:21px; color:var(--gold); flex:0 0 auto; }
.resource-search input { width:100%; border:0; outline:0; background:transparent; color:var(--premium-card-text,var(--cream)); font:inherit; font-size:15px; }
.resource-search input::placeholder { color:var(--premium-card-muted,var(--muted)); }
.resource-filter-row { display:flex; gap:9px; overflow-x:auto; padding:12px 0 4px; scrollbar-width:none; }
.resource-filter-row::-webkit-scrollbar { display:none; }
.resource-filter-row button { flex:0 0 auto; border:1px solid var(--border); border-radius:999px; padding:11px 15px; background:linear-gradient(145deg,var(--premium-control-a,var(--surface-raised)),var(--premium-control-b,var(--surface))); color:var(--premium-card-muted,var(--muted)); font-weight:800; font-size:12px; }
.resource-filter-row button.active { color:var(--ink); border-color:var(--gold-light); background:linear-gradient(145deg,var(--gold-light),var(--gold)); box-shadow:0 9px 22px color-mix(in srgb,var(--gold) 26%,transparent); }
.resource-list { margin:0 18px; display:grid; gap:14px; }
.resource-card { position:relative; padding:19px; border:1px solid var(--border); border-radius:24px; color:var(--cream); background:radial-gradient(circle at 95% 0%,color-mix(in srgb,var(--gold) 10%,transparent),transparent 44%),linear-gradient(145deg,var(--premium-card-a,var(--surface-raised)),var(--premium-card-b,var(--surface)) 65%,var(--premium-card-c,var(--bg-soft))); box-shadow:var(--card-shadow);   overflow:hidden; }
.resource-card.is-featured { border-color:var(--border-strong); box-shadow:0 18px 42px color-mix(in srgb,var(--gold) 12%,rgba(0,0,0,.25)); }
.resource-featured { position:absolute; top:0; right:18px; padding:7px 11px; border-radius:0 0 12px 12px; color:var(--ink); background:linear-gradient(145deg,var(--gold-light),var(--gold)); font-size:9px; font-weight:900; letter-spacing:.11em; text-transform:uppercase; }
.resource-card-top { display:flex; gap:15px; align-items:flex-start; padding-right:42px; }
.resource-file-icon { width:66px; height:78px; border:1px solid var(--border-strong); border-radius:17px 17px 20px 20px; display:grid; place-items:center; align-content:center; gap:5px; flex:0 0 auto; color:var(--gold-light); background:linear-gradient(145deg,color-mix(in srgb,var(--gold) 15%,var(--premium-card-a,var(--surface-raised))),var(--premium-card-c,var(--bg-soft))); box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 12px 26px rgba(0,0,0,.2); }
.resource-file-icon strong { font-size:11px; letter-spacing:.08em; }
.resource-file-icon i { font-style:normal; font-family:Georgia,serif; font-size:24px; color:var(--premium-card-text,var(--cream)); }
.resource-file-icon.is-word { color:#9dd2ee; }
.resource-card-copy { min-width:0; }
.resource-category { color:var(--gold-light); font-size:9px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.resource-card h3 { margin:5px 0 7px; color:var(--premium-card-text,var(--cream)); font-family:Georgia,serif; font-size:1.38rem; line-height:1.08; }
.resource-card p { margin:0; color:var(--premium-card-muted,var(--muted)); font-size:12.5px; line-height:1.5; }
.resource-meta { display:flex; flex-wrap:wrap; gap:7px 13px; margin:16px 0 13px; padding-top:13px; border-top:1px solid var(--border); color:var(--premium-card-muted,var(--muted)); font-size:10px; }
.resource-meta span:not(:last-child)::after { content:"•"; margin-left:13px; color:var(--gold); }
.resource-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.resource-actions a,.resource-actions button { min-height:43px; display:flex; align-items:center; justify-content:center; border:1px solid var(--border); border-radius:13px; background:linear-gradient(145deg,var(--premium-control-a,var(--surface-raised)),var(--premium-control-b,var(--surface))); color:var(--premium-card-text,var(--cream)); font:inherit; font-size:11px; font-weight:850; text-decoration:none; }
.resource-actions .resource-primary { color:var(--ink); border-color:var(--gold-light); background:linear-gradient(145deg,var(--gold-light),var(--gold)); }
.resource-actions a:active,.resource-actions button:active { transform:translateY(1px); }
.resource-loading,.resource-error,.resource-empty { margin:20px 18px; padding:24px; border:1px solid var(--border); border-radius:22px; text-align:center; color:var(--premium-card-muted,var(--muted)); background:linear-gradient(145deg,var(--premium-card-a,var(--surface-raised)),var(--premium-card-c,var(--bg-soft))); }
.resource-loading span { display:inline-block; width:18px; height:18px; margin-right:8px; border:2px solid var(--border); border-top-color:var(--gold); border-radius:50%; vertical-align:middle;  }
.resource-error { color:#ffd7d0; border-color:color-mix(in srgb,#d95d4f 50%,transparent); }
.resource-empty span { display:block; color:var(--gold); font-size:34px; }
.resource-empty h3 { margin:8px 0 6px; color:var(--premium-card-text,var(--cream)); font-family:Georgia,serif; }
.resource-refresh { width:100%; margin-top:12px; min-height:42px; border:1px solid var(--border); border-radius:13px; color:var(--premium-card-text,var(--cream)); background:var(--premium-control-b,var(--surface)); font-weight:800; }
.resource-email-modal { position:fixed; inset:0; z-index:240; display:grid; place-items:end center; opacity:0; pointer-events:none;  }
.resource-email-modal.open { opacity:1; pointer-events:auto; }
.resource-email-backdrop { position:absolute; inset:0; border:0; background:rgba(2,6,3,.82); backdrop-filter:blur(7px); }
.resource-email-panel { position:relative; z-index:1; width:min(620px,100%); padding:29px 22px calc(22px + env(safe-area-inset-bottom)); border:1px solid var(--border-strong); border-radius:28px 28px 0 0; background:linear-gradient(145deg,var(--premium-modal,var(--surface-raised)),var(--premium-card-c,var(--bg-soft))); box-shadow:0 -24px 70px rgba(0,0,0,.42); transform:translateY(26px);  }
.resource-email-modal.open .resource-email-panel { transform:none; }
.resource-email-close { position:absolute; top:14px; right:16px; width:40px; height:40px; border:1px solid var(--border); border-radius:13px; color:var(--cream); background:var(--premium-control-b,var(--surface)); font-size:24px; }
.resource-email-panel h3 { margin:7px 46px 4px 0; color:var(--premium-card-text,var(--cream)); font-family:Georgia,serif; font-size:1.6rem; }
.resource-email-panel > p { color:var(--premium-card-muted,var(--muted)); font-size:12px; line-height:1.5; }
.resource-email-file { display:block; margin:10px 0 16px; color:var(--gold-light); font-size:12px; font-weight:800; }
.resource-email-panel label span { display:block; margin-bottom:7px; color:var(--premium-card-muted,var(--muted)); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }
.resource-email-panel input { width:100%; min-height:51px; padding:0 14px; border:1px solid var(--border); border-radius:14px; background:var(--premium-control-b,var(--surface)); color:var(--premium-card-text,var(--cream)); font:inherit; }
.resource-email-panel form > button { width:100%; min-height:51px; margin-top:12px; border:1px solid var(--gold-light); border-radius:14px; background:linear-gradient(145deg,var(--gold-light),var(--gold)); color:var(--ink); font-weight:900; }
.resource-email-message { margin-top:12px; padding:11px 13px; border-radius:12px; background:rgba(177,65,49,.17); color:#ffd7d0; font-size:12px; }
.resource-email-message.success { background:rgba(62,144,83,.18); color:#dff8df; }
.resource-honeypot { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; opacity:0!important; }
.resource-toast { position:fixed; left:50%; bottom:calc(90px + env(safe-area-inset-bottom)); z-index:260; width:min(90%,500px); padding:12px 16px; border:1px solid var(--border-strong); border-radius:14px; background:var(--premium-modal,var(--surface-raised)); color:var(--premium-card-text,var(--cream)); box-shadow:var(--shadow); text-align:center; font-size:12px; transform:translate(-50%,20px); opacity:0; pointer-events:none;  }
.resource-toast.visible { transform:translate(-50%,0); opacity:1; }


@media (min-width:540px) { .resource-actions { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:380px) { .resource-hero { grid-template-columns:1fr; } .resource-hero-count { display:flex; gap:8px; align-items:baseline; justify-content:center; } .resource-card-top { padding-right:0; } }
.admin-stats-six { grid-template-columns: repeat(6, minmax(0,1fr)); }
@media (max-width: 520px) { .admin-stats-six { grid-template-columns: repeat(3, minmax(0,1fr)); } }

/* ===== END resources.css ===== */

/* ===== BEGIN recipes.css ===== */
/* CCSA Natal Midlands Recipes */
.recipes-screen { padding-bottom:122px; }
.recipe-hero { margin:18px; padding:22px; display:grid; grid-template-columns:1fr auto; gap:18px; align-items:center; border:1px solid var(--border-strong); border-radius:28px; background:radial-gradient(circle at 95% 10%,color-mix(in srgb,var(--gold) 17%,transparent),transparent 38%),linear-gradient(145deg,var(--premium-card-a,var(--surface-raised)),var(--premium-card-c,var(--bg-soft))); box-shadow:var(--card-shadow); }
.recipe-overline { color:var(--gold-light); font-size:9px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.recipe-hero h3 { margin:5px 0 7px; color:var(--premium-card-text,var(--cream)); font-family:Georgia,serif; font-size:clamp(1.7rem,6vw,2.25rem); line-height:1; }
.recipe-hero p { margin:0; color:var(--premium-card-muted,var(--muted)); font-size:13px; line-height:1.55; }
.recipe-count-badge { min-width:90px; padding:14px 12px; border:1px solid var(--border); border-radius:20px; text-align:center; background:var(--premium-control-b,var(--surface)); }
.recipe-count-badge strong { display:block; color:var(--gold-light); font-family:Georgia,serif; font-size:2rem; }
.recipe-count-badge span { color:var(--premium-card-muted,var(--muted)); font-size:9px; text-transform:uppercase; letter-spacing:.11em; }
.recipe-controls { margin:0 18px 18px; }
.recipe-search { min-height:58px; padding:0 16px; display:flex; align-items:center; gap:10px; border:1px solid var(--border); border-radius:18px; background:linear-gradient(145deg,var(--premium-control-a,var(--surface-raised)),var(--premium-control-b,var(--surface))); }
.recipe-search svg { width:21px; color:var(--gold); }
.recipe-search input { width:100%; border:0; outline:0; background:transparent; color:var(--premium-card-text,var(--cream)); font:inherit; font-size:15px; }
.recipe-course-filters { display:flex; gap:9px; overflow-x:auto; padding:12px 0 4px; scrollbar-width:none; }
.recipe-course-filters::-webkit-scrollbar { display:none; }
.recipe-course-filters button { flex:0 0 auto; padding:11px 15px; border:1px solid var(--border); border-radius:999px; background:linear-gradient(145deg,var(--premium-control-a,var(--surface-raised)),var(--premium-control-b,var(--surface))); color:var(--premium-card-muted,var(--muted)); font-weight:850; }
.recipe-course-filters button.active { color:var(--ink); border-color:var(--gold-light); background:linear-gradient(145deg,var(--gold-light),var(--gold)); }
.recipe-control-row { display:flex; gap:9px; margin-top:12px; }
.recipe-control-row button { min-height:44px; flex:1; border:1px solid var(--border); border-radius:14px; background:var(--premium-control-b,var(--surface)); color:var(--premium-card-text,var(--cream)); font-weight:850; }
.recipe-control-row .recipe-submit-open { color:var(--ink); border-color:var(--gold-light); background:linear-gradient(145deg,var(--gold-light),var(--gold)); }
.recipe-control-row { flex-wrap:wrap; }
#recipeCookbookDownload { flex:1 0 100%; min-height:50px; }
.recipe-list { margin:0 18px; display:grid; gap:16px; }
.recipe-card { position:relative; overflow:hidden; border:1px solid var(--border); border-radius:25px; background:linear-gradient(145deg,var(--premium-card-a,var(--surface-raised)),var(--premium-card-c,var(--bg-soft))); box-shadow:var(--card-shadow);   }
.recipe-card.is-featured { border-color:var(--border-strong); }
.recipe-cover { position:relative; width:100%; aspect-ratio:16/10; padding:0; border:0; background:#111; overflow:hidden; display:block; }
.recipe-cover img { width:100%; height:100%; object-fit:cover; object-position:center 20%; display:block; }
.recipe-cover::after { content:""; position:absolute; inset:auto 0 0; height:44%; background:linear-gradient(transparent,rgba(3,8,5,.78)); pointer-events:none; }
.recipe-featured { position:absolute; top:12px; left:12px; z-index:2; padding:7px 11px; border-radius:999px; color:var(--ink); background:linear-gradient(145deg,var(--gold-light),var(--gold)); font-size:9px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.recipe-favourite { position:absolute; top:12px; right:12px; z-index:3; width:42px; height:42px; border:1px solid rgba(255,255,255,.23); border-radius:50%; color:#fff; background:rgba(4,13,8,.68); backdrop-filter:blur(8px); font-size:24px; }
.recipe-favourite.active { color:#ffe08a; }
.recipe-card-copy { padding:18px; }
.recipe-card-meta { display:flex; gap:7px; margin-bottom:7px; }
.recipe-card-meta span { padding:5px 8px; border:1px solid var(--border); border-radius:999px; color:var(--gold-light); font-size:8px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.recipe-card h3 { margin:0 0 7px; color:var(--premium-card-text,var(--cream)); font-family:Georgia,serif; font-size:1.55rem; line-height:1.05; }
.recipe-card p { margin:0; color:var(--premium-card-muted,var(--muted)); font-size:12.5px; line-height:1.5; }
.recipe-contributor { margin-top:12px; color:var(--premium-card-muted,var(--muted)); font-size:10px; }
.recipe-contributor strong { color:var(--gold-light); }
.recipe-open-btn { width:100%; min-height:46px; margin-top:15px; display:flex; align-items:center; justify-content:space-between; padding:0 15px; border:1px solid var(--border-strong); border-radius:14px; background:linear-gradient(145deg,var(--premium-control-a,var(--surface-raised)),var(--premium-control-b,var(--surface))); color:var(--premium-card-text,var(--cream)); font-weight:900; }
.recipe-open-btn span { color:var(--gold-light); font-size:22px; }
.recipe-empty { padding:30px 20px; border:1px solid var(--border); border-radius:24px; text-align:center; color:var(--premium-card-muted,var(--muted)); background:var(--premium-card-a,var(--surface-raised)); }
.recipe-empty span { font-size:34px; color:var(--gold); }
.recipe-empty h3 { color:var(--premium-card-text,var(--cream)); font-family:Georgia,serif; }
.recipe-detail-modal,.recipe-submit-modal,.recipe-page-modal { position:fixed; inset:0; z-index:270; display:grid; place-items:end center; opacity:0; pointer-events:none;  }
.recipe-detail-modal.open,.recipe-submit-modal.open,.recipe-page-modal.open { opacity:1; pointer-events:auto; }
.recipe-modal-backdrop,.recipe-page-backdrop { position:absolute; inset:0; border:0; background:rgba(1,5,2,.86); backdrop-filter:blur(8px); }
.recipe-detail-panel,.recipe-submit-panel { position:relative; z-index:1; width:min(720px,100%); max-height:94dvh; overflow:auto; border:1px solid var(--border-strong); border-radius:28px 28px 0 0; background:linear-gradient(145deg,var(--premium-modal,var(--surface-raised)),var(--premium-card-c,var(--bg-soft))); box-shadow:0 -28px 80px rgba(0,0,0,.48); transform:translateY(30px);  }
.recipe-detail-modal.open .recipe-detail-panel,.recipe-submit-modal.open .recipe-submit-panel { transform:none; }
.recipe-modal-close { position:sticky; top:12px; float:right; z-index:5; width:42px; height:42px; margin:12px 12px -54px 0; border:1px solid var(--border); border-radius:14px; color:#fff; background:rgba(4,12,7,.78); font-size:24px; }
.recipe-detail-cover { width:100%; max-height:52vh; object-fit:cover; object-position:center top; display:block; }
.recipe-detail-copy { padding:22px; }
.recipe-detail-meta { display:flex; gap:7px; margin-bottom:10px; }
.recipe-detail-meta span { padding:5px 8px; border:1px solid var(--border); border-radius:999px; color:var(--gold-light); font-size:8px; font-weight:900; text-transform:uppercase; letter-spacing:.1em; }
.recipe-detail-copy h3 { margin:0 0 5px; color:var(--premium-card-text,var(--cream)); font-family:Georgia,serif; font-size:clamp(2rem,8vw,3rem); line-height:.98; }
.recipe-detail-contributor { color:var(--gold-light); font-size:11px; font-weight:800; }
.recipe-detail-summary { color:var(--premium-card-muted,var(--muted)); font-size:14px; line-height:1.6; }
.recipe-facts { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0; }
.recipe-facts span { padding:9px 11px; border:1px solid var(--border); border-radius:12px; color:var(--premium-card-muted,var(--muted)); background:var(--premium-control-b,var(--surface)); font-size:10px; }
.recipe-facts strong { color:var(--premium-card-text,var(--cream)); }
.recipe-detail-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:17px 0 22px; }
.recipe-detail-actions button { min-height:45px; border:1px solid var(--border); border-radius:13px; background:var(--premium-control-b,var(--surface)); color:var(--premium-card-text,var(--cream)); font-weight:850; }
.recipe-detail-actions .primary { color:var(--ink); border-color:var(--gold-light); background:linear-gradient(145deg,var(--gold-light),var(--gold)); }
.recipe-detail-section { margin:0 0 15px; padding:18px; border:1px solid var(--border); border-radius:19px; background:color-mix(in srgb,var(--premium-card-a,var(--surface-raised)) 88%,transparent); }
.recipe-detail-section h4 { margin:0 0 12px; color:var(--gold-light); font-family:Georgia,serif; font-size:1.35rem; }
.recipe-detail-section ul,.recipe-detail-section ol { margin:0; padding-left:20px; color:var(--premium-card-text,var(--cream)); }
.recipe-detail-section li { margin:0 0 9px; padding-left:4px; font-size:13px; line-height:1.5; }
.recipe-detail-section p { margin:0; color:var(--premium-card-text,var(--cream)); font-size:13px; line-height:1.6; }
.recipe-context-section { border-color:color-mix(in srgb,var(--green) 45%,var(--border)); }
.recipe-note-section { border-color:color-mix(in srgb,var(--gold) 55%,var(--border)); }
.recipe-zine-pages h4 { margin:22px 0 5px; color:var(--premium-card-text,var(--cream)); font-family:Georgia,serif; font-size:1.5rem; }
.recipe-zine-pages > p { margin:0 0 12px; color:var(--premium-card-muted,var(--muted)); font-size:11px; }
.recipe-page-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.recipe-page-grid button { position:relative; padding:0; border:1px solid var(--border); border-radius:13px; overflow:hidden; background:var(--surface); }
.recipe-page-grid img { width:100%; aspect-ratio:1055/1491; object-fit:cover; display:block; }
.recipe-page-grid span { position:absolute; left:6px; right:6px; bottom:6px; padding:5px; border-radius:8px; color:#fff; background:rgba(0,0,0,.62); font-size:9px; font-weight:800; }
.recipe-page-panel { position:relative; z-index:1; width:min(900px,100%); height:100%; display:grid; grid-template-rows:auto 1fr auto; background:#050805; }
.recipe-page-toolbar { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; color:#fff; background:rgba(9,19,12,.96); }
.recipe-page-toolbar button { width:40px; height:40px; border:1px solid rgba(255,255,255,.2); border-radius:12px; color:#fff; background:rgba(255,255,255,.08); font-size:21px; }
.recipe-page-scroll { overflow:auto; display:grid; place-items:start center; padding:10px; }
.recipe-page-scroll img { max-width:100%; height:auto; display:block; }
.recipe-page-nav { display:grid; grid-template-columns:1fr auto 1fr; gap:10px; padding:12px; background:rgba(9,19,12,.96); }
.recipe-page-nav button { min-height:43px; border:1px solid rgba(255,255,255,.18); border-radius:12px; color:#fff; background:rgba(255,255,255,.08); }
.recipe-page-nav button:last-child { grid-column:3; }
.recipe-submit-panel { padding:24px 20px calc(22px + env(safe-area-inset-bottom)); }
.recipe-submit-panel h3 { margin:5px 48px 7px 0; color:var(--premium-card-text,var(--cream)); font-family:Georgia,serif; font-size:2rem; }
.recipe-submit-panel > p { color:var(--premium-card-muted,var(--muted)); font-size:12px; line-height:1.55; }
.recipe-submit-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:17px; }
.recipe-submit-form label { min-width:0; }
.recipe-submit-form label.full { grid-column:1/-1; }
.recipe-submit-form label > span { display:block; margin-bottom:6px; color:var(--premium-card-muted,var(--muted)); font-size:9px; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }
.recipe-submit-form input,.recipe-submit-form select,.recipe-submit-form textarea { width:100%; padding:12px 13px; border:1px solid var(--border); border-radius:13px; background:var(--premium-control-b,var(--surface)); color:var(--premium-card-text,var(--cream)); font:inherit; font-size:13px; }
.recipe-submit-form textarea { resize:vertical; min-height:110px; }
.recipe-submit-form button { grid-column:1/-1; min-height:50px; border:1px solid var(--gold-light); border-radius:14px; background:linear-gradient(145deg,var(--gold-light),var(--gold)); color:var(--ink); font-weight:900; }
.recipe-submit-message { grid-column:1/-1; padding:12px; border-radius:12px; color:#ffd7d0; background:rgba(177,65,49,.18); font-size:12px; }
.recipe-submit-message.success { color:#dff8df; background:rgba(62,144,83,.18); }
.recipe-toast { position:fixed; left:50%; bottom:calc(90px + env(safe-area-inset-bottom)); z-index:300; width:min(90%,500px); padding:12px 16px; border:1px solid var(--border-strong); border-radius:14px; background:var(--premium-modal,var(--surface-raised)); color:var(--premium-card-text,var(--cream)); box-shadow:var(--shadow); text-align:center; transform:translate(-50%,20px); opacity:0; pointer-events:none;  }
.recipe-toast.visible { transform:translate(-50%,0); opacity:1; }

@media (min-width:680px) { .recipe-list { grid-template-columns:repeat(2,minmax(0,1fr)); } .recipe-detail-actions { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:480px) { .recipe-hero { grid-template-columns:1fr; } .recipe-count-badge { display:flex; gap:8px; align-items:baseline; justify-content:center; } .recipe-submit-form { grid-template-columns:1fr; } .recipe-submit-form label.full,.recipe-submit-form button,.recipe-submit-message { grid-column:1; } }
@media print {
  body.printing-recipe .app > * { display:none !important; }
  body.printing-recipe .recipe-detail-modal { position:static !important; display:block !important; opacity:1 !important; pointer-events:auto !important; }
  body.printing-recipe .recipe-modal-backdrop,.printing-recipe .recipe-modal-close,.printing-recipe .recipe-detail-actions,.printing-recipe .recipe-zine-pages { display:none !important; }
  body.printing-recipe .recipe-detail-panel { width:100% !important; max-height:none !important; overflow:visible !important; border:0 !important; box-shadow:none !important; background:#fff !important; color:#111 !important; transform:none !important; }
  body.printing-recipe .recipe-detail-copy h3,body.printing-recipe .recipe-detail-section h4,body.printing-recipe .recipe-detail-section li,body.printing-recipe .recipe-detail-section p { color:#111 !important; }
  body.printing-recipe .recipe-detail-section { break-inside:avoid; border:1px solid #aaa; background:#fff !important; }
}
.admin-stats-seven { grid-template-columns:repeat(7,minmax(0,1fr)); }
@media (max-width:700px){ .admin-stats-seven { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:430px){ .admin-stats-seven { grid-template-columns:repeat(3,minmax(0,1fr)); } }

.recipe-detail-cover{cursor:zoom-in;}.recipe-page-modal{place-items:stretch center!important;}.recipe-page-panel{height:100dvh;max-height:100dvh;}.recipe-page-scroll{min-height:0;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;align-content:start;}.recipe-page-scroll img{width:min(100%,1055px);max-width:none;}.recipe-page-modal.open{overflow:hidden;}

/* ===== END recipes.css ===== */

/* ===== BEGIN parks.css ===== */
/* Park database and rally drill-down */
.rally-detail-panel {
  max-height: min(92vh, 980px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

#parkDetailContent {
  display: grid;
  gap: 16px;
  padding-top: 8px;
}

.park-profile-loading,
.park-unlinked {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
  border-radius: 20px;
  background: color-mix(in srgb, var(--surface-2) 92%, transparent);
}

.park-profile-loading span {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--accent) 25%, transparent);
  border-top-color: var(--accent);
  
}



.park-unlinked img {
  width: 90px;
  height: 90px;
  object-fit: contain;
  flex: 0 0 auto;
}

.park-unlinked span {
  color: var(--accent);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.park-unlinked p { margin: 5px 0 0; line-height: 1.55; color: var(--muted); }

.park-profile-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 112px 1fr;
  gap: 16px;
  align-items: center;
  padding: 18px;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent);
  background:
    radial-gradient(circle at 82% 10%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 36%),
    linear-gradient(145deg, color-mix(in srgb, var(--surface-2) 94%, transparent), color-mix(in srgb, var(--surface) 98%, transparent));
  box-shadow: 0 18px 38px rgba(0,0,0,.2);
}

.park-profile-hero img {
  width: 112px;
  height: 112px;
  object-fit: contain;
  filter: drop-shadow(0 14px 16px rgba(0,0,0,.25));
}

.park-profile-hero span {
  color: var(--accent);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.park-profile-hero h3 {
  margin: 4px 0 7px;
  font-family: var(--font-display, Georgia, serif);
  font-size: clamp(1.45rem, 4vw, 2rem);
  color: var(--text);
}

.park-profile-hero p { margin: 0; color: var(--muted); line-height: 1.55; }

.park-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.park-action {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 48px;
  padding: 10px 8px;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, transparent);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface-2) 94%, transparent);
  color: var(--text);
  font-weight: 800;
  text-decoration: none;
  font-size: .83rem;
}

.park-action:first-child,
.park-action:last-child {
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 72%, var(--accent-2)));
  color: var(--accent-contrast, #17110d);
}

.park-action span { font-size: 1rem; }

.park-profile-section {
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--line) 82%, transparent);
  border-radius: 20px;
  background: color-mix(in srgb, var(--surface-2) 94%, transparent);
}

.park-profile-section h4 {
  margin: 0 0 14px;
  font-family: var(--font-display, Georgia, serif);
  font-size: 1.12rem;
  color: var(--text);
}

.park-section-heading {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
}

.park-section-heading a { color: var(--accent); font-weight: 800; font-size: .8rem; }

.park-fact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.park-fact-grid > div {
  min-height: 68px;
  padding: 12px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  border: 1px solid color-mix(in srgb, var(--line) 66%, transparent);
}

.park-fact-grid small {
  display: block;
  margin-bottom: 5px;
  color: var(--accent);
  font-size: .63rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.park-fact-grid strong { display: block; color: var(--text); line-height: 1.35; font-size: .88rem; }

.park-chip-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.park-chip-list li {
  padding: 10px 12px;
  border-radius: 13px;
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  color: var(--text);
  font-size: .84rem;
  line-height: 1.35;
}

.park-chip-list li::before { content: "✓"; color: var(--accent); font-weight: 900; margin-right: 7px; }
.park-chip-list small { display: block; margin: 4px 0 0 20px; color: var(--muted); }

.park-area-list,
.park-rate-list,
.park-document-list { display: grid; gap: 9px; }

.park-area-list article,
.park-rate-list article,
.park-document-list a {
  padding: 13px;
  border-radius: 15px;
  border: 1px solid color-mix(in srgb, var(--line) 72%, transparent);
  background: color-mix(in srgb, var(--surface) 82%, transparent);
}

.park-area-list strong,
.park-rate-list strong,
.park-document-list strong { color: var(--text); }
.park-area-list p,
.park-rate-list p { margin: 5px 0 0; color: var(--muted); font-size: .82rem; line-height: 1.45; }
.park-rate-list article { display: grid; grid-template-columns: 1fr auto; gap: 5px 12px; }
.park-rate-list span { color: var(--accent); font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.park-rate-list p { grid-column: 1 / -1; }
.park-rate-list .is-stale { opacity: .68; }
.park-rate-note { margin: 12px 0 0; color: var(--muted); font-size: .78rem; }

.park-policy-list { display: grid; gap: 8px; }
.park-policy-list details {
  border-radius: 13px;
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  border: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
}
.park-policy-list summary { cursor: pointer; padding: 12px 14px; color: var(--text); font-weight: 800; }
.park-policy-list p { margin: 0; padding: 0 14px 14px; color: var(--muted); line-height: 1.55; }

.park-document-list a {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 12px;
  color: var(--text);
  text-decoration: none;
}
.park-document-list span { color: var(--accent); font-size: .65rem; font-weight: 900; text-transform: uppercase; }
.park-document-list strong { grid-column: 1; }
.park-document-list b { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: var(--accent); }

.park-profile-footer {
  padding: 2px 4px 8px;
  color: var(--muted);
  font-size: .72rem;
  text-align: center;
}

.rally-card-logo {
  width: 52px;
  height: 52px;
  object-fit: contain;
  filter: drop-shadow(0 6px 8px rgba(0,0,0,.22));
}

.rally-card.has-park-logo .rally-date-block {
  padding-top: 8px;
}

/* Admin park and rally cards */
.admin-stats.admin-stats-nine { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.admin-park-preview {
  width: 74px;
  height: 74px;
  object-fit: contain;
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  padding: 6px;
  flex: 0 0 auto;
}
.admin-record-card.admin-park-record { align-items: center; }
.admin-park-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.admin-park-meta span { padding: 4px 8px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 13%, transparent); color: var(--accent); font-size: .68rem; font-weight: 800; }
.admin-upload-note code { font-size: .76rem; }

@media (max-width: 560px) {
  .park-profile-hero { grid-template-columns: 88px 1fr; padding: 15px; }
  .park-profile-hero img { width: 88px; height: 88px; }
  .park-action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .park-fact-grid, .park-chip-list { grid-template-columns: 1fr; }
  .admin-stats.admin-stats-nine { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.rally-extra-summary {
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.6;
}

.rally-fees-note,
.rally-contact-note {
  display: grid;
  gap: 4px;
  margin: 10px 0;
  padding: 12px 14px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--accent) 32%, transparent);
}

.rally-fees-note small,
.rally-contact-note small {
  color: var(--accent);
  font-size: .64rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.rally-fees-note strong,
.rally-contact-note strong { color: var(--text); line-height: 1.45; }
.rally-contact-note span { color: var(--muted); font-size: .82rem; }
.rally-action-grid { margin-top: 12px; }

.rally-card.has-park-logo {
  grid-template-columns: 74px minmax(0, 1fr) 28px;
}

.rally-card.has-park-logo .rally-date-block {
  width: 72px;
  min-height: 104px;
  padding: 7px 4px 8px;
  justify-content: flex-start;
}

.rally-card.has-park-logo .rally-date-block strong {
  margin-top: 5px;
  font-size: 14px;
}

.rally-card.has-park-logo .rally-date-block span {
  margin-top: 3px;
}

@media (max-width: 370px) {
  .rally-card.has-park-logo { grid-template-columns: 64px minmax(0, 1fr) 24px; }
  .rally-card.has-park-logo .rally-date-block { width: 62px; }
  .rally-card-logo { width: 46px; height: 46px; }
}

/* Version 27: compact park accordions and club-managed bookings */
.park-accordion {
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--gold) 22%, var(--border));
  border-radius: 17px;
  background: color-mix(in srgb, var(--surface-raised) 90%, transparent);
  box-shadow: 0 10px 26px rgba(0,0,0,.12);
}
.park-accordion + .park-accordion { margin-top: 10px; }
.park-accordion > summary {
  min-height: 52px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  list-style: none;
  color: var(--cream);
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 800;
}
.park-accordion > summary::-webkit-details-marker { display: none; }
.park-accordion > summary b {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--gold) 28%, transparent);
  color: var(--gold-light);
  font: 800 18px/1 sans-serif;
  
}
.park-accordion[open] > summary b { transform: rotate(45deg); }
.park-accordion-body {
  padding: 0 14px 14px;
  border-top: 1px solid color-mix(in srgb, var(--gold) 13%, transparent);
}
.park-accordion-body > :first-child { margin-top: 13px; }
.park-accordion .park-fact-grid,
.park-accordion .park-chip-list,
.park-accordion .park-area-list,
.park-accordion .park-policy-list,
.park-accordion .park-document-list { margin-top: 0; }
.park-action-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 620px) {
  .park-action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .park-action-grid .park-action:last-child:nth-child(odd) { grid-column: 1 / -1; }
}

.park-action,.park-action:link,.park-action:visited{color:#fff!important;}.park-action span{color:var(--gold-light,#f2c84b)!important;}.park-action-grid a{color:#fff!important;}.park-intention-only{margin:0 0 18px;width:100%;min-height:54px;}.rally-extra-section,.park-club-booking-note{display:none!important;}

/* ===== END parks.css ===== */

/* ===== BEGIN premium-ui.css ===== */
/* =====================================================================
   CCSA NATAL MIDLANDS — PREMIUM APP-WIDE VISUAL SYSTEM (V13)
   This stylesheet intentionally loads last. It refines the complete PWA
   without changing any of the existing functionality or data flows.
   ===================================================================== */

:root,
[data-theme="bark"] {
  --bg: #0a140e;
  --bg-soft: #0f2016;
  --surface: #10261a;
  --surface-raised: #173421;
  --surface-soft: #1e4129;
  --cream: #fff8e9;
  --ink: #11150f;
  --muted: #c3baa6;
  --border: rgba(225, 181, 72, .20);
  --border-strong: rgba(225, 181, 72, .48);
  --gold: #d9aa3d;
  --gold-light: #f4d77b;
  --rust: #a95a31;
  --rust-light: #d6864d;
  --green: #5e9a5f;
  --blue: #5a8da2;
  --plum: #927294;
  --amber: #d19641;
  --crest-bg: #f8efdb;
  --hero-text: #fff9ed;
  --hero-muted: rgba(255, 249, 237, .78);
  --shadow: 0 28px 72px rgba(0,0,0,.48);
  --card-shadow: 0 16px 36px rgba(0,0,0,.31);
}

[data-theme="ccsa-green"] {
  --bg: #07150d;
  --bg-soft: #0c2114;
  --surface: #10291a;
  --surface-raised: #173a24;
  --surface-soft: #224a2f;
  --cream: #fffbea;
  --muted: #c5c9b8;
  --border: rgba(242, 199, 50, .20);
  --border-strong: rgba(242, 199, 50, .48);
  --gold: #efc532;
  --gold-light: #ffe583;
  --shadow: 0 28px 72px rgba(0,0,0,.5);
  --card-shadow: 0 16px 36px rgba(0,0,0,.32);
}


html {
  background: #07110b;
}

body {
  background:
    radial-gradient(circle at 50% -12%, rgba(219,170,62,.18), transparent 30rem),
    radial-gradient(circle at 6% 38%, rgba(38,105,61,.16), transparent 28rem),
    linear-gradient(180deg, #0d0a08 0, #08140d 48%, #07110b 100%);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .28;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.12) .55px, transparent .7px),
    linear-gradient(115deg, transparent 0 48%, rgba(255,255,255,.022) 49% 50%, transparent 51% 100%);
  background-size: 19px 19px, 100% 100%;
}

.app {
  max-width: 620px;
  background:
    radial-gradient(circle at 50% -10%, color-mix(in srgb, var(--gold) 9%, transparent), transparent 27rem),
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 94%, #17100b 6%), var(--bg));
  border-color: color-mix(in srgb, var(--gold) 28%, transparent);
  box-shadow: 0 34px 100px rgba(0,0,0,.62), inset 0 0 0 1px rgba(255,255,255,.02);
}

@media (min-width: 660px) {
  body { padding: 18px 0; }
  .app { border-radius: 34px; min-height: calc(100dvh - 36px); }
}

/* ---------------------------------------------------------------------
   HOME HERO
   --------------------------------------------------------------------- */
.hero {
  padding: 34px 24px 34px;
  background:
    linear-gradient(180deg, rgba(12,8,6,.28), rgba(10,16,11,.78)),
    radial-gradient(circle at 15% 0%, rgba(222,173,62,.18), transparent 20rem),
    radial-gradient(circle at 92% 30%, rgba(50,111,63,.16), transparent 18rem),
    repeating-linear-gradient(100deg, rgba(255,255,255,.016) 0 1px, transparent 1px 5px),
    #120d09;
  border-bottom: 1px solid color-mix(in srgb, var(--gold) 44%, transparent);
}

.hero::before {
  opacity: .32;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.18) .55px, transparent .7px),
    linear-gradient(125deg, transparent 0 45%, rgba(231,188,93,.055) 46% 48%, transparent 49% 100%);
  background-size: 18px 18px, 100% 100%;
}

.hero .eyebrow {
  width: max-content;
  max-width: calc(100% - 100px);
  margin: 0 auto 18px;
  padding: 8px 15px;
  color: var(--gold-light);
  border: 1px solid color-mix(in srgb, var(--gold) 50%, transparent);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(99,68,14,.52), rgba(59,40,8,.48));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 9px 24px rgba(0,0,0,.25);
  font-size: 9px;
  letter-spacing: .18em;
}

.crest-wrap { margin-top: 2px; }
.crest {
  width: 116px;
  height: 116px;
  border: 5px solid rgba(245,215,139,.88);
  box-shadow:
    0 0 0 4px rgba(75,48,13,.88),
    0 0 0 6px rgba(224,177,65,.5),
    0 20px 42px rgba(0,0,0,.48),
    inset 0 0 0 1px rgba(255,255,255,.35);
}
.crest-ring {
  width: 143px;
  height: 143px;
  border: 1px solid rgba(232,190,91,.24);
  box-shadow: 0 0 42px rgba(221,169,50,.12);
}

.hero h1 {
  margin-top: 20px;
  font-size: clamp(2rem, 8vw, 2.8rem);
  letter-spacing: -.035em;
  text-shadow: 0 3px 16px rgba(0,0,0,.48);
}
.hero h1::after {
  content: "";
  display: block;
  width: 128px;
  height: 1px;
  margin: 17px auto 0;
  background: linear-gradient(90deg, transparent, var(--gold-light), transparent);
  box-shadow: 0 0 10px rgba(232,190,91,.4);
}
.hero .tagline { margin-top: 13px; font-size: 10px; letter-spacing: .06em; }
.clock {
  width: min(100%, 400px);
  margin-top: 20px;
  border-color: color-mix(in srgb, var(--gold) 28%, transparent);
  background: linear-gradient(145deg, rgba(22,49,31,.72), rgba(12,25,17,.76));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 12px 28px rgba(0,0,0,.23);
}
.theme-toggle {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  border-color: rgba(236,197,105,.32);
  background: rgba(17,35,23,.72);
  box-shadow: 0 10px 24px rgba(0,0,0,.28);
}


.celebration-banner {
  margin: 18px 18px 0;
  border: 1px solid color-mix(in srgb, var(--gold) 54%, transparent);
  border-radius: 24px;
  background:
    radial-gradient(circle at 100% 0%, rgba(243,205,112,.16), transparent 45%),
    linear-gradient(145deg, #173622, #0e2417);
  box-shadow: 0 18px 38px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.05);
}

/* ---------------------------------------------------------------------
   HOME SECTIONS AND TILES
   --------------------------------------------------------------------- */
main {
  padding: 8px 18px 128px;
  background:
    radial-gradient(circle at 100% 10%, rgba(61,118,74,.12), transparent 24rem),
    linear-gradient(180deg, #0a1c12, #07150e 68%, #09140d);
}
.menu-section { margin-top: 34px; }
.menu-section:first-child { margin-top: 18px; }
.section-heading { margin: 0 4px 17px; align-items: center; }
.section-kicker {
  color: var(--gold-light);
  font-size: 9px;
  letter-spacing: .2em;
  text-shadow: 0 0 14px rgba(219,170,61,.18);
}
.section-heading h2 {
  margin-top: 3px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.025em;
}
.section-rule { background: linear-gradient(90deg, color-mix(in srgb, var(--gold) 60%, transparent), transparent); }
.grid { gap: 14px; }

.tile.visual-tile {
  min-height: 182px;
  padding: 13px 13px 18px;
  border: 1px solid color-mix(in srgb, var(--gold) 30%, transparent);
  border-radius: 24px;
  background:
    radial-gradient(circle at 50% 7%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 45%),
    radial-gradient(circle at 100% 100%, rgba(255,255,255,.03), transparent 40%),
    linear-gradient(150deg, #1c4028, #102a1b 62%, #0f2418);
  box-shadow:
    0 18px 34px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.07),
    inset 0 0 0 1px rgba(0,0,0,.16);
}
.tile.visual-tile::before {
  inset: 1px;
  border-radius: 23px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.075), transparent 24%, transparent 72%, rgba(223,177,65,.05));
}
.tile.visual-tile::after {
  inset: auto 28px 0 28px;
  height: 2px;
  opacity: .7;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--gold) 75%, transparent), transparent);
}
.visual-icon-wrap {
  width: 112px;
  height: 112px;
  margin: -4px auto -4px;
}
.visual-icon-wrap img {
  filter: drop-shadow(0 14px 16px rgba(0,0,0,.34));
}
.tile.visual-tile .label {
  color: #fff9ea;
  font: 700 17px/1.16 var(--font-display);
  letter-spacing: -.02em;
  text-shadow: 0 2px 9px rgba(0,0,0,.42);
}
.tile.visual-tile .sub { color: rgba(255,249,233,.72); font-size: 10px; }
.tile.visual-tile .mini-arrow,
.tile-action {
  border-color: color-mix(in srgb, var(--gold) 34%, transparent);
  color: var(--gold-light);
  background: rgba(16,44,27,.82);
  box-shadow: 0 8px 18px rgba(0,0,0,.22);
}

.tile.featured.visual-tile {
  min-height: 166px;
  padding: 13px 19px 13px 8px;
  gap: 4px;
  border-color: rgba(255,224,145,.48);
  background:
    radial-gradient(circle at 89% 3%, rgba(255,255,255,.25), transparent 37%),
    radial-gradient(circle at 15% 50%, rgba(251,224,158,.18), transparent 40%),
    linear-gradient(135deg, #b98228 0%, #d7a63d 48%, #8f621f 100%);
  box-shadow: 0 22px 46px rgba(112,75,18,.42), inset 0 1px 0 rgba(255,255,255,.25);
}
.tile.featured.visual-tile .visual-icon-wrap { width: 132px; height: 132px; }
.tile.featured.visual-tile .tile-overline { color: rgba(44,26,5,.72); }
.tile.featured.visual-tile .label { color: #fff9eb; font-size: 23px; text-shadow: 0 2px 8px rgba(64,38,5,.45); }
.tile.featured.visual-tile .sub { color: rgba(255,250,232,.88); font-size: 11px; }

.tile-wide.visual-tile {
  min-height: 126px;
  border-color: color-mix(in srgb, var(--gold) 30%, transparent);
}
.tile-wide.visual-tile .visual-icon-wrap { width: 102px; height: 102px; }
.tile-wide.visual-tile .label { font-size: 18px; }
.locked-pill {
  color: #fff5cf;
  border-color: rgba(238,194,85,.45);
  background: rgba(113,77,15,.42);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

@media (hover:hover) {
  .tile.visual-tile:hover {
    transform: translateY(-5px);
    border-color: color-mix(in srgb, var(--gold) 65%, transparent);
    box-shadow: 0 25px 52px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.09);
  }
}

/* ---------------------------------------------------------------------
   COMMON INNER-SCREEN HEADER — matches the premium notice-board concept
   --------------------------------------------------------------------- */
.screen {
  min-height: 100dvh;
  padding-bottom: 122px;
  background:
    radial-gradient(circle at 96% 3%, rgba(225,177,65,.11), transparent 24rem),
    radial-gradient(circle at 0 45%, rgba(42,105,62,.11), transparent 23rem),
    linear-gradient(180deg, #0c0a08 0 148px, #091a11 148px, var(--bg) 100%);
}
.screen-header {
  position: relative;
  isolation: isolate;
  min-height: 150px;
  margin: 0 !important;
  padding: 30px 124px 28px 26px;
  display: flex;
  align-items: center;
  gap: 17px;
  overflow: hidden;
  border-bottom: 1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  background:
    linear-gradient(180deg, rgba(10,7,5,.12), rgba(12,13,9,.55)),
    repeating-linear-gradient(100deg, rgba(255,255,255,.014) 0 1px, transparent 1px 5px),
    #130e0a;
  box-shadow: 0 18px 36px rgba(0,0,0,.26);
}
.screen-header::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 92px;
  right: 130px;
  bottom: 24px;
  height: 1px;
  background: linear-gradient(90deg, var(--gold-light), transparent);
  opacity: .58;
}
.screen-header::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 22px;
  right: 22px;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: var(--crest-bg) url("icons/emblem-crop.png") center/78% auto no-repeat;
  border: 4px solid var(--gold-light);
  box-shadow:
    0 0 0 4px rgba(86,57,12,.88),
    0 0 0 5px rgba(229,181,62,.45),
    0 15px 32px rgba(0,0,0,.42);
}
.screen-header > div { min-width: 0; }
.screen-header h2 {
  margin-top: 5px;
  color: #fff9ec;
  font-size: clamp(1.9rem, 7.5vw, 2.55rem);
  line-height: 1.02;
  letter-spacing: -.04em;
  text-shadow: 0 3px 14px rgba(0,0,0,.46);
}
.screen-kicker {
  color: var(--gold-light);
  font-size: 9px;
  letter-spacing: .18em;
}
.back-btn {
  width: 52px;
  height: 52px;
  flex: 0 0 auto;
  border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  border-radius: 18px;
  color: var(--gold-light);
  background: linear-gradient(145deg, #173521, #0d2116);
  box-shadow: 0 12px 26px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.06);
}
.back-btn svg { width: 24px; height: 24px; }

/* ---------------------------------------------------------------------
   SHARED PREMIUM SURFACES, BUTTONS AND FIELDS
   --------------------------------------------------------------------- */
.rally-spotlight,
.calendar-hero,
.newsletter-hero,
.committee-hero,
.milestone-lookup-card,
.admin-login-card,
.admin-dashboard,
.coming-soon,
.notice-hero {
  border: 1px solid color-mix(in srgb, var(--gold) 36%, transparent) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(224,177,66,.11), transparent 45%),
    linear-gradient(145deg, #173921, #0e2818 66%, #0c2115) !important;
  box-shadow: 0 22px 46px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.rally-toolbar,
.notice-filter-row,
.newsletter-control-row,
.admin-tabs,
.calendar-view-toggle {
  scrollbar-color: color-mix(in srgb,var(--gold) 55%,transparent) transparent;
}

.rally-filter,
.notice-filter-row button,
.newsletter-year-filter,
.calendar-view-toggle button,
.admin-tabs button {
  border-color: color-mix(in srgb, var(--gold) 28%, transparent) !important;
  background: linear-gradient(145deg, #173420, #102519) !important;
  color: var(--muted) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.rally-filter.active,
.notice-filter-row button.active,
.newsletter-year-filter.active,
.calendar-view-toggle button.active,
.admin-tabs button.active {
  color: #171006 !important;
  border-color: transparent !important;
  background: linear-gradient(145deg, var(--gold-light), var(--gold)) !important;
  box-shadow: 0 10px 24px rgba(214,167,55,.25) !important;
}

input, textarea, select {
  accent-color: var(--gold);
}
.milestone-input-wrap,
.newsletter-search,
.notice-search,
.admin-search,
.admin-record-form input,
.admin-record-form textarea,
.admin-record-form select,
.admin-login-form input,
.notice-email-panel input {
  border-color: color-mix(in srgb, var(--gold) 28%, transparent) !important;
  background: linear-gradient(145deg, rgba(21,52,31,.96), rgba(12,33,21,.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 10px 24px rgba(0,0,0,.16);
}

.admin-primary-btn,
.milestone-submit,
.calendar-action.primary,
.newsletter-action.primary,
.notice-email-panel button[type="submit"] {
  background: linear-gradient(145deg, var(--gold-light), var(--gold)) !important;
  color: #171006 !important;
  box-shadow: 0 13px 27px rgba(218,170,59,.24), inset 0 1px 0 rgba(255,255,255,.35) !important;
}

/* ---------------------------------------------------------------------
   RALLIES
   --------------------------------------------------------------------- */
.rallies-screen { padding-top: 0; }
.rally-spotlight { margin: 22px 18px 17px; border-radius: 26px; }
.spotlight-icon {
  color: var(--gold-light);
  border-color: color-mix(in srgb,var(--gold) 38%,transparent);
  background: linear-gradient(145deg,#214a2c,#102d1b);
  box-shadow: 0 13px 28px rgba(0,0,0,.27), inset 0 1px 0 rgba(255,255,255,.07);
}
.spotlight-label,.spotlight-type { color: var(--gold-light); }
.countdown > div {
  border-color: color-mix(in srgb,var(--gold) 25%,transparent);
  background: linear-gradient(145deg, rgba(14,43,25,.88), rgba(9,29,18,.88));
}
.rally-list-heading,.rally-toolbar,.programme-note { margin-left:18px; margin-right:18px; }
.rally-list { margin: 0 18px; gap: 13px; }
.rally-card {
  padding: 13px 14px;
  border: 1px solid color-mix(in srgb,var(--gold) 23%,transparent);
  border-radius: 21px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb,var(--state-accent) 11%,transparent), transparent 56%),
    linear-gradient(145deg,#173821,#0e2718);
  box-shadow: 0 15px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.055);
}
.rally-card.is-next { border-color: var(--gold); box-shadow: 0 20px 40px rgba(219,170,61,.14), inset 0 1px 0 rgba(255,255,255,.07); }
.rally-venue { color:#fff8ea; font-family:var(--font-display); font-size:18px; }
.rally-date-block { border-color: color-mix(in srgb,var(--gold) 34%,transparent); background:linear-gradient(145deg,#21492c,#112e1d); }

/* ---------------------------------------------------------------------
   CALENDARS
   --------------------------------------------------------------------- */
.calendars-screen { padding-top: 0; }
.calendar-hero,.calendar-section-heading,.calendar-selector,.calendar-viewer,.calendar-actions,.calendar-help { margin-left:18px; margin-right:18px; }
.calendar-hero { margin-top:22px; border-radius:26px; }
.calendar-choice {
  min-height: 106px;
  border: 1px solid color-mix(in srgb,var(--gold) 24%,transparent);
  border-radius: 20px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb,var(--choice-accent) 13%,transparent), transparent 62%),
    linear-gradient(145deg,#1a3d25,#10291a);
  box-shadow:0 16px 32px rgba(0,0,0,.29),inset 0 1px 0 rgba(255,255,255,.055);
}
.calendar-choice-copy strong { color:#fff8ea; font:700 13px/1.2 var(--font-display); }
.calendar-choice.active { border-color:var(--gold); box-shadow:0 20px 40px rgba(215,166,53,.15),inset 0 0 0 1px rgba(238,201,111,.2); }
.calendar-viewer { border-color:color-mix(in srgb,var(--gold) 30%,transparent); background:#0b1e13; box-shadow:0 20px 44px rgba(0,0,0,.34); }
.calendar-viewer-header,.calendar-viewer-footer { background:linear-gradient(145deg,#1a3a24,#102719); }
.calendar-action { border-color:color-mix(in srgb,var(--gold) 30%,transparent); background:linear-gradient(145deg,#183821,#102719); }
.calendar-help { border-color:color-mix(in srgb,var(--gold) 25%,transparent); background:linear-gradient(145deg,#15331f,#0d2417); }

/* ---------------------------------------------------------------------
   NEWSLETTERS
   --------------------------------------------------------------------- */
.newsletters-screen { padding: 0 0 122px; }
.newsletters-screen > :not(.screen-header) { margin-left:18px; margin-right:18px; }
.newsletter-hero { margin-top:22px; border-radius:26px; }
.newsletter-card {
  border:1px solid color-mix(in srgb,var(--gold) 24%,transparent) !important;
  border-radius:22px !important;
  background:linear-gradient(145deg,#183a22,#0e2718) !important;
  box-shadow:0 17px 34px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.055) !important;
}
.newsletter-card h4 { color:#fff8ea; font-family:var(--font-display); font-size:17px; }
.newsletter-thumb { border:1px solid color-mix(in srgb,var(--gold) 32%,transparent); box-shadow:0 10px 22px rgba(0,0,0,.32); }
.newsletter-card-actions a,.newsletter-card-actions button {
  border-color:color-mix(in srgb,var(--gold) 30%,transparent) !important;
  background:linear-gradient(145deg,#1a3c24,#102719) !important;
}
.newsletter-card-actions .primary { background:linear-gradient(145deg,var(--gold-light),var(--gold)) !important; color:#171006 !important; }
.newsletter-reader-panel { border-color:color-mix(in srgb,var(--gold) 44%,transparent) !important; background:#0c1c12 !important; }

/* ---------------------------------------------------------------------
   COMMITTEE
   --------------------------------------------------------------------- */
.committee-contacts-screen { padding-top:0; }
.committee-hero,.committee-intro,.committee-grid,.committee-payment,.committee-update-note { margin-left:18px; margin-right:18px; }
.committee-hero { margin-top:22px; border-radius:27px; border-color:color-mix(in srgb,var(--gold) 42%,transparent); }
.committee-card {
  border:1px solid color-mix(in srgb,var(--gold) 25%,transparent);
  border-radius:22px;
  background:linear-gradient(145deg,#193b24,#0e2718);
  box-shadow:0 17px 34px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.055);
}
.committee-profile { border:3px solid var(--gold-light); box-shadow:0 0 0 3px rgba(75,48,13,.82),0 12px 24px rgba(0,0,0,.34); }
.committee-card-copy h3 { color:#fff8ea; font-family:var(--font-display); }
.committee-action { border-color:color-mix(in srgb,var(--gold) 30%,transparent); background:linear-gradient(145deg,#1b4027,#102719); }
.committee-payment { border-color:color-mix(in srgb,var(--gold) 36%,transparent); background:linear-gradient(145deg,#183a23,#0e2818); box-shadow:0 20px 42px rgba(0,0,0,.31); }

/* ---------------------------------------------------------------------
   MILESTONES
   --------------------------------------------------------------------- */
.milestones-screen { padding:0 18px 122px; }
.milestones-page-header { margin-left:-18px !important; margin-right:-18px !important; }
.milestone-lookup-card { margin-top:22px; border-radius:27px; }
.milestone-trophy { border-color:color-mix(in srgb,var(--gold) 44%,transparent); background:linear-gradient(145deg,#244a2e,#112c1b); }
.milestone-summary,.milestone-progress-card {
  border-color:color-mix(in srgb,var(--gold) 24%,transparent);
  background:linear-gradient(145deg,#183a23,#0e2718);
  box-shadow:0 15px 31px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.05);
}
.milestone-progress-heading h3 { font-size:24px; color:#fff8ea; }
.milestone-reset { border-color:color-mix(in srgb,var(--gold) 31%,transparent); background:linear-gradient(145deg,#193b24,#102719); }

/* ---------------------------------------------------------------------
   NOTICE BOARD — keep functionality, bring visuals closer to concept C
   --------------------------------------------------------------------- */
.notices-screen { padding-top:0; }
.notice-hero { margin-top:22px; border-radius:27px; }
.notice-hero h3 { color:#fff8ea; }
.notice-search,.notice-view-button {
  border-color:color-mix(in srgb,var(--gold) 34%,transparent);
  background:linear-gradient(145deg,#173821,#0d2618);
}
.notice-view-menu { border-color:color-mix(in srgb,var(--gold) 40%,transparent); background:rgba(13,34,21,.97); }
.notice-card {
  border-color:color-mix(in srgb,var(--gold) 29%,transparent);
  background:linear-gradient(145deg,#173821,#0d2718);
  box-shadow:0 18px 36px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.055);
}
.view-feed .notice-card:first-child { border-width:2px; box-shadow:0 24px 50px rgba(213,163,51,.18),0 16px 34px rgba(0,0,0,.34); }
.notice-card h3 { color:#fff8ea; font-size:clamp(1.35rem,5.8vw,1.9rem); }
.notice-read-more { color:var(--gold-light); }
.notice-detail-panel,.notice-email-panel { border-color:color-mix(in srgb,var(--gold) 43%,transparent); background:#0b1f14; }
.notice-document { border-color:color-mix(in srgb,var(--gold) 26%,transparent); background:linear-gradient(145deg,#183a23,#0e2718); }

/* ---------------------------------------------------------------------
   ADMIN
   --------------------------------------------------------------------- */
.admin-screen { padding-top:0; }
.admin-setup-card,.admin-login-card,.admin-dashboard { margin-left:18px; margin-right:18px; }
.admin-login-card,.admin-dashboard { margin-top:22px; border-radius:27px; }
.admin-lock-icon { border-color:color-mix(in srgb,var(--gold) 43%,transparent); background:linear-gradient(145deg,#22492d,#112d1c); }
.admin-stats > div,.admin-newsletter-sync,.admin-record-card {
  border-color:color-mix(in srgb,var(--gold) 24%,transparent) !important;
  background:linear-gradient(145deg,#183a23,#0e2718) !important;
  box-shadow:0 14px 29px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.05);
}
.admin-record-card strong { color:#fff8ea; font-family:var(--font-display); }
.admin-add-btn { background:linear-gradient(145deg,var(--gold-light),var(--gold)); color:#171006; box-shadow:0 10px 22px rgba(215,165,51,.22); }
.admin-modal-panel { border-color:color-mix(in srgb,var(--gold) 42%,transparent); background:#0b1f14; }

/* ---------------------------------------------------------------------
   PLACEHOLDER / FUTURE SECTIONS
   --------------------------------------------------------------------- */
.coming-soon { margin:24px 18px; border-radius:28px; }
.status-icon { border-color:color-mix(in srgb,var(--gold) 42%,transparent); background:linear-gradient(145deg,#21492c,#112d1c); box-shadow:0 14px 28px rgba(0,0,0,.28); }
.status-pill { background:rgba(117,79,13,.45); border-color:rgba(226,180,67,.42); color:var(--gold-light); }
.coming-soon h3 { color:#fff8ea; font-size:1.8rem; }

/* ---------------------------------------------------------------------
   MODALS / SHEETS
   --------------------------------------------------------------------- */
.rally-detail-panel,.theme-sheet .panel,.admin-modal-panel,.newsletter-reader-panel,.newsletter-email-panel {
  border-color:color-mix(in srgb,var(--gold) 42%,transparent) !important;
  background:
    radial-gradient(circle at 100% 0%,rgba(224,177,65,.08),transparent 40%),
    #0c2014 !important;
  box-shadow:0 -24px 72px rgba(0,0,0,.55) !important;
}
.sheet-handle,.notice-modal-handle { background:color-mix(in srgb,var(--gold) 48%,transparent); }

/* ---------------------------------------------------------------------
   BOTTOM NAVIGATION — stronger, premium and easier to recognise
   --------------------------------------------------------------------- */
.tabbar {
  max-width:620px;
  gap:8px;
  padding:9px 12px calc(10px + env(safe-area-inset-bottom));
  border-top:1px solid color-mix(in srgb,var(--gold) 40%,transparent);
  border-radius:22px 22px 0 0;
  background:
    linear-gradient(180deg,rgba(26,62,38,.97),rgba(7,25,15,.98));
  box-shadow:0 -14px 40px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.055);
}
.tabbar button {
  min-height:61px;
  border:1px solid transparent;
  border-radius:17px;
  color:rgba(255,249,235,.62);
  font-size:10px;
  letter-spacing:.01em;
  
}
.tab-icon { width:35px; height:35px; border-radius:12px; }
.tab-icon svg { width:24px; height:24px; }
.tabbar button.active {
  color:var(--gold-light);
  transform:translateY(-7px);
  border-color:color-mix(in srgb,var(--gold) 52%,transparent);
  background:linear-gradient(145deg,#234d2e,#102c1b);
  box-shadow:0 13px 28px rgba(0,0,0,.34),0 0 0 1px rgba(243,209,123,.06),inset 0 1px 0 rgba(255,255,255,.07);
}
.tabbar button.active .tab-icon {
  background:linear-gradient(145deg,rgba(232,190,86,.24),rgba(100,66,12,.22));
  box-shadow:inset 0 0 0 1px rgba(242,205,116,.36),0 0 20px rgba(219,170,61,.1);
}

/* ---------------------------------------------------------------------
   SMALL SCREENS
   --------------------------------------------------------------------- */
@media (max-width: 430px) {
  .screen-header { min-height:132px; padding:24px 88px 22px 18px; gap:12px; }
  .screen-header::after { width:66px; height:66px; top:25px; right:16px; border-width:3px; }
  .screen-header::before { left:76px; right:88px; bottom:20px; }
  .screen-header h2 { font-size:1.78rem; }
  .back-btn { width:46px; height:46px; border-radius:15px; }
  .tile.visual-tile { min-height:166px; padding-inline:10px; }
  .visual-icon-wrap { width:98px; height:98px; }
  .tile.visual-tile .label { font-size:15px; }
  .tile.featured.visual-tile { min-height:150px; }
  .tile.featured.visual-tile .visual-icon-wrap { width:116px; height:116px; }
  .tile.featured.visual-tile .label { font-size:20px; }
  main { padding-inline:14px; }
  .grid { gap:11px; }
  .tabbar { gap:4px; padding-inline:7px; }
}

@media (max-width: 365px) {
  .screen-header::after { display:none; }
  .screen-header { padding-right:18px; }
  .screen-header::before { right:18px; }
  .tile.visual-tile { min-height:155px; }
  .visual-icon-wrap { width:88px; height:88px; }
}

/* ===== END premium-ui.css ===== */

/* ===== BEGIN theme-fixes.css ===== */
/* =====================================================================
   CCSA NATAL MIDLANDS — THEME-AWARE PREMIUM SYSTEM (V14)
   Keeps the V13 premium structure while allowing all four palettes to
   visibly restyle the complete app.
   ===================================================================== */

:root,
[data-theme="bark"] {
  --premium-body-top: #100b08;
  --premium-body-mid: #0b1710;
  --premium-body-bottom: #08110b;
  --premium-hero-base: #120d09;
  --premium-main-top: #0b1d13;
  --premium-main-bottom: #08150e;
  --premium-screen-top: #120d09;
  --premium-screen-main: #091a11;
  --premium-header-base: #130e0a;
  --premium-header-overlay: rgba(11, 9, 7, .55);
  --premium-card-a: #1b3e27;
  --premium-card-b: #10291a;
  --premium-card-c: #0d2317;
  --premium-card-text: #fff8ea;
  --premium-card-muted: rgba(255, 248, 234, .72);
  --premium-control-a: #173821;
  --premium-control-b: #0d2618;
  --premium-nav-a: #1a3e26;
  --premium-nav-b: #07190f;
  --premium-nav-text: rgba(255, 249, 235, .66);
  --premium-modal: #0b1f14;
  --premium-image-backdrop: #050805;
}

[data-theme="ccsa-green"] {
  --premium-body-top: #071008;
  --premium-body-mid: #071a0e;
  --premium-body-bottom: #061009;
  --premium-hero-base: #08150c;
  --premium-main-top: #0a2113;
  --premium-main-bottom: #07150d;
  --premium-screen-top: #08120a;
  --premium-screen-main: #071b0e;
  --premium-header-base: #09160c;
  --premium-header-overlay: rgba(5, 14, 8, .5);
  --premium-card-a: #173d25;
  --premium-card-b: #102c1a;
  --premium-card-c: #0c2114;
  --premium-card-text: #fffbea;
  --premium-card-muted: rgba(255, 251, 234, .74);
  --premium-control-a: #173d24;
  --premium-control-b: #0c2817;
  --premium-nav-a: #1a4529;
  --premium-nav-b: #06190e;
  --premium-nav-text: rgba(255, 251, 234, .68);
  --premium-modal: #0a2113;
  --premium-image-backdrop: #030804;
}


html { background: var(--premium-body-bottom) !important; }
body {
  color: var(--cream);
  background:
    radial-gradient(circle at 50% -12%, color-mix(in srgb, var(--gold) 18%, transparent), transparent 30rem),
    radial-gradient(circle at 6% 38%, color-mix(in srgb, var(--green) 15%, transparent), transparent 28rem),
    linear-gradient(180deg, var(--premium-body-top), var(--premium-body-mid) 48%, var(--premium-body-bottom)) !important;
}
.app {
  color: var(--cream);
  background:
    radial-gradient(circle at 50% -10%, color-mix(in srgb, var(--gold) 9%, transparent), transparent 27rem),
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 95%, var(--premium-hero-base) 5%), var(--bg)) !important;
}
.hero {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--premium-header-overlay) 75%, transparent), var(--premium-header-overlay)),
    radial-gradient(circle at 15% 0%, color-mix(in srgb, var(--gold) 18%, transparent), transparent 20rem),
    radial-gradient(circle at 92% 30%, color-mix(in srgb, var(--green) 16%, transparent), transparent 18rem),
    repeating-linear-gradient(100deg, rgba(255,255,255,.016) 0 1px, transparent 1px 5px),
    var(--premium-hero-base) !important;
}
main {
  background:
    radial-gradient(circle at 100% 10%, color-mix(in srgb, var(--green) 12%, transparent), transparent 24rem),
    linear-gradient(180deg, var(--premium-main-top), var(--premium-main-bottom) 68%, var(--bg)) !important;
}
.screen {
  background:
    radial-gradient(circle at 96% 3%, color-mix(in srgb, var(--gold) 11%, transparent), transparent 24rem),
    radial-gradient(circle at 0 45%, color-mix(in srgb, var(--green) 11%, transparent), transparent 23rem),
    linear-gradient(180deg, var(--premium-screen-top) 0 148px, var(--premium-screen-main) 148px, var(--bg) 100%) !important;
}
.screen-header {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--premium-header-overlay) 35%, transparent), var(--premium-header-overlay)),
    repeating-linear-gradient(100deg, rgba(255,255,255,.014) 0 1px, transparent 1px 5px),
    var(--premium-header-base) !important;
}
.screen-header h2 { color: var(--hero-text) !important; }
.back-btn {
  background: linear-gradient(145deg, color-mix(in srgb, var(--green) 56%, var(--premium-header-base)), color-mix(in srgb, var(--premium-header-base) 85%, #000)) !important;
}

.tile.visual-tile,
.rally-card,
.calendar-choice,
.newsletter-card,
.committee-card,
.milestone-summary,
.milestone-progress-card,
.notice-card,
.notice-document,
.admin-stats > div,
.admin-newsletter-sync,
.admin-record-card {
  color: var(--cream) !important;
  background:
    radial-gradient(circle at 50% 7%, color-mix(in srgb, var(--accent, var(--green)) 12%, transparent), transparent 45%),
    linear-gradient(145deg, var(--premium-card-a), var(--premium-card-b) 62%, var(--premium-card-c)) !important;
}
.tile.visual-tile .label,
.rally-venue,
.calendar-choice-copy strong,
.newsletter-card h4,
.committee-card-copy h3,
.milestone-progress-heading h3,
.notice-card h3,
.notice-hero h3,
.admin-record-card strong,
.coming-soon h3 {
  color: var(--premium-card-text) !important;
}
.tile.visual-tile .sub { color: var(--premium-card-muted) !important; }
.tile.featured.visual-tile .label,
.tile.featured.visual-tile .sub { color: #fff9eb !important; }

.rally-spotlight,
.calendar-hero,
.newsletter-hero,
.committee-hero,
.milestone-lookup-card,
.admin-login-card,
.admin-dashboard,
.coming-soon,
.notice-hero,
.committee-payment {
  color: var(--cream) !important;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--gold) 11%, transparent), transparent 45%),
    linear-gradient(145deg, var(--premium-card-a), var(--premium-card-b) 66%, var(--premium-card-c)) !important;
}

.rally-filter,
.notice-filter-row button,
.newsletter-year-filter,
.calendar-view-toggle button,
.admin-tabs button,
.notice-search,
.notice-view-button,
.newsletter-search,
.admin-search,
.milestone-input-wrap,
.admin-record-form input,
.admin-record-form textarea,
.admin-record-form select,
.admin-login-form input,
.notice-email-panel input,
.calendar-action,
.committee-action,
.milestone-reset {
  color: var(--cream) !important;
  background: linear-gradient(145deg, var(--premium-control-a), var(--premium-control-b)) !important;
}
input, textarea, select { color: var(--cream) !important; }
input::placeholder, textarea::placeholder { color: color-mix(in srgb, var(--muted) 82%, transparent) !important; }
select option { color: var(--cream); background: var(--surface); }

.notice-view-menu,
.rally-detail-panel,
.theme-sheet .panel,
.admin-modal-panel,
.newsletter-reader-panel,
.newsletter-email-panel,
.notice-detail-panel,
.notice-email-panel {
  color: var(--cream) !important;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--gold) 8%, transparent), transparent 40%),
    var(--premium-modal) !important;
}
.theme-option {
  color: var(--cream) !important;
  background: linear-gradient(145deg, var(--premium-control-a), var(--premium-control-b)) !important;
}
.theme-option .name { color: var(--cream) !important; }
.theme-option .desc { color: var(--muted) !important; }

.calendar-viewer { background: var(--premium-modal) !important; }
.calendar-viewer-header,
.calendar-viewer-footer,
.calendar-help,
.newsletter-card-actions a,
.newsletter-card-actions button,
.notice-document-actions a,
.notice-document-actions button {
  color: var(--cream) !important;
  background: linear-gradient(145deg, var(--premium-control-a), var(--premium-control-b)) !important;
}

.tabbar {
  background: linear-gradient(180deg, var(--premium-nav-a), var(--premium-nav-b)) !important;
}
.tabbar button { color: var(--premium-nav-text) !important; }
.tabbar button.active {
  color: var(--gold-light) !important;
  background: linear-gradient(145deg, color-mix(in srgb, var(--premium-nav-a) 82%, var(--gold) 18%), var(--premium-nav-b)) !important;
}


/* ===== END theme-fixes.css ===== */

/* ===== BEGIN v19-fixes.css ===== */
/* Version 19: compact home hero and resilient gallery controls */
.hero {
  padding-top: 24px !important;
  padding-bottom: 26px !important;
}
.hero .eyebrow {
  max-width: calc(100% - 82px) !important;
  margin-bottom: 13px !important;
  padding: 7px 13px !important;
  font-size: 8px !important;
  line-height: 1.35 !important;
  white-space: normal;
}
.crest-wrap {
  width: 104px !important;
  height: 104px !important;
  margin: 0 auto 10px !important;
}
.crest-ring {
  width: 104px !important;
  height: 104px !important;
  inset: 0 !important;
}
.crest {
  width: 88px !important;
  height: 88px !important;
  padding: 8px !important;
  border-width: 4px !important;
}
.hero h1 {
  max-width: 100%;
  margin: 11px auto 0 !important;
  font-size: clamp(1.8rem, 6.8vw, 2.35rem) !important;
  line-height: 1.06 !important;
  letter-spacing: -.025em !important;
  text-wrap: balance;
}
.hero h1::after {
  width: 104px !important;
  margin-top: 13px !important;
}
.hero .tagline {
  margin: 10px auto 16px !important;
  max-width: 390px;
  font-size: 9px !important;
  line-height: 1.5 !important;
}
.clock {
  margin-top: 0 !important;
}

.gallery-error button,
.gallery-load-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 18px;
  border: 1px solid color-mix(in srgb, var(--gold) 42%, transparent);
  border-radius: 15px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--gold-light) 92%, white 8%), var(--gold));
  color: #17110d;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--gold) 22%, transparent);
}
.gallery-error button { margin-top: 14px; }
.gallery-load-more {
  width: calc(100% - 36px);
  margin: 0 18px 12px;
}
.gallery-load-more.is-loading { opacity: .72; }
.gallery-load-more[hidden] { display: none !important; }
.gallery-photo-badge { min-width: 72px; text-align: center; }

@media (max-width: 430px) {
  .hero { padding-inline: 16px !important; }
  .hero .eyebrow { max-width: calc(100% - 70px) !important; }
  .crest-wrap { width: 92px !important; height: 92px !important; }
  .crest-ring { width: 92px !important; height: 92px !important; }
  .crest { width: 78px !important; height: 78px !important; }
  .hero h1 { font-size: clamp(1.65rem, 7vw, 2rem) !important; }
  .clock { padding: 9px 12px !important; }
  .clock .time { font-size: 18px !important; }
}

/* ===== END v19-fixes.css ===== */

/* ===== BEGIN faq.css ===== */
/* CCSA Natal Midlands FAQ & Help Centre */
.faq-screen { padding-bottom: 118px; }
.faq-page-header { border-bottom: 1px solid var(--border-strong); }

.faq-hero {
  margin: 18px 18px 14px;
  padding: 24px;
  border: 1px solid var(--border-strong);
  border-radius: 28px;
  background:
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--gold) 22%, transparent), transparent 12rem),
    linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 90%, #000 10%), var(--surface));
  box-shadow: var(--card-shadow), inset 0 1px 0 rgba(255,255,255,.05);
  position: relative;
  overflow: hidden;
}
.faq-hero::after {
  content:"?";
  position:absolute;
  right:-8px;
  top:-36px;
  font: 700 190px/1 var(--font-display);
  color: color-mix(in srgb, var(--gold) 9%, transparent);
  transform: rotate(8deg);
}
.faq-hero > * { position:relative; z-index:1; }
.faq-hero-top { display:flex; gap:18px; align-items:center; }
.faq-hero-icon {
  width:88px; height:88px; flex:0 0 auto; border-radius:24px;
  display:grid; place-items:center;
  background:linear-gradient(145deg, color-mix(in srgb, var(--gold) 34%, var(--surface)), var(--surface-raised));
  border:1px solid var(--border-strong);
  box-shadow:0 14px 28px rgba(0,0,0,.24);
}
.faq-hero-icon img { width:76px; height:76px; object-fit:contain; filter:drop-shadow(0 9px 10px rgba(0,0,0,.24)); }
.faq-overline { color:var(--gold-light); font-size:10px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.faq-hero h3 { margin:6px 0 8px; font:700 clamp(1.9rem,7vw,2.55rem)/1.02 var(--font-display); }
.faq-hero p { margin:0; color:var(--muted); line-height:1.55; font-size:14px; }
.faq-hero-stats { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:20px; }
.faq-hero-stats div { padding:14px 16px; border-radius:17px; background:color-mix(in srgb, var(--bg) 68%, transparent); border:1px solid var(--border); }
.faq-hero-stats strong { display:block; color:var(--gold-light); font:700 1.55rem/1 var(--font-display); }
.faq-hero-stats span { display:block; margin-top:5px; color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.13em; font-weight:800; }

.faq-controls { padding:0 18px; }
.faq-search { min-height:58px; display:flex; align-items:center; gap:12px; padding:0 17px; border-radius:18px; border:1px solid var(--border-strong); background:var(--surface); }
.faq-search svg { width:21px; color:var(--gold); }
.faq-search input { width:100%; border:0; outline:0; background:transparent; color:var(--cream); font:600 15px var(--font-body); }
.faq-search input::placeholder { color:var(--muted); }
.faq-filter-row { display:flex; gap:9px; overflow-x:auto; padding:12px 1px 8px; scrollbar-width:none; }
.faq-filter-row::-webkit-scrollbar { display:none; }
.faq-filter-row button { flex:0 0 auto; min-height:43px; border-radius:999px; border:1px solid var(--border-strong); background:var(--surface); padding:0 15px; color:var(--muted); font-size:12px; font-weight:800; }
.faq-filter-row button.active { color:var(--ink); background:linear-gradient(135deg,var(--gold-light),var(--gold)); box-shadow:0 8px 20px color-mix(in srgb,var(--gold) 23%,transparent); }
.faq-refresh { width:100%; min-height:48px; margin:5px 0 12px; border:1px solid var(--border); border-radius:15px; background:color-mix(in srgb,var(--surface) 90%,transparent); color:var(--gold-light); font-size:12px; font-weight:800; }

.faq-section-heading { padding:10px 19px 9px; }
.faq-section-heading span { display:block; color:var(--gold); font-size:9px; letter-spacing:.17em; text-transform:uppercase; font-weight:900; }
.faq-section-heading h3 { margin:4px 0 0; font:700 1.55rem var(--font-display); }

.faq-featured { display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:0 18px 14px; }
.faq-feature-card { min-height:118px; text-align:left; padding:15px; border:1px solid var(--border-strong); border-radius:20px; background:linear-gradient(145deg,var(--surface-raised),var(--surface)); box-shadow:var(--card-shadow); display:flex; flex-direction:column; gap:9px; position:relative; }
.faq-feature-icon { width:35px; height:35px; border-radius:12px; display:grid; place-items:center; color:var(--ink); background:var(--gold); font-weight:900; }
.faq-feature-card small { display:block; color:var(--gold-light); font-size:8px; letter-spacing:.11em; text-transform:uppercase; font-weight:900; }
.faq-feature-card strong { display:block; margin-top:4px; color:var(--cream); font:650 14px/1.3 var(--font-body); }
.faq-feature-card b { position:absolute; right:13px; bottom:11px; color:var(--gold); font-size:21px; }

.faq-list { display:grid; gap:10px; padding:0 18px 20px; }
.faq-item { border:1px solid var(--border); border-radius:20px; background:linear-gradient(145deg,color-mix(in srgb,var(--surface-raised) 92%,transparent),var(--surface)); overflow:hidden; box-shadow:0 10px 24px rgba(0,0,0,.17);  }
.faq-item.open { border-color:var(--border-strong); }
.faq-question { width:100%; min-height:78px; display:flex; align-items:center; gap:13px; padding:14px; border:0; background:transparent; text-align:left; }
.faq-question-icon { width:42px; height:42px; flex:0 0 auto; display:grid; place-items:center; border-radius:14px; background:color-mix(in srgb,var(--gold) 14%,var(--surface)); border:1px solid var(--border); color:var(--gold-light); font-weight:900; }
.faq-question-copy { min-width:0; flex:1; }
.faq-question-copy small { display:block; color:var(--gold); font-size:8px; letter-spacing:.12em; text-transform:uppercase; font-weight:900; }
.faq-question-copy strong { display:block; margin-top:5px; color:var(--cream); font:700 15px/1.35 var(--font-body); }
.faq-chevron { width:34px; height:34px; border-radius:12px; display:grid; place-items:center; border:1px solid var(--border); color:var(--gold-light); font-size:20px; }
.faq-answer { padding:0 17px 18px 69px; color:var(--muted); }
.faq-answer > p { margin:0 0 13px; line-height:1.62; font-size:14px; }
.faq-steps { margin:0; padding:0; list-style:none; counter-reset:faqstep; display:grid; gap:9px; }
.faq-steps li { counter-increment:faqstep; position:relative; min-height:34px; padding:7px 8px 7px 40px; line-height:1.45; color:var(--cream); background:color-mix(in srgb,var(--bg) 44%,transparent); border-radius:12px; font-size:13px; }
.faq-steps li::before { content:counter(faqstep); position:absolute; left:8px; top:6px; width:24px; height:24px; display:grid; place-items:center; border-radius:8px; background:var(--gold); color:var(--ink); font-size:11px; font-weight:900; }
.faq-image-open { width:100%; margin-top:14px; padding:0; border:1px solid var(--border-strong); border-radius:16px; overflow:hidden; background:var(--surface); }
.faq-image-open img { width:100%; height:auto; }
.faq-video { margin-top:14px; aspect-ratio:16/9; border-radius:16px; overflow:hidden; border:1px solid var(--border-strong); }
.faq-video iframe { width:100%; height:100%; border:0; }
.faq-action-link { min-height:48px; margin-top:14px; padding:0 15px; display:flex; align-items:center; justify-content:space-between; border-radius:14px; background:linear-gradient(135deg,var(--gold-light),var(--gold)); color:var(--ink); font-size:12px; font-weight:900; }

.faq-contact-card { margin:4px 18px 22px; padding:20px; border-radius:24px; border:1px solid var(--border-strong); background:linear-gradient(145deg,color-mix(in srgb,var(--surface-raised) 91%,#000 9%),var(--surface)); }
.faq-contact-card h3 { margin:4px 0 7px; font:700 1.55rem var(--font-display); }
.faq-contact-card p { margin:0; color:var(--muted); font-size:13px; line-height:1.55; }
.faq-contact-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:15px; }
.faq-contact-actions a { min-height:51px; border-radius:15px; display:flex; align-items:center; justify-content:center; text-align:center; padding:8px; border:1px solid var(--border-strong); background:var(--surface-raised); color:var(--cream); font-size:11px; font-weight:900; }
.faq-contact-actions a.primary { background:linear-gradient(135deg,var(--gold-light),var(--gold)); color:var(--ink); }

.faq-loading { margin:20px 18px; padding:18px; border:1px solid var(--border); border-radius:18px; color:var(--muted); text-align:center; }
.faq-error { margin:10px 18px; padding:14px; border-radius:15px; border:1px solid color-mix(in srgb,var(--amber) 55%,transparent); background:color-mix(in srgb,var(--amber) 9%,var(--surface)); color:var(--cream); font-size:12px; line-height:1.5; }
.faq-empty { padding:28px 18px; border:1px dashed var(--border-strong); border-radius:20px; text-align:center; color:var(--muted); }
.faq-empty strong { color:var(--cream); }
.faq-empty p { margin:7px 0 0; font-size:12px; }

.faq-image-modal { position:fixed; inset:0; z-index:150; display:grid; place-items:center; padding:18px; }
.faq-image-modal[hidden] { display:none; }
.faq-image-backdrop { position:absolute; inset:0; border:0; background:rgba(0,0,0,.86); backdrop-filter:blur(12px); }
.faq-image-panel { position:relative; z-index:1; width:min(100%,980px); max-height:92vh; overflow:auto; border:1px solid var(--border-strong); border-radius:22px; background:#070b08; box-shadow:0 30px 90px rgba(0,0,0,.7); transform:scale(.97); opacity:0;  }
.faq-image-modal.open .faq-image-panel { transform:scale(1); opacity:1; }
.faq-image-panel img { width:100%; height:auto; }
.faq-image-close { position:sticky; float:right; top:12px; right:12px; margin:12px; width:44px; height:44px; border-radius:14px; border:1px solid rgba(255,255,255,.25); background:rgba(0,0,0,.68); color:#fff; z-index:2; font-size:24px; }

.admin-stats.admin-stats-ten { grid-template-columns:repeat(3,minmax(0,1fr)); }
.admin-faq-preview { width:58px; height:58px; object-fit:cover; border-radius:14px; border:1px solid var(--border); }

@media (max-width:520px) {
  .faq-hero-top { align-items:flex-start; }
  .faq-hero-icon { width:72px; height:72px; border-radius:20px; }
  .faq-hero-icon img { width:62px; height:62px; }
  .faq-featured { grid-template-columns:1fr; }
  .faq-feature-card { min-height:95px; flex-direction:row; align-items:center; }
  .faq-answer { padding-left:17px; }
  .faq-contact-actions { grid-template-columns:1fr; }
  .admin-stats.admin-stats-ten { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* ===== END faq.css ===== */

/* ===== BEGIN merchandise.css ===== */
/* =====================================================================
   CCSA NATAL MIDLANDS — MERCHANDISE (V22)
   Premium catalogue, cart and order-request workflow.
   ===================================================================== */

.merch-screen { padding-bottom: 118px; }
.merch-page-header { margin-bottom: 18px; }

.merch-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 18px;
  align-items: center;
  margin: 0 14px 18px;
  padding: 22px;
  border: 1px solid var(--border-strong);
  border-radius: 26px;
  color: var(--premium-card-text);
  background:
    radial-gradient(circle at 90% 12%, color-mix(in srgb,var(--gold) 24%,transparent), transparent 35%),
    linear-gradient(145deg,var(--premium-card-a),var(--premium-card-b));
  box-shadow: var(--card-shadow);
}
.merch-hero::after {
  content:"";
  position:absolute;
  inset:auto -45px -60px auto;
  width:180px;
  height:180px;
  border-radius:50%;
  border:26px solid color-mix(in srgb,var(--gold) 8%,transparent);
  pointer-events:none;
}
.merch-hero-copy { min-width: 0; }
.merch-overline,
.merch-section-kicker {
  display:block;
  color:var(--gold-light);
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.merch-hero h3,
.merch-section-heading h3,
.merch-modal h3,
.merch-cart-panel h3,
.merch-checkout-panel h3 {
  margin:5px 0 7px;
  font-family:var(--font-display);
  font-weight:700;
  line-height:1.02;
}
.merch-hero h3 { font-size:clamp(30px,6vw,44px); }
.merch-hero p { margin:0; max-width:430px; color:var(--premium-card-muted); line-height:1.55; font-size:13px; }
.merch-hero-icon {
  width:108px;
  height:108px;
  padding:4px;
  border-radius:28px;
}
.merch-hero-icon .premium-registry-image { width:100px; height:100px; }

.merch-cart-launch {
  grid-column:1 / -1;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  min-height:56px;
  padding:10px 14px;
  border:1px solid color-mix(in srgb,var(--gold) 42%,transparent);
  border-radius:16px;
  color:var(--premium-card-text);
  background:color-mix(in srgb,var(--surface) 76%,transparent);
  font:inherit;
  font-weight:850;
  cursor:pointer;
}
.merch-cart-launch span:last-child {
  display:grid;
  place-items:center;
  min-width:35px;
  height:35px;
  padding:0 10px;
  border-radius:999px;
  color:var(--ink);
  background:linear-gradient(135deg,var(--gold-light),var(--gold));
}

.merch-controls { margin:0 14px 18px; display:grid; gap:11px; }
.merch-search {
  display:flex;
  align-items:center;
  gap:10px;
  min-height:58px;
  padding:0 16px;
  border:1px solid var(--border-strong);
  border-radius:18px;
  background:linear-gradient(145deg,var(--premium-control-a),var(--premium-control-b));
}
.merch-search svg { width:21px; height:21px; color:var(--gold); }
.merch-search input { flex:1; min-width:0; border:0; outline:0; color:var(--premium-card-text); background:transparent; font:inherit; }
.merch-search input::placeholder { color:var(--premium-card-muted); }
.merch-filters { display:flex; gap:8px; overflow:auto; padding-bottom:3px; scrollbar-width:none; }
.merch-filters::-webkit-scrollbar { display:none; }
.merch-filter {
  flex:0 0 auto;
  min-height:42px;
  padding:0 17px;
  border:1px solid var(--border-strong);
  border-radius:999px;
  color:var(--premium-card-text);
  background:var(--premium-control-b);
  font:inherit;
  font-size:12px;
  font-weight:800;
}
.merch-filter.active { color:var(--ink); border-color:transparent; background:linear-gradient(135deg,var(--gold-light),var(--gold)); box-shadow:0 10px 22px color-mix(in srgb,var(--gold) 18%,transparent); }

.merch-section-heading { display:flex; align-items:end; justify-content:space-between; gap:15px; margin:0 14px 12px; }
.merch-section-heading h3 { font-size:28px; color:var(--cream); }
.merch-section-heading span:last-child { color:var(--muted); font-size:11px; font-weight:800; }

.merch-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0 14px; }
.merch-card {
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-width:0;
  border:1px solid var(--border-strong);
  border-radius:22px;
  background:linear-gradient(145deg,var(--premium-card-a),var(--premium-card-b));
  box-shadow:var(--card-shadow);
}
.merch-card.featured { grid-column:span 2; display:grid; grid-template-columns:44% minmax(0,1fr); }
.merch-card-media {
  position:relative;
  display:grid;
  place-items:center;
  min-height:178px;
  padding:14px;
  background:
    radial-gradient(circle at 35% 15%,rgba(255,255,255,.12),transparent 38%),
    linear-gradient(150deg,color-mix(in srgb,var(--surface-raised) 72%,var(--gold) 7%),color-mix(in srgb,var(--surface) 88%,#000));
}
.merch-card.featured .merch-card-media { min-height:260px; }
.merch-card-media img { width:100%; height:100%; max-height:240px; object-fit:contain; filter:drop-shadow(0 18px 18px rgba(0,0,0,.38)); }
.merch-card-badge { position:absolute; top:10px; left:10px; padding:6px 9px; border-radius:999px; color:var(--ink); background:var(--gold-light); font-size:8px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.merch-card-copy { display:flex; flex:1; flex-direction:column; gap:7px; padding:14px; }
.merch-card-category { color:var(--gold-light); font-size:8px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.merch-card h4 { margin:0; color:var(--premium-card-text); font-family:var(--font-display); font-size:20px; line-height:1.05; }
.merch-card p { margin:0; color:var(--premium-card-muted); font-size:10px; line-height:1.5; }
.merch-card-price { margin-top:auto; color:var(--gold-light); font-size:15px; font-weight:900; }
.merch-card-price.pending { font-size:10px; line-height:1.4; }
.merch-card button {
  min-height:44px;
  margin-top:4px;
  border:0;
  border-radius:13px;
  color:var(--ink);
  background:linear-gradient(135deg,var(--gold-light),var(--gold));
  font:inherit;
  font-size:11px;
  font-weight:900;
  cursor:pointer;
}
.merch-empty,
.merch-loading { grid-column:1/-1; padding:34px 18px; border:1px dashed var(--border-strong); border-radius:22px; text-align:center; color:var(--muted); }

.merch-modal,
.merch-cart,
.merch-checkout {
  position:fixed;
  inset:0;
  z-index:110;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.merch-modal[hidden], .merch-cart[hidden], .merch-checkout[hidden] { display:none; }
.merch-backdrop { position:absolute; inset:0; border:0; background:rgba(0,0,0,.78); backdrop-filter:blur(8px); }
.merch-modal-panel,
.merch-cart-panel,
.merch-checkout-panel {
  position:relative;
  z-index:1;
  width:min(620px,100%);
  max-height:94dvh;
  overflow:auto;
  padding:18px 18px calc(22px + env(safe-area-inset-bottom));
  border:1px solid var(--border-strong);
  border-radius:28px 28px 0 0;
  color:var(--premium-card-text);
  background:var(--premium-modal);
  box-shadow:0 -20px 70px rgba(0,0,0,.48);
  transform:translateY(18px);
  opacity:0;
  
}
.merch-modal.open .merch-modal-panel,
.merch-cart.open .merch-cart-panel,
.merch-checkout.open .merch-checkout-panel { transform:none; opacity:1; }
.merch-close { position:absolute; top:14px; right:14px; width:42px; height:42px; border:1px solid var(--border-strong); border-radius:50%; color:var(--cream); background:var(--surface); font-size:23px; cursor:pointer; }
.merch-product-layout { display:grid; grid-template-columns:42% minmax(0,1fr); gap:18px; align-items:start; }
.merch-product-image { display:grid; place-items:center; min-height:280px; padding:14px; border-radius:22px; background:linear-gradient(145deg,var(--surface-raised),var(--surface)); }
.merch-product-image img { width:100%; max-height:350px; object-fit:contain; filter:drop-shadow(0 18px 18px rgba(0,0,0,.38)); }
.merch-modal h3,
.merch-cart-panel h3,
.merch-checkout-panel h3 { margin-right:48px; font-size:30px; }
.merch-modal-copy p { color:var(--muted); line-height:1.55; font-size:12px; }
.merch-price-large { margin:12px 0; color:var(--gold-light); font-size:22px; font-weight:900; }
.merch-price-large.pending { font-size:12px; line-height:1.45; }
.merch-options { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.merch-options label,
.merch-checkout-form label { display:grid; gap:6px; color:var(--muted); font-size:10px; font-weight:800; }
.merch-options label.full,
.merch-checkout-form label.full { grid-column:1/-1; }
.merch-options input,
.merch-options select,
.merch-checkout-form input,
.merch-checkout-form select,
.merch-checkout-form textarea {
  min-height:48px;
  padding:10px 12px;
  border:1px solid var(--border-strong);
  border-radius:13px;
  outline:0;
  color:var(--premium-card-text);
  background:var(--premium-control-a);
  font:inherit;
}
.merch-options textarea,
.merch-checkout-form textarea { min-height:86px; resize:vertical; }
.merch-primary,
.merch-secondary {
  min-height:50px;
  padding:0 16px;
  border-radius:14px;
  font:inherit;
  font-weight:900;
  cursor:pointer;
}
.merch-primary { border:0; color:var(--ink); background:linear-gradient(135deg,var(--gold-light),var(--gold)); }
.merch-secondary { border:1px solid var(--border-strong); color:var(--premium-card-text); background:var(--surface); }
.merch-add-button { width:100%; margin-top:14px; }

.merch-cart-items { display:grid; gap:10px; margin:15px 0; }
.merch-cart-item { display:grid; grid-template-columns:70px minmax(0,1fr) auto; gap:10px; align-items:center; padding:10px; border:1px solid var(--border); border-radius:16px; background:var(--surface); }
.merch-cart-item img { width:70px; height:70px; object-fit:contain; border-radius:12px; background:var(--surface-raised); }
.merch-cart-item strong { display:block; font-size:12px; }
.merch-cart-item small { display:block; margin-top:3px; color:var(--muted); line-height:1.4; font-size:9px; }
.merch-cart-item button { border:0; color:#ef9b8f; background:transparent; font-size:20px; cursor:pointer; }
.merch-cart-total { display:flex; justify-content:space-between; gap:14px; padding:14px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.merch-cart-total span { color:var(--muted); font-size:11px; }
.merch-cart-total strong { text-align:right; color:var(--gold-light); }
.merch-cart-note { margin:12px 0; color:var(--muted); font-size:10px; line-height:1.5; }
.merch-cart-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.merch-cart-empty { padding:28px 12px; text-align:center; color:var(--muted); }

.merch-checkout-form { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px; }
.merch-checkout-actions { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:4px; }
.merch-checkout-message { grid-column:1/-1; padding:11px 12px; border-radius:13px; color:#f2aaa0; background:rgba(174,58,46,.15); font-size:10px; line-height:1.5; }
.merch-success { grid-column:1/-1; padding:20px; border:1px solid var(--border-strong); border-radius:18px; text-align:center; background:var(--surface); }
.merch-success strong { display:block; color:var(--gold-light); font-size:24px; }
.merch-success p { color:var(--muted); line-height:1.55; }
.merch-success-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }

@media (min-width:700px) {
  .merch-modal,.merch-cart,.merch-checkout { align-items:center; padding:20px; }
  .merch-modal-panel,.merch-cart-panel,.merch-checkout-panel { border-radius:28px; }
}
@media (max-width:520px) {
  .merch-hero { grid-template-columns:minmax(0,1fr) 82px; padding:18px; }
  .merch-hero-icon { width:82px; height:82px; border-radius:23px; }
  .merch-hero-icon .premium-registry-image { width:75px; height:75px; }
  .merch-hero h3 { font-size:31px; }
  .merch-grid { grid-template-columns:1fr; }
  .merch-card.featured { grid-column:auto; display:flex; }
  .merch-card.featured .merch-card-media { min-height:210px; }
  .merch-product-layout { grid-template-columns:1fr; }
  .merch-product-image { min-height:230px; }
}
@media (max-width:390px) {
  .merch-hero { grid-template-columns:1fr; }
  .merch-hero-icon { position:absolute; right:14px; top:14px; width:66px; height:66px; opacity:.88; }
  .merch-hero-copy { padding-right:60px; }
  .merch-options,.merch-checkout-form { grid-template-columns:1fr; }
  .merch-checkout-form label.full,.merch-options label.full,.merch-checkout-actions { grid-column:auto; }
}

/* ===== END merchandise.css ===== */

/* ===== BEGIN intentions.css ===== */
.intention-screen { padding: 0 18px 126px; }
.intention-page-header { margin-left: -18px !important; margin-right: -18px !important; }
.intention-hero {
  margin: 22px 0 16px;
  padding: 22px;
  border: 1px solid color-mix(in srgb, var(--gold) 38%, transparent);
  border-radius: 27px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--gold) 12%, transparent), transparent 46%),
    linear-gradient(145deg, var(--premium-card-a), var(--premium-card-b) 66%, var(--premium-card-c));
  box-shadow: 0 20px 44px rgba(0,0,0,.28);
}
.intention-overline { color: var(--gold); font-size: 9px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.intention-hero h3 { margin: 5px 0 8px; color: var(--premium-card-text); font-family: var(--font-display); font-size: 28px; line-height: 1.03; }
.intention-hero p { margin: 0; color: var(--premium-card-muted); line-height: 1.55; font-size: 11px; }
.intention-club-note {
  margin-top: 14px;
  padding: 12px 13px;
  border-radius: 15px;
  border: 1px solid color-mix(in srgb, var(--gold) 28%, transparent);
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  color: var(--cream);
  font-size: 10px;
  line-height: 1.5;
}
.intention-form { display: grid; gap: 14px; }
.intention-section {
  padding: 17px;
  border: 1px solid var(--border);
  border-radius: 22px;
  background: linear-gradient(145deg, var(--premium-card-a), var(--premium-card-b));
  box-shadow: 0 14px 34px rgba(0,0,0,.2);
}
.intention-section-heading { margin-bottom: 13px; }
.intention-section-heading span { color: var(--gold); font-size: 8px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.intention-section-heading h3 { margin: 3px 0 0; font-family: var(--font-display); color: var(--premium-card-text); font-size: 22px; }
.intention-section-heading p { margin: 6px 0 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.intention-grid { display: grid; gap: 12px; }
.intention-grid label { display: grid; gap: 6px; }
.intention-grid label > span { color: var(--cream); font-size: 10px; font-weight: 800; }
.intention-grid input,
.intention-grid select,
.intention-grid textarea {
  width: 100%;
  min-height: 48px;
  padding: 12px 13px;
  border: 1px solid color-mix(in srgb, var(--gold) 25%, var(--border));
  border-radius: 14px;
  color: var(--cream);
  background: linear-gradient(145deg, var(--premium-control-a), var(--premium-control-b));
  font: inherit;
  font-size: 12px;
}
.intention-grid textarea { min-height: 82px; resize: vertical; }
.intention-grid input[readonly] { color: var(--gold-light); font-weight: 850; }
.intention-helper { margin: -2px 0 0; color: var(--muted); font-size: 9px; line-height: 1.4; }
.intention-total-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--gold) 32%, transparent);
  background: color-mix(in srgb, var(--surface) 78%, transparent);
}
.intention-total-card span { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .11em; font-weight: 850; }
.intention-total-card strong { color: var(--gold-light); font-family: var(--font-display); font-size: 21px; }
.intention-confirm {
  display: grid;
  grid-template-columns: 24px 1fr;
  align-items: start;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 17px;
  background: color-mix(in srgb, var(--surface-raised) 88%, transparent);
  color: var(--cream);
  font-size: 10px;
  line-height: 1.5;
}
.intention-confirm input { width: 20px; height: 20px; margin: 0; accent-color: var(--gold); }
.intention-submit {
  width: 100%;
  min-height: 54px;
  border: 0;
  border-radius: 17px;
  color: #171006;
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
  font: inherit;
  font-size: 13px;
  font-weight: 900;
  box-shadow: 0 14px 32px color-mix(in srgb, var(--gold) 24%, transparent);
}
.intention-submit:disabled { opacity: .58; }
.intention-message { padding: 13px 14px; border-radius: 15px; border: 1px solid #a34d32; background: rgba(107,34,22,.25); color: #ffd8cb; font-size: 11px; line-height: 1.45; }
.intention-message.success { border-color: #4b9a64; background: rgba(36,100,55,.24); color: #d7f6df; }
.intention-success {
  padding: 20px;
  border: 1px solid color-mix(in srgb, var(--gold) 40%, transparent);
  border-radius: 22px;
  background: linear-gradient(145deg, #1d482b, #0f2d1b);
  text-align: center;
}
.intention-success strong { display: block; margin: 8px 0; color: var(--gold-light); font-family: var(--font-display); font-size: 26px; }
.intention-success p { margin: 0 0 14px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.intention-success-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.intention-success-actions button { min-height: 44px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--gold) 28%, transparent); color: var(--cream); background: linear-gradient(145deg, var(--premium-control-a), var(--premium-control-b)); font: inherit; font-size: 10px; font-weight: 850; }
.rally-intention-launch {
  width: 100%;
  min-height: 50px;
  margin: 14px 0 0;
  border: 0;
  border-radius: 16px;
  color: #171006;
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 14px 30px color-mix(in srgb, var(--gold) 22%, transparent);
}
.park-club-booking-note {
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--gold) 30%, transparent);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-raised) 90%, transparent);
  color: var(--cream);
  font-size: 10px;
  line-height: 1.5;
}
.park-club-booking-note strong { display: block; margin-bottom: 3px; color: var(--gold-light); font-size: 11px; }
.admin-intention-status { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.admin-intention-status span { padding: 5px 7px; border-radius: 999px; background: color-mix(in srgb, var(--gold) 11%, transparent); border: 1px solid color-mix(in srgb, var(--gold) 20%, transparent); color: var(--gold-light); font-size: 8px; font-weight: 800; }
@media (min-width: 660px) {
  .intention-grid.two { grid-template-columns: 1fr 1fr; }
  .intention-grid.two .full { grid-column: 1 / -1; }
}

/* Version 28: secure member detail autofill */
.intention-member-lookup {
  min-height: 44px;
  display: flex;
  align-items: center;
  padding: 11px 13px;
  border: 1px solid color-mix(in srgb, var(--gold) 24%, var(--border));
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 78%, transparent);
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}
.intention-member-lookup.waiting { color: var(--gold-light); }
.intention-member-lookup.loading {
  color: var(--cream);
  background: linear-gradient(145deg, var(--premium-control-a), var(--premium-control-b));
}
.intention-member-lookup.success {
  border-color: color-mix(in srgb, #64b77a 58%, transparent);
  background: rgba(39, 111, 61, .23);
  color: #dcf7e3;
}
.intention-member-lookup.error {
  border-color: color-mix(in srgb, #d47758 62%, transparent);
  background: rgba(112, 42, 25, .24);
  color: #ffd9cc;
}
.intention-grid input.is-autofilled {
  border-color: color-mix(in srgb, #71c889 68%, var(--gold));
  box-shadow: inset 0 0 0 1px rgba(113, 200, 137, .16);
}
.intention-rate-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}.intention-rate-display{display:flex;justify-content:space-between;gap:10px;padding:12px;border:1px solid var(--border);border-radius:13px;background:rgba(0,0,0,.12);}.intention-rate-display span{color:var(--premium-card-muted,var(--muted));font-size:.78rem;}.intention-rate-display strong{color:var(--gold-light);white-space:nowrap;}.intention-price-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px;}.intention-option-check{grid-column:1/-1;display:flex!important;align-items:center;gap:10px;border:1px solid var(--border);border-radius:13px;padding:13px;}.intention-option-check input{width:22px!important;height:22px;}.intention-breakdown{margin-top:12px;padding:15px;border:1px solid var(--border);border-radius:16px;background:rgba(0,0,0,.14);}.intention-breakdown>strong{display:block;color:var(--gold-light);margin-bottom:9px;}.intention-breakdown>div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-top:1px solid rgba(255,255,255,.07);}.intention-food-row{display:grid;grid-template-columns:1fr 1.4fr 80px 42px;gap:8px;align-items:end;margin-top:10px;}.intention-food-row button{height:46px;border-radius:12px;border:1px solid #a65c4d;color:#ffd5cc;background:rgba(166,92,77,.16);font-size:1.3rem;}.intention-special{display:grid;gap:5px;border-left:4px solid var(--gold);padding:13px 15px;border-radius:12px;background:rgba(218,174,35,.1);}.intention-special strong{color:var(--gold-light);}.intention-special span{color:var(--premium-card-text,var(--cream));}@media(max-width:620px){.intention-rate-grid,.intention-price-options{grid-template-columns:1fr;}.intention-food-row{grid-template-columns:1fr 1fr;}.intention-food-row label:nth-child(1),.intention-food-row label:nth-child(2){grid-column:1/-1;}}

/* ===== END intentions.css ===== */

/* ===== BEGIN settings.css ===== */
.settings-screen{padding-bottom:120px;}.settings-page-header{margin-bottom:18px;}.settings-hero,.settings-card{margin:0 20px 18px;border:1px solid rgba(218,174,35,.42);border-radius:24px;background:linear-gradient(145deg,rgba(18,59,34,.96),rgba(5,35,21,.98));box-shadow:0 18px 42px rgba(0,0,0,.22);}.settings-hero{display:flex;align-items:center;gap:16px;padding:22px;}.settings-hero-icon{width:72px;height:72px;flex:0 0 72px;display:grid;place-items:center;border-radius:22px;color:var(--gold);background:rgba(255,255,255,.06);border:1px solid rgba(218,174,35,.52);}.settings-hero-icon svg{width:44px;height:44px;}.settings-overline,.settings-heading>span{display:block;color:var(--gold);font:800 .72rem/1.2 system-ui;letter-spacing:.15em;text-transform:uppercase;}.settings-hero h3,.settings-heading h3{margin:5px 0 4px;color:#fff;font-family:Georgia,serif;}.settings-hero p,.settings-note,.settings-about{margin:0;color:rgba(255,255,255,.74);line-height:1.5;}.settings-card{padding:22px;}.settings-heading{margin-bottom:16px;}.settings-card fieldset{border:0;padding:0;margin:0 0 20px;}.settings-card legend{font-weight:800;color:#fff;margin-bottom:10px;}.settings-segment{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}.settings-theme-options{grid-template-columns:repeat(2,minmax(0,1fr));}.settings-segment button,.settings-actions button,.settings-update-button{min-height:48px;border-radius:15px;border:1px solid rgba(218,174,35,.45);background:rgba(255,255,255,.045);color:#fff;font-weight:800;padding:10px 13px;}.settings-segment button.active{background:linear-gradient(135deg,#f3c646,#d79b16);color:#142117;border-color:#f7d86d;}.theme-dot{display:inline-block;width:18px;height:18px;border-radius:50%;margin-right:8px;vertical-align:-4px;border:2px solid rgba(255,255,255,.65);}.theme-dot.bark{background:#41362b;}.theme-dot.green{background:#006221;}.settings-toggle{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0;border-top:1px solid rgba(255,255,255,.09);color:#fff;}.settings-toggle small{display:block;margin-top:4px;color:rgba(255,255,255,.65);}.settings-toggle input{position:absolute;opacity:0;pointer-events:none;}.settings-toggle i{position:relative;width:52px;height:30px;flex:0 0 52px;border-radius:30px;background:#5a645d;border:1px solid rgba(255,255,255,.18);}.settings-toggle i:after{content:"";position:absolute;width:24px;height:24px;left:2px;top:2px;border-radius:50%;background:#fff;}.settings-toggle input:checked+i{background:#d8aa26;}.settings-toggle input:checked+i:after{transform:translateX(22px);background:#102918;}.settings-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}.settings-form-grid label{display:grid;gap:7px;color:#fff;font-weight:750;}.settings-form-grid label.full{grid-column:1/-1;}.settings-form-grid input{width:100%;box-sizing:border-box;border-radius:14px;border:1px solid rgba(218,174,35,.45);background:rgba(0,0,0,.17);color:#fff;padding:14px;font:inherit;}.settings-actions{display:flex;gap:10px;margin-top:15px;flex-wrap:wrap;}.settings-actions .primary,.settings-update-button{background:linear-gradient(135deg,#f3c646,#d79b16);color:#122316;}.settings-message{margin-top:12px;border-radius:12px;padding:11px 13px;background:rgba(90,200,120,.12);color:#d8ffe3;}.settings-status-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;}.settings-status-grid>div{border:1px solid rgba(218,174,35,.24);border-radius:14px;padding:13px;background:rgba(0,0,0,.14);}.settings-status-grid span{display:block;color:rgba(255,255,255,.6);font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;}.settings-status-grid strong{display:block;color:#fff;margin-top:4px;}.settings-update-button{width:100%;}.settings-link-list{display:grid;gap:9px;margin-bottom:16px;}.settings-link-list a{display:flex;justify-content:space-between;align-items:center;min-height:52px;border:1px solid rgba(218,174,35,.3);border-radius:14px;padding:0 15px;color:#fff;text-decoration:none;font-weight:800;}.settings-version-footer,.app-version-footer{text-align:center;color:rgba(255,255,255,.48);font-size:.76rem;letter-spacing:.04em;padding:12px 16px;}.settings-tab-icon svg{width:28px;height:28px;}.settings-home-tile .settings-tile-icon svg{width:58px;height:58px;}.faq-scope-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px;}.faq-scope-switch button{min-height:48px;border:1px solid rgba(218,174,35,.38);border-radius:15px;background:rgba(255,255,255,.045);color:#fff;font-weight:800;}.faq-scope-switch button.active{background:var(--gold,#dfb330);color:#102719;}.admin-tab[data-admin-tab="committee"]{display:inline-flex;}@media(max-width:620px){.settings-form-grid,.settings-status-grid{grid-template-columns:1fr;}.settings-segment{grid-template-columns:1fr;}.settings-theme-options{grid-template-columns:1fr;}.settings-hero{align-items:flex-start;}.settings-hero-icon{width:58px;height:58px;flex-basis:58px;}.settings-card,.settings-hero{margin-left:12px;margin-right:12px;}.settings-actions button{width:100%;}}
.home-version{text-align:center;color:rgba(255,255,255,.42);font-size:.72rem;letter-spacing:.05em;padding:16px 12px 108px;}

/* ===== END settings.css ===== */

/* ===== BEGIN committee-dynamic.css ===== */
.committee-list{display:grid;gap:18px;padding:0 18px 120px;}.committee-loading{padding:26px;border:1px solid rgba(218,174,35,.35);border-radius:22px;color:rgba(255,255,255,.72);text-align:center;}.committee-card{position:relative;display:grid;grid-template-columns:112px 1fr;gap:17px;padding:18px;border:1px solid rgba(218,174,35,.42);border-radius:24px;background:linear-gradient(145deg,rgba(19,65,37,.98),rgba(8,42,25,.98));box-shadow:0 18px 42px rgba(0,0,0,.2);overflow:hidden;}.committee-card:before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:4px;border-radius:6px;background:linear-gradient(#ffe172,#d39a17);}.committee-photo{width:112px;height:112px;object-fit:cover;border-radius:18px;border:3px solid #e6b72d;background:#173b25;}.committee-role{color:#f0c84d;text-transform:uppercase;font-size:.72rem;letter-spacing:.1em;font-weight:900;}.committee-card h3{margin:4px 0 10px;color:#fff;font-family:Georgia,serif;font-size:1.7rem;}.committee-contact-lines{display:grid;gap:7px;color:rgba(255,255,255,.82);font-size:.9rem;}.committee-contact-lines a{color:inherit;text-decoration:none;overflow-wrap:anywhere;}.committee-actions{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:2px;}.committee-actions a{min-height:48px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(218,174,35,.44);border-radius:14px;color:#fff;text-decoration:none;font-weight:850;background:rgba(0,0,0,.12);}.committee-actions a:hover{background:rgba(218,174,35,.14);}.committee-hero-icon{width:84px;height:84px;}.committee-guidance-card{display:block!important;padding:20px!important;}.committee-guidance-card .guidance-icon{display:none!important;}.committee-guidance-card .guidance-copy{width:auto!important;max-width:none!important;}.committee-guidance-card h3,.committee-guidance-card p{max-width:none!important;white-space:normal!important;word-break:normal!important;}.admin-committee-avatar{width:54px;height:54px;border-radius:12px;object-fit:cover;border:2px solid rgba(218,174,35,.5);}@media(max-width:580px){.committee-card{grid-template-columns:82px 1fr;padding:15px;}.committee-photo{width:82px;height:82px;}.committee-card h3{font-size:1.35rem;}.committee-actions{grid-template-columns:1fr;}.committee-list{padding-left:12px;padding-right:12px;}}

/* ===== END committee-dynamic.css ===== */

/* ===== BEGIN premium-icons.css ===== */
/* =====================================================================
   VERSION 21 — GLOBAL PREMIUM ICON REGISTRY
   One visual icon system for every major app section and primary tab.
   ===================================================================== */

.premium-icon-host {
  position: relative;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}

.premium-registry-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  filter: drop-shadow(0 10px 14px rgba(0,0,0,.28));
  user-select: none;
  -webkit-user-drag: none;
}

/* Shared section icon treatment — mirrors the FAQ Help Centre style. */
.spotlight-icon.premium-icon-host,
.calendar-hero-icon.premium-icon-host,
.newsletter-hero-icon.premium-icon-host,
.milestone-trophy.premium-icon-host,
.admin-lock-icon.premium-icon-host,
.faq-hero-icon.premium-icon-host,
.premium-section-icon,
.committee-hero-premium-icon,
.committee-intro-icon.premium-icon-host {
  overflow: visible;
  color: inherit;
  border: 1px solid color-mix(in srgb, var(--gold) 52%, var(--border));
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.10), transparent 44%),
    linear-gradient(145deg,
      color-mix(in srgb, var(--green) 34%, var(--surface-raised)),
      color-mix(in srgb, var(--surface) 90%, var(--gold) 10%));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    0 14px 28px rgba(0,0,0,.24),
    0 0 0 1px color-mix(in srgb, var(--gold) 5%, transparent);
}

.spotlight-icon.premium-icon-host {
  width: 82px;
  height: 82px;
  padding: 3px;
  border-radius: 24px;
}
.spotlight-icon.premium-icon-host .premium-registry-image { width: 76px; height: 76px; }

.calendar-hero-icon.premium-icon-host {
  width: 82px;
  height: 82px;
  padding: 3px;
  border-radius: 24px;
}
.calendar-hero-icon.premium-icon-host .premium-registry-image { width: 75px; height: 75px; }

.newsletter-hero-top { grid-template-columns: 82px minmax(0,1fr); }
.newsletter-hero-icon.premium-icon-host {
  width: 82px;
  height: 82px;
  padding: 3px;
  border-radius: 24px;
}
.newsletter-hero-icon.premium-icon-host .premium-registry-image { width: 76px; height: 76px; }

.milestone-trophy.premium-icon-host {
  width: 88px;
  height: 88px;
  margin-bottom: 17px;
  padding: 2px;
  border-radius: 25px;
}
.milestone-trophy.premium-icon-host .premium-registry-image { width: 82px; height: 82px; }

.admin-lock-icon.premium-icon-host {
  width: 94px;
  height: 94px;
  padding: 3px;
  border-radius: 27px;
}
.admin-lock-icon.premium-icon-host .premium-registry-image { width: 86px; height: 86px; }

.faq-hero-icon.premium-icon-host {
  width: 94px;
  height: 94px;
  padding: 4px;
  border-radius: 27px;
}
.faq-hero-icon.premium-icon-host .premium-registry-image { width: 84px; height: 84px; }

/* Hero sections that previously had no visual identity icon. */
.has-premium-section-icon {
  position: relative;
  min-height: 88px;
  padding-left: 104px;
}
.premium-section-icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 88px;
  height: 88px;
  padding: 3px;
  border-radius: 25px;
}
.premium-section-icon .premium-registry-image { width: 81px; height: 81px; }

/* The notice copy now has its own visual identity but keeps the count badge. */
.notice-hero-copy.has-premium-section-icon { max-width: 500px; }

/* Resource and recipe hero copy remains aligned with the existing count blocks. */
.resource-hero > .has-premium-section-icon,
.recipe-hero > .has-premium-section-icon { min-width: 0; }

/* Photo Gallery: the former flat polaroid drawing is replaced by the supplied 3D icon. */
.gallery-hero-art.premium-icon-host {
  width: 150px;
  height: 128px;
  margin: -3px auto 8px;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.gallery-hero-art.premium-icon-host .premium-registry-image {
  width: 142px;
  height: 142px;
  filter: drop-shadow(0 16px 18px rgba(0,0,0,.33));
}

/* Committee hero and contact guidance. */
.committee-hero-copy.has-committee-premium-icon {
  padding-left: 92px;
  min-height: 78px;
}
.committee-hero-premium-icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 78px;
  height: 78px;
  padding: 2px;
  border-radius: 22px;
  background: rgba(8,23,14,.72);
  backdrop-filter: blur(8px);
}
.committee-hero-premium-icon .premium-registry-image { width: 72px; height: 72px; }
.committee-intro-icon.premium-icon-host {
  width: 58px;
  height: 58px;
  padding: 2px;
  border-radius: 18px;
}
.committee-intro-icon.premium-icon-host .premium-registry-image { width: 53px; height: 53px; }

/* Generic future sections also inherit the correct registered icon. */
.status-icon.premium-icon-host {
  width: 118px;
  height: 118px;
  padding: 4px;
  border-radius: 32px;
  border: 1px solid color-mix(in srgb, var(--gold) 52%, var(--border));
  background: linear-gradient(145deg, color-mix(in srgb,var(--green) 32%,var(--surface-raised)), var(--surface));
  box-shadow: var(--card-shadow);
}
.status-icon.premium-icon-host .premium-registry-image { width: 108px; height: 108px; }

/* Primary navigation now uses the same supplied visual assets. */
.tab-icon:has(.premium-tab-icon) {
  width: 44px;
  height: 44px;
  overflow: visible;
  background: transparent;
  box-shadow: none;
}
.premium-tab-icon {
  width: 42px;
  height: 42px;
}
.premium-tab-icon .premium-registry-image {
  width: 40px;
  height: 40px;
  filter: drop-shadow(0 5px 7px rgba(0,0,0,.3));
  
}
.tabbar button.active .premium-tab-icon .premium-registry-image {
  transform: translateY(-2px) scale(1.09);
  filter: drop-shadow(0 8px 10px rgba(0,0,0,.34));
}
.tabbar button.active .tab-icon:has(.premium-tab-icon) {
  background: linear-gradient(145deg,rgba(232,190,86,.18),rgba(100,66,12,.14));
  box-shadow: inset 0 0 0 1px rgba(242,205,116,.28),0 0 20px rgba(219,170,61,.08);
}

/* Keep touch targets and copy readable on small phones. */
@media (max-width: 520px) {
  .spotlight-icon.premium-icon-host,
  .calendar-hero-icon.premium-icon-host,
  .newsletter-hero-icon.premium-icon-host {
    width: 72px;
    height: 72px;
    border-radius: 21px;
  }
  .spotlight-icon.premium-icon-host .premium-registry-image,
  .calendar-hero-icon.premium-icon-host .premium-registry-image,
  .newsletter-hero-icon.premium-icon-host .premium-registry-image {
    width: 66px;
    height: 66px;
  }
  .newsletter-hero-top { grid-template-columns: 72px minmax(0,1fr); gap: 12px; }
  .has-premium-section-icon { padding-left: 88px; min-height: 74px; }
  .premium-section-icon { width: 74px; height: 74px; border-radius: 21px; }
  .premium-section-icon .premium-registry-image { width: 68px; height: 68px; }
  .notice-hero { align-items: flex-end; }
  .notice-hero-count { min-width: 78px; }
  .gallery-hero-art.premium-icon-host { width: 132px; height: 112px; }
  .gallery-hero-art.premium-icon-host .premium-registry-image { width: 126px; height: 126px; }
  .committee-hero-copy.has-committee-premium-icon { padding-left: 78px; }
  .committee-hero-premium-icon { width: 66px; height: 66px; border-radius: 19px; }
  .committee-hero-premium-icon .premium-registry-image { width: 61px; height: 61px; }
  .tab-icon:has(.premium-tab-icon), .premium-tab-icon { width: 38px; height: 38px; }
  .premium-tab-icon .premium-registry-image { width: 36px; height: 36px; }
}

@media (max-width: 390px) {
  .notice-hero,
  .resource-hero,
  .recipe-hero { gap: 10px; }
  .has-premium-section-icon { padding-left: 78px; min-height: 66px; }
  .premium-section-icon { width: 65px; height: 65px; border-radius: 19px; }
  .premium-section-icon .premium-registry-image { width: 60px; height: 60px; }
  .newsletter-hero-top { grid-template-columns: 66px minmax(0,1fr); }
  .newsletter-hero-icon.premium-icon-host { width: 66px; height: 66px; }
  .newsletter-hero-icon.premium-icon-host .premium-registry-image { width: 61px; height: 61px; }
}

/* ===== END premium-icons.css ===== */

/* ===== BEGIN mobile-fixes.css ===== */
/* Version 30 mobile reliability, touch and performance fixes */
.committee-hero-picture {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}
.committee-hero-picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.committee-hero-picture + .committee-hero-overlay,
.committee-hero-picture ~ .committee-hero-content { position: relative; z-index: 2; }

.settings-app-actions,
.admin-intention-tools {
  display: grid;
  gap: .75rem;
}
.settings-app-actions { grid-template-columns: repeat(2, minmax(0,1fr)); margin-top: 1rem; }
.settings-install-button,
.settings-update-button,
.admin-intention-tools button,
.admin-intention-tools select {
  min-height: 48px;
}
.settings-install-help { margin: .75rem 0 0; opacity: .8; line-height: 1.45; }
.admin-intention-tools {
  grid-template-columns: minmax(0,2fr) minmax(0,1fr) auto;
  margin: .75rem 0 1rem;
  padding: .8rem;
  border: 1px solid var(--line, rgba(214,170,45,.45));
  border-radius: 18px;
  background: rgba(9,48,29,.8);
}
.admin-intention-tools[hidden] { display: none !important; }
.admin-intention-tools select,
.admin-intention-tools button {
  width: 100%;
  border-radius: 13px;
}
.admin-record-actions { flex-wrap: wrap; }
.admin-record-actions .danger.permanent { border-color: #d68a70; color: #ffd7ca; }

.recipe-page-scroll {
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  max-height: calc(100dvh - 72px);
}
.recipe-page-scroll img {
  display: block;
  width: min(100%, 1055px);
  height: auto;
  margin: 0 auto;
}

@media (max-width: 720px), (pointer: coarse) {
  html {  }
  html, body { overscroll-behavior-y: contain; }
  body { touch-action: pan-y; }
  button, a, input, select, textarea, [role="button"], .tab {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  button, a, .tab { cursor: pointer; }

  /* Reduce expensive compositing that caused jerky scrolling on lower-memory phones. */
  .tabbar, .theme-toggle, .clock, .modal-panel, .gallery-viewer-controls,
  .committee-hero, .screen-header, .admin-modal-panel {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  .tabbar {
    background: linear-gradient(180deg, #0b4529 0%, #06351f 100%) !important;
    box-shadow: 0 -3px 16px rgba(0,0,0,.28) !important;
    z-index: 1000;
  }
  .tabbar .tab {
    min-height: 68px;
    pointer-events: auto;
    user-select: none;
  }
  .tabbar img { filter: none !important; }


  .menu-card, .admin-record-card, .newsletter-card, .gallery-album-card,
  .notice-card, .recipe-card, .faq-item, .milestone-progress-card {
    box-shadow: none !important;
  }
  .admin-record-card, .newsletter-card, .gallery-album-card, .notice-card,
  .recipe-card, .faq-item {
    content-visibility: auto;
    contain-intrinsic-size: 160px;
  }
  .menu-card img, .premium-registry-image { transform: translateZ(0); }

  .settings-app-actions,
  .admin-intention-tools { grid-template-columns: 1fr; }
  .admin-record-actions button { min-height: 44px; flex: 1 1 112px; }

  .committee-hero { min-height: 330px; }
  .committee-hero-picture img { object-position: center top; }

  .recipe-page-modal .recipe-page-panel,
  .recipe-page-panel {
    width: 100vw !important;
    height: 100dvh !important;
    max-width: none !important;
    max-height: none !important;
    border-radius: 0 !important;
  }
  .recipe-page-scroll { max-height: calc(100dvh - 64px) !important; }
  .recipe-page-scroll img { max-width: 100%; }

  .install-banner { z-index: 1200; }
}

@media (max-width: 720px), (pointer: coarse) {
  body * {
    
    
    
    
  }
  .notices-page-header { position: relative !important; top: auto !important; }
  .faq-image-backdrop, .gallery-backdrop, .gallery-viewer-backdrop,
  .notice-modal-backdrop, .resource-email-backdrop, .recipe-modal-backdrop,
  .recipe-page-backdrop, .merch-backdrop, .admin-modal-backdrop {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  .menu-card img, .home-card img, .premium-registry-image { filter: none !important; }
}
.admin-intention-tools > small { grid-column: 1 / -1; opacity: .75; }

/* ===== END mobile-fixes.css ===== */

/* ===== BEGIN v31-communications.css ===== */
/* CCSA Natal Midlands v31 communications, intention, settings and park-rating additions. */
.intention-deadline-banner {
  grid-column: 1 / -1;
  display: grid;
  gap: 5px;
  padding: 13px 14px;
  border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--gold) 10%, var(--panel));
  color: var(--cream);
}
.intention-deadline-banner strong { color: var(--gold-light); font-family: var(--font-display); font-size: 17px; }
.intention-deadline-banner span { font-size: 10px; line-height: 1.45; }
.intention-deadline-banner span b { color: var(--cream); }
.intention-deadline-banner small { color: var(--muted); font-size: 9px; line-height: 1.45; }
.intention-deadline-banner.is-closed { border-color: rgba(220,90,75,.55); background: rgba(112,30,24,.28); }
.intention-deadline-banner.is-closed strong { color: #ffb8ac; }

.intention-thank-you-modal {
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: grid;
  align-items: end;
  opacity: 0;
  pointer-events: none;
  
}
.intention-thank-you-modal.open { opacity: 1; pointer-events: auto; }
.intention-thank-you-backdrop { position: absolute; inset: 0; border: 0; background: rgba(12,8,5,.76); backdrop-filter: blur(4px); }
.intention-thank-you-panel {
  position: relative;
  width: min(100%, 600px);
  max-height: min(92dvh, 920px);
  margin: 0 auto;
  padding: 28px 20px calc(24px + env(safe-area-inset-bottom));
  overflow-y: auto;
  border-radius: 24px 24px 0 0;
  border: 1px solid rgba(190,151,83,.38);
  background: var(--panel);
  box-shadow: 0 -24px 60px rgba(0,0,0,.42);
  transform: translateY(32px);
  
}
.intention-thank-you-modal.open .intention-thank-you-panel { transform: translateY(0); }
.intention-thank-you-close { position: absolute; top: 10px; right: 12px; width: 38px; height: 38px; border: 0; border-radius: 50%; background: rgba(255,255,255,.08); color: var(--cream); font-size: 25px; }
#intentionThankYouContent { display: grid; gap: 14px; text-align: center; }
.intention-thanks-crest img { width: 82px; height: 82px; object-fit: contain; }
#intentionThankYouContent h3 { margin: 0; color: var(--cream); font: 700 29px/1.05 var(--font-display); }
#intentionThankYouContent > p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.intention-confirmation-reference { display: grid; gap: 3px; padding: 12px; border-radius: 14px; background: rgba(255,255,255,.055); }
.intention-confirmation-reference span { color: var(--muted); font-size: 8px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.intention-confirmation-reference strong { color: var(--gold-light); font-size: 18px; letter-spacing: .04em; }
.intention-confirmation-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; text-align: left; }
.intention-confirmation-grid div { display: grid; gap: 4px; min-height: 65px; padding: 11px; border: 1px solid rgba(255,255,255,.08); border-radius: 12px; background: rgba(255,255,255,.025); }
.intention-confirmation-grid span { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.intention-confirmation-grid strong { color: var(--cream); font-size: 10px; line-height: 1.35; }
.intention-bank-card { padding: 16px; border-radius: 15px; background: #f6f1e8; color: #35291e; text-align: center; }
.intention-bank-card > span { display: block; color: #d84f26; font-size: 9px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.intention-bank-card > strong { display: block; margin: 4px 0; color: #211a13; font-family: var(--font-display); font-size: 17px; }
.intention-bank-card p { margin: 7px 0 0; color: #211a13; font-size: 10px; line-height: 1.55; }
.intention-bank-card b { color: #211a13; }
.intention-programme-link { display: block; padding: 12px 14px; border-radius: 12px; background: var(--gold); color: #24180f; font-size: 10px; font-weight: 900; text-decoration: none; }
.intention-email-result { padding: 10px 12px; border-radius: 11px; font-size: 9px !important; }
.intention-email-result.success { background: rgba(73,145,99,.18); color: #b8e8c5 !important; }
.intention-email-result.warning { background: rgba(190,122,48,.18); color: #f1ce9f !important; }
.intention-email-result.info { background: rgba(75,119,170,.18); color: #c5d8ee !important; }

.settings-message { margin-top: 10px; padding: 10px 12px; border-radius: 10px; font-size: 10px; line-height: 1.45; }
.settings-message.success { background: rgba(63,138,91,.18); color: #bce8c8; }
.settings-message.error { background: rgba(180,61,53,.18); color: #ffc1b9; }
.settings-message.info { background: rgba(73,112,155,.18); color: #cbdbee; }
.settings-push-status { margin: 12px 0 4px; padding: 10px 12px; border-radius: 11px; font-size: 10px; line-height: 1.45; }
.settings-push-status.success { background: rgba(63,138,91,.18); color: #bce8c8; }
.settings-push-status.error { background: rgba(180,61,53,.18); color: #ffc1b9; }
.settings-push-status.info { background: rgba(255,255,255,.05); color: var(--muted); }
.settings-profile-load, .settings-profile-submit {
  width: 100%;
  min-height: 45px;
  border: 0;
  border-radius: 12px;
  background: var(--gold);
  color: #24180f;
  font-weight: 900;
}
.settings-profile-change { margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.09); }
.settings-profile-change textarea { width: 100%; resize: vertical; }
.settings-profile-submit { margin-top: 12px; }
.settings-actions button:disabled, .settings-profile-load:disabled, .settings-profile-submit:disabled { opacity: .55; }

.park-rating-screen { padding: 0 14px 130px; }
.park-rating-page-header { margin-left: -14px !important; margin-right: -14px !important; }
.park-rating-hero { margin: 14px 0; padding: 18px; border-radius: 18px; background: var(--panel); border: 1px solid rgba(190,151,83,.2); }
.park-rating-hero h3 { margin: 4px 0 7px; color: var(--cream); font-family: var(--font-display); font-size: 24px; }
.park-rating-hero p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.park-rating-frame-wrap { position: relative; min-height: 780px; overflow: hidden; border-radius: 18px; background: #fff; box-shadow: 0 15px 40px rgba(0,0,0,.24); }
.park-rating-frame-wrap iframe { width: 100%; min-height: 1060px; border: 0; opacity: 0;  }
.park-rating-frame-wrap iframe.is-loaded { opacity: 1; }
.park-rating-loading { position: absolute; inset: 0; display: grid; place-items: center; color: #5a4b3b; font-size: 12px; z-index: 1; }
.park-rating-open { display: block; margin-top: 12px; padding: 13px; border-radius: 12px; background: var(--gold); color: #24180f; text-align: center; text-decoration: none; font-size: 10px; font-weight: 900; }

.admin-quick-service { display: flex; gap: 14px; align-items: center; justify-content: space-between; margin: 12px 0; padding: 14px; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); }
.admin-quick-service div { display: grid; gap: 4px; }
.admin-quick-service strong { color: var(--cream); font-size: 12px; }
.admin-quick-service span { color: var(--muted); font-size: 9px; line-height: 1.45; }
.admin-quick-service a { flex: 0 0 auto; padding: 10px 12px; border-radius: 10px; background: var(--gold); color: #24180f; text-decoration: none; font-size: 9px; font-weight: 900; }
.admin-notification-tools { display: grid; gap: 10px; margin-bottom: 12px; padding: 14px; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); }
.admin-notification-tools > div:first-child { display: grid; gap: 3px; }
.admin-notification-tools strong { color: var(--cream); font-size: 12px; }
.admin-notification-tools small { color: var(--muted); font-size: 9px; }
.admin-notification-template-buttons { display: flex; gap: 7px; flex-wrap: wrap; }
.admin-notification-template-buttons button { min-height: 36px; padding: 8px 10px; border: 1px solid rgba(190,151,83,.35); border-radius: 9px; background: rgba(190,151,83,.08); color: var(--cream); font-size: 9px; font-weight: 800; }
.admin-record-card .admin-request-changes { display: grid; gap: 2px; margin-top: 5px; color: var(--muted); font-size: 9px; }
.admin-record-card .admin-delivery-chip { display: inline-flex; width: fit-content; margin-top: 6px; padding: 4px 7px; border-radius: 999px; background: rgba(255,255,255,.06); color: var(--gold-light); font-size: 8px; font-weight: 800; }

@media (min-width: 700px) {
  .intention-thank-you-modal { align-items: center; padding: 24px; }
  .intention-thank-you-panel { border-radius: 24px; }
  .park-rating-screen { max-width: 900px; margin: 0 auto; }
  .park-rating-frame-wrap iframe { min-height: 1200px; }
}
@media (max-width: 520px) {
  .admin-quick-service { align-items: stretch; flex-direction: column; }
  .admin-quick-service a { text-align: center; }
  .intention-confirmation-grid { grid-template-columns: 1fr; }
}

/* ===== END v31-communications.css ===== */

/* ===== v33 static interface performance layer ===== */
html, body { scroll-behavior: auto !important; }

/* ===== v33 functional text-size scaling ===== */
html.text-size-small { font-size: 14px; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html.text-size-medium { font-size: 16px; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html.text-size-large { font-size: 18px; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html.text-size-small .install-banner{font-size:11.375px !important;}
html.text-size-large .install-banner{font-size:14.625px !important;}
html.text-size-small .install-banner button{font-size:10.5px !important;}
html.text-size-large .install-banner button{font-size:13.5px !important;}
html.text-size-small .install-banner .dismiss{font-size:18.375px !important;}
html.text-size-large .install-banner .dismiss{font-size:23.625px !important;}
html.text-size-small .eyebrow{font-size:8.75px !important;}
html.text-size-large .eyebrow{font-size:11.25px !important;}
html.text-size-small .hero h1{font-size:clamp(22.75px, 6.3vw, 29.75px) !important;}
html.text-size-large .hero h1{font-size:clamp(29.25px, 8.1vw, 38.25px) !important;}
html.text-size-small .tagline{font-size:10.5px !important;}
html.text-size-large .tagline{font-size:13.5px !important;}
html.text-size-small .clock .date{font-size:9.625px !important;}
html.text-size-large .clock .date{font-size:12.375px !important;}
html.text-size-small .clock .time{font-size:17.5px !important;}
html.text-size-large .clock .time{font-size:22.5px !important;}
html.text-size-small .section-kicker{font-size:7.875px !important;}
html.text-size-large .section-kicker{font-size:10.125px !important;}
html.text-size-small .section-heading h2{font-size:15.75px !important;}
html.text-size-large .section-heading h2{font-size:20.25px !important;}
html.text-size-small .tile .label{font-size:13.125px !important;}
html.text-size-large .tile .label{font-size:16.875px !important;}
html.text-size-small .tile .sub{font-size:9.625px !important;}
html.text-size-large .tile .sub{font-size:12.375px !important;}
html.text-size-small .mini-arrow{font-size:17.5px !important;}
html.text-size-large .mini-arrow{font-size:22.5px !important;}
html.text-size-small .tile.featured .tile-overline{font-size:7.875px !important;}
html.text-size-large .tile.featured .tile-overline{font-size:10.125px !important;}
html.text-size-small .tile.featured .label{font-size:16.625px !important;}
html.text-size-large .tile.featured .label{font-size:21.375px !important;}
html.text-size-small .tile.featured .sub{font-size:10.5px !important;}
html.text-size-large .tile.featured .sub{font-size:13.5px !important;}
html.text-size-small .tile-wide .label{font-size:12.25px !important;}
html.text-size-large .tile-wide .label{font-size:15.75px !important;}
html.text-size-small .locked-pill{font-size:8.75px !important;}
html.text-size-large .locked-pill{font-size:11.25px !important;}
html.text-size-small .screen-kicker{font-size:7.875px !important;}
html.text-size-large .screen-kicker{font-size:10.125px !important;}
html.text-size-small .screen-header h2{font-size:21px !important;}
html.text-size-large .screen-header h2{font-size:27px !important;}
html.text-size-small .status-pill{font-size:7.875px !important;}
html.text-size-large .status-pill{font-size:10.125px !important;}
html.text-size-small .coming-soon h3{font-size:18.375px !important;}
html.text-size-large .coming-soon h3{font-size:23.625px !important;}
html.text-size-small .coming-soon p{font-size:11.375px !important;}
html.text-size-large .coming-soon p{font-size:14.625px !important;}
html.text-size-small .sheet-kicker{font-size:7.875px !important;}
html.text-size-large .sheet-kicker{font-size:10.125px !important;}
html.text-size-small .theme-sheet h3{font-size:19.25px !important;}
html.text-size-large .theme-sheet h3{font-size:24.75px !important;}
html.text-size-small .theme-sheet .hint{font-size:10.5px !important;}
html.text-size-large .theme-sheet .hint{font-size:13.5px !important;}
html.text-size-small .theme-option .name{font-size:11.375px !important;}
html.text-size-large .theme-option .name{font-size:14.625px !important;}
html.text-size-small .theme-option .desc{font-size:9.625px !important;}
html.text-size-large .theme-option .desc{font-size:12.375px !important;}
html.text-size-small .option-check{font-size:11.375px !important;}
html.text-size-large .option-check{font-size:14.625px !important;}
html.text-size-small .tabbar button{font-size:8.75px !important;}
html.text-size-large .tabbar button{font-size:11.25px !important;}
@media (max-width: 370px){
html.text-size-small .tile .label{font-size:12.25px !important;}
html.text-size-large .tile .label{font-size:15.75px !important;}
html.text-size-small .tile.featured .label{font-size:15.75px !important;}
html.text-size-large .tile.featured .label{font-size:20.25px !important;}
}
html.text-size-small .spotlight-label,html.text-size-small .spotlight-position{font-size:7.875px !important;}
html.text-size-large .spotlight-label,html.text-size-large .spotlight-position{font-size:10.125px !important;}
html.text-size-small .spotlight-type{font-size:7.875px !important;}
html.text-size-large .spotlight-type{font-size:10.125px !important;}
html.text-size-small .spotlight-copy h3{font-size:20.125px !important;}
html.text-size-large .spotlight-copy h3{font-size:25.875px !important;}
html.text-size-small .spotlight-copy p{font-size:10.5px !important;}
html.text-size-large .spotlight-copy p{font-size:13.5px !important;}
html.text-size-small .countdown strong{font-size:20.125px !important;}
html.text-size-large .countdown strong{font-size:25.875px !important;}
html.text-size-small .countdown span{font-size:7px !important;}
html.text-size-large .countdown span{font-size:9px !important;}
html.text-size-small .countdown-message strong{font-size:12.25px !important;}
html.text-size-large .countdown-message strong{font-size:15.75px !important;}
html.text-size-small .countdown-message span{font-size:8.75px !important;}
html.text-size-large .countdown-message span{font-size:11.25px !important;}
html.text-size-small .rally-filter{font-size:8.75px !important;}
html.text-size-large .rally-filter{font-size:11.25px !important;}
html.text-size-small .rally-filter span{font-size:7.875px !important;}
html.text-size-large .rally-filter span{font-size:10.125px !important;}
html.text-size-small .rally-list-heading h3{font-size:19.25px !important;}
html.text-size-large .rally-list-heading h3{font-size:24.75px !important;}
html.text-size-small .rally-total{font-size:8.75px !important;}
html.text-size-large .rally-total{font-size:11.25px !important;}
html.text-size-small .rally-date-block strong{font-size:15.75px !important;}
html.text-size-large .rally-date-block strong{font-size:20.25px !important;}
html.text-size-small .rally-date-block span{font-size:7.875px !important;}
html.text-size-large .rally-date-block span{font-size:10.125px !important;}
html.text-size-small .rally-type{font-size:7px !important;}
html.text-size-large .rally-type{font-size:9px !important;}
html.text-size-small .rally-status{font-size:7px !important;}
html.text-size-large .rally-status{font-size:9px !important;}
html.text-size-small .rally-venue{font-size:14.875px !important;}
html.text-size-large .rally-venue{font-size:19.125px !important;}
html.text-size-small .rally-marshal{font-size:8.75px !important;}
html.text-size-large .rally-marshal{font-size:11.25px !important;}
html.text-size-small .rally-empty{font-size:10.5px !important;}
html.text-size-large .rally-empty{font-size:13.5px !important;}
html.text-size-small .programme-note{font-size:8.75px !important;}
html.text-size-large .programme-note{font-size:11.25px !important;}
html.text-size-small .rally-detail-close{font-size:20.125px !important;}
html.text-size-large .rally-detail-close{font-size:25.875px !important;}
html.text-size-small .detail-type{font-size:7.875px !important;}
html.text-size-large .detail-type{font-size:10.125px !important;}
html.text-size-small .detail-hero h3{font-size:25.375px !important;}
html.text-size-large .detail-hero h3{font-size:32.625px !important;}
html.text-size-small .detail-hero p{font-size:11.375px !important;}
html.text-size-large .detail-hero p{font-size:14.625px !important;}
html.text-size-small .detail-row small{font-size:7px !important;}
html.text-size-large .detail-row small{font-size:9px !important;}
html.text-size-small .detail-row strong{font-size:11.375px !important;}
html.text-size-large .detail-row strong{font-size:14.625px !important;}
html.text-size-small .detail-status{font-size:8.75px !important;}
html.text-size-large .detail-status{font-size:11.25px !important;}
@media (max-width: 370px){
html.text-size-small .spotlight-copy h3{font-size:17.5px !important;}
html.text-size-large .spotlight-copy h3{font-size:22.5px !important;}
html.text-size-small .rally-venue{font-size:14px !important;}
html.text-size-large .rally-venue{font-size:18px !important;}
}
html.text-size-small .milestone-overline{font-size:7.875px !important;}
html.text-size-large .milestone-overline{font-size:10.125px !important;}
html.text-size-small .milestone-lookup-card h3{font-size:clamp(22.75px, 6.125vw, 29.75px) !important;}
html.text-size-large .milestone-lookup-card h3{font-size:clamp(29.25px, 7.875vw, 38.25px) !important;}
html.text-size-small .milestone-intro{font-size:11.375px !important;}
html.text-size-large .milestone-intro{font-size:14.625px !important;}
html.text-size-small .milestone-field > span:first-child{font-size:8.75px !important;}
html.text-size-large .milestone-field > span:first-child{font-size:11.25px !important;}
html.text-size-small .milestone-input-wrap input{font-size:14px !important;}
html.text-size-large .milestone-input-wrap input{font-size:18px !important;}
html.text-size-small .milestone-submit{font-size:12.25px !important;}
html.text-size-large .milestone-submit{font-size:15.75px !important;}
html.text-size-small .milestone-message{font-size:9.625px !important;}
html.text-size-large .milestone-message{font-size:12.375px !important;}
html.text-size-small .milestone-privacy{font-size:7.875px !important;}
html.text-size-large .milestone-privacy{font-size:10.125px !important;}
html.text-size-small .member-result-eyebrow{font-size:7.875px !important;}
html.text-size-large .member-result-eyebrow{font-size:10.125px !important;}
html.text-size-small .member-result-hero h3{font-size:clamp(24.5px, 6.5625vw, 33.25px) !important;}
html.text-size-large .member-result-hero h3{font-size:clamp(31.5px, 8.4375vw, 42.75px) !important;}
html.text-size-small .member-total-lockup strong{font-size:33.25px !important;}
html.text-size-large .member-total-lockup strong{font-size:42.75px !important;}
html.text-size-small .member-total-lockup span{font-size:7.875px !important;}
html.text-size-large .member-total-lockup span{font-size:10.125px !important;}
html.text-size-small .milestone-summary span{font-size:7px !important;}
html.text-size-large .milestone-summary span{font-size:9px !important;}
html.text-size-small .milestone-summary strong{font-size:23.625px !important;}
html.text-size-large .milestone-summary strong{font-size:30.375px !important;}
html.text-size-small .milestone-progress-heading h3{font-size:19.25px !important;}
html.text-size-large .milestone-progress-heading h3{font-size:24.75px !important;}
html.text-size-small .milestone-category-label{font-size:7.875px !important;}
html.text-size-large .milestone-category-label{font-size:10.125px !important;}
html.text-size-small .milestone-category-copy strong{font-size:24.5px !important;}
html.text-size-large .milestone-category-copy strong{font-size:31.5px !important;}
html.text-size-small .milestone-achieved-badge{font-size:9.625px !important;}
html.text-size-large .milestone-achieved-badge{font-size:12.375px !important;}
html.text-size-small .milestone-status-line span{font-size:7.875px !important;}
html.text-size-large .milestone-status-line span{font-size:10.125px !important;}
html.text-size-small .milestone-status-line strong{font-size:8.75px !important;}
html.text-size-large .milestone-status-line strong{font-size:11.25px !important;}
html.text-size-small .milestone-progress-footer{font-size:7px !important;}
html.text-size-large .milestone-progress-footer{font-size:9px !important;}
html.text-size-small .milestone-reset{font-size:10.5px !important;}
html.text-size-large .milestone-reset{font-size:13.5px !important;}
html.text-size-small .milestone-data-note{font-size:7.875px !important;}
html.text-size-large .milestone-data-note{font-size:10.125px !important;}
@media (max-width: 370px){
html.text-size-small .milestone-summary span{font-size:6.125px !important;}
html.text-size-large .milestone-summary span{font-size:7.875px !important;}
}
html.text-size-small .celebration-kicker{font-size:7px !important;}
html.text-size-large .celebration-kicker{font-size:9px !important;}
html.text-size-small .celebration-copy h2{font-size:16.625px !important;}
html.text-size-large .celebration-copy h2{font-size:21.375px !important;}
html.text-size-small .celebration-person small{font-size:6.125px !important;}
html.text-size-large .celebration-person small{font-size:7.875px !important;}
html.text-size-small .celebration-person strong{font-size:9.625px !important;}
html.text-size-large .celebration-person strong{font-size:12.375px !important;}
html.text-size-small .admin-setup-card strong{font-size:12.25px !important;}
html.text-size-large .admin-setup-card strong{font-size:15.75px !important;}
html.text-size-small .admin-setup-card p{font-size:9.625px !important;}
html.text-size-large .admin-setup-card p{font-size:12.375px !important;}
html.text-size-small .admin-overline{font-size:7px !important;}
html.text-size-large .admin-overline{font-size:9px !important;}
html.text-size-small .admin-login-card h3,html.text-size-small .admin-welcome h3,html.text-size-small .admin-modal-panel h3{font-size:19.25px !important;}
html.text-size-large .admin-login-card h3,html.text-size-large .admin-welcome h3,html.text-size-large .admin-modal-panel h3{font-size:24.75px !important;}
html.text-size-small .admin-login-card > p{font-size:9.625px !important;}
html.text-size-large .admin-login-card > p{font-size:12.375px !important;}
html.text-size-small .admin-login-form label,html.text-size-small .admin-record-form label{font-size:7.875px !important;}
html.text-size-large .admin-login-form label,html.text-size-large .admin-record-form label{font-size:10.125px !important;}
html.text-size-small .admin-login-form input,html.text-size-small .admin-record-form input,html.text-size-small .admin-record-form select,html.text-size-small .admin-search input{font-size:10.5px !important;}
html.text-size-large .admin-login-form input,html.text-size-large .admin-record-form input,html.text-size-large .admin-record-form select,html.text-size-large .admin-search input{font-size:13.5px !important;}
html.text-size-small .admin-primary-btn,html.text-size-small .admin-secondary-btn,html.text-size-small .admin-add-btn,html.text-size-small .admin-signout{font-size:9.625px !important;}
html.text-size-large .admin-primary-btn,html.text-size-large .admin-secondary-btn,html.text-size-large .admin-add-btn,html.text-size-large .admin-signout{font-size:12.375px !important;}
html.text-size-small .admin-message{font-size:8.75px !important;}
html.text-size-large .admin-message{font-size:11.25px !important;}
html.text-size-small .admin-welcome h3{font-size:16.625px !important;}
html.text-size-large .admin-welcome h3{font-size:21.375px !important;}
html.text-size-small .admin-stats span{font-size:6.125px !important;}
html.text-size-large .admin-stats span{font-size:7.875px !important;}
html.text-size-small .admin-stats strong{font-size:20.125px !important;}
html.text-size-large .admin-stats strong{font-size:25.875px !important;}
html.text-size-small .admin-tabs button{font-size:7.875px !important;}
html.text-size-large .admin-tabs button{font-size:10.125px !important;}
html.text-size-small .admin-add-btn span{font-size:14px !important;}
html.text-size-large .admin-add-btn span{font-size:18px !important;}
html.text-size-small .admin-record-number{font-size:7px !important;}
html.text-size-large .admin-record-number{font-size:9px !important;}
html.text-size-small .admin-record-main strong{font-size:10.5px !important;}
html.text-size-large .admin-record-main strong{font-size:13.5px !important;}
html.text-size-small .admin-record-main small{font-size:7px !important;}
html.text-size-large .admin-record-main small{font-size:9px !important;}
html.text-size-small .admin-count-pills span{font-size:7px !important;}
html.text-size-large .admin-count-pills span{font-size:9px !important;}
html.text-size-small .admin-record-actions button{font-size:7px !important;}
html.text-size-large .admin-record-actions button{font-size:9px !important;}
html.text-size-small .admin-loading,html.text-size-small .admin-empty{font-size:8.75px !important;}
html.text-size-large .admin-loading,html.text-size-large .admin-empty{font-size:11.25px !important;}
html.text-size-small .admin-modal-close{font-size:19.25px !important;}
html.text-size-large .admin-modal-close{font-size:24.75px !important;}
html.text-size-small .admin-check span{font-size:8.75px !important;}
html.text-size-large .admin-check span{font-size:11.25px !important;}
html.text-size-small .admin-field-group-title{font-size:7px !important;}
html.text-size-large .admin-field-group-title{font-size:9px !important;}
html.text-size-small .committee-overline{font-size:7px !important;}
html.text-size-large .committee-overline{font-size:9px !important;}
html.text-size-small .committee-hero-copy h3{font-size:26.25px !important;}
html.text-size-large .committee-hero-copy h3{font-size:33.75px !important;}
html.text-size-small .committee-hero-copy p{font-size:8.75px !important;}
html.text-size-large .committee-hero-copy p{font-size:11.25px !important;}
html.text-size-small .committee-hero-count{font-size:7px !important;}
html.text-size-large .committee-hero-count{font-size:9px !important;}
html.text-size-small .committee-hero-count strong{font-size:11.375px !important;}
html.text-size-large .committee-hero-count strong{font-size:14.625px !important;}
html.text-size-small .committee-intro strong{font-size:12.25px !important;}
html.text-size-large .committee-intro strong{font-size:15.75px !important;}
html.text-size-small .committee-intro p{font-size:7.875px !important;}
html.text-size-large .committee-intro p{font-size:10.125px !important;}
html.text-size-small .committee-role{font-size:7px !important;}
html.text-size-large .committee-role{font-size:9px !important;}
html.text-size-small .committee-card-copy h3{font-size:17.5px !important;}
html.text-size-large .committee-card-copy h3{font-size:22.5px !important;}
html.text-size-small .committee-contact-line{font-size:7.875px !important;}
html.text-size-large .committee-contact-line{font-size:10.125px !important;}
html.text-size-small .committee-action{font-size:7px !important;}
html.text-size-large .committee-action{font-size:9px !important;}
html.text-size-small .committee-payment-heading h3{font-size:17.5px !important;}
html.text-size-large .committee-payment-heading h3{font-size:22.5px !important;}
html.text-size-small .committee-payment-note strong{font-size:8.75px !important;}
html.text-size-large .committee-payment-note strong{font-size:11.25px !important;}
html.text-size-small .committee-payment-note p{font-size:7.875px !important;}
html.text-size-large .committee-payment-note p{font-size:10.125px !important;}
html.text-size-small .committee-bank-grid dt{font-size:6.125px !important;}
html.text-size-large .committee-bank-grid dt{font-size:7.875px !important;}
html.text-size-small .committee-bank-grid dd{font-size:8.75px !important;}
html.text-size-large .committee-bank-grid dd{font-size:11.25px !important;}
html.text-size-small .committee-copy-bank,html.text-size-small .committee-proof-email{font-size:7px !important;}
html.text-size-large .committee-copy-bank,html.text-size-large .committee-proof-email{font-size:9px !important;}
html.text-size-small .committee-copy-message{font-size:7px !important;}
html.text-size-large .committee-copy-message{font-size:9px !important;}
html.text-size-small .committee-update-note{font-size:7px !important;}
html.text-size-large .committee-update-note{font-size:9px !important;}
@media (max-width: 390px){
html.text-size-small .committee-hero-copy h3{font-size:23.625px !important;}
html.text-size-large .committee-hero-copy h3{font-size:30.375px !important;}
html.text-size-small .committee-card-copy h3{font-size:15.75px !important;}
html.text-size-large .committee-card-copy h3{font-size:20.25px !important;}
html.text-size-small .committee-contact-line{font-size:7px !important;}
html.text-size-large .committee-contact-line{font-size:9px !important;}
}
html.text-size-small .tile.visual-tile .label{font-size:13.125px !important;}
html.text-size-large .tile.visual-tile .label{font-size:16.875px !important;}
@media (max-width: 370px){
html.text-size-small .tile.visual-tile .label{font-size:12.25px !important;}
html.text-size-large .tile.visual-tile .label{font-size:15.75px !important;}
}
html.text-size-small .admin-record-form textarea{font-size:10.5px !important;}
html.text-size-large .admin-record-form textarea{font-size:13.5px !important;}
html.text-size-small .celebration-pin{font-size:6.125px !important;}
html.text-size-large .celebration-pin{font-size:7.875px !important;}
html.text-size-small .admin-dependent-row > strong{font-size:8.75px !important;}
html.text-size-large .admin-dependent-row > strong{font-size:11.25px !important;}
html.text-size-small .committee-intro strong{font-size:15.75px !important;}
html.text-size-large .committee-intro strong{font-size:20.25px !important;}
html.text-size-small .committee-intro p{font-size:11.375px !important;}
html.text-size-large .committee-intro p{font-size:14.625px !important;}
html.text-size-small .newsletter-hero .newsletter-overline,html.text-size-small .newsletter-card-overline{font-size:7px !important;}
html.text-size-large .newsletter-hero .newsletter-overline,html.text-size-large .newsletter-card-overline{font-size:9px !important;}
html.text-size-small .newsletter-hero h3{font-size:21px !important;}
html.text-size-large .newsletter-hero h3{font-size:27px !important;}
html.text-size-small .newsletter-hero p{font-size:8.75px !important;}
html.text-size-large .newsletter-hero p{font-size:11.25px !important;}
html.text-size-small .newsletter-stat span{font-size:6.125px !important;}
html.text-size-large .newsletter-stat span{font-size:7.875px !important;}
html.text-size-small .newsletter-stat strong{font-size:10.5px !important;}
html.text-size-large .newsletter-stat strong{font-size:13.5px !important;}
html.text-size-small .newsletter-stat:first-child strong{font-size:18.375px !important;}
html.text-size-large .newsletter-stat:first-child strong{font-size:23.625px !important;}
html.text-size-small .newsletter-setup strong,html.text-size-small .newsletter-error strong{font-size:9.625px !important;}
html.text-size-large .newsletter-setup strong,html.text-size-large .newsletter-error strong{font-size:12.375px !important;}
html.text-size-small .newsletter-setup p,html.text-size-small .newsletter-error p,html.text-size-small .newsletter-offline-note p{font-size:7.875px !important;}
html.text-size-large .newsletter-setup p,html.text-size-large .newsletter-error p,html.text-size-large .newsletter-offline-note p{font-size:10.125px !important;}
html.text-size-small .newsletter-setup-actions a,html.text-size-small .newsletter-setup-actions button{font-size:7.875px !important;}
html.text-size-large .newsletter-setup-actions a,html.text-size-large .newsletter-setup-actions button{font-size:10.125px !important;}
html.text-size-small .newsletter-search input{font-size:10.5px !important;}
html.text-size-large .newsletter-search input{font-size:13.5px !important;}
html.text-size-small .newsletter-year-filter,html.text-size-small .newsletter-refresh{font-size:7.875px !important;}
html.text-size-large .newsletter-year-filter,html.text-size-large .newsletter-refresh{font-size:10.125px !important;}
html.text-size-small .newsletter-library-heading h3{font-size:17.5px !important;}
html.text-size-large .newsletter-library-heading h3{font-size:22.5px !important;}
html.text-size-small .newsletter-library-heading > span{font-size:7px !important;}
html.text-size-large .newsletter-library-heading > span{font-size:9px !important;}
html.text-size-small .newsletter-year-heading{font-size:14.875px !important;}
html.text-size-large .newsletter-year-heading{font-size:19.125px !important;}
html.text-size-small .newsletter-cover-fallback strong{font-size:12.25px !important;}
html.text-size-large .newsletter-cover-fallback strong{font-size:15.75px !important;}
html.text-size-small .newsletter-cover-fallback span{font-size:6.125px !important;}
html.text-size-large .newsletter-cover-fallback span{font-size:7.875px !important;}
html.text-size-small .newsletter-card h4{font-size:14.875px !important;}
html.text-size-large .newsletter-card h4{font-size:19.125px !important;}
html.text-size-small .newsletter-card-meta{font-size:7px !important;}
html.text-size-large .newsletter-card-meta{font-size:9px !important;}
html.text-size-small .newsletter-action{font-size:7px !important;}
html.text-size-large .newsletter-action{font-size:9px !important;}
html.text-size-small .newsletter-loading strong,html.text-size-small .newsletter-empty strong{font-size:10.5px !important;}
html.text-size-large .newsletter-loading strong,html.text-size-large .newsletter-empty strong{font-size:13.5px !important;}
html.text-size-small .newsletter-loading p,html.text-size-small .newsletter-empty p{font-size:7.875px !important;}
html.text-size-large .newsletter-loading p,html.text-size-large .newsletter-empty p{font-size:10.125px !important;}
html.text-size-small .newsletter-reader-header span{font-size:6.125px !important;}
html.text-size-large .newsletter-reader-header span{font-size:7.875px !important;}
html.text-size-small .newsletter-reader-header strong{font-size:10.5px !important;}
html.text-size-large .newsletter-reader-header strong{font-size:13.5px !important;}
html.text-size-small .newsletter-modal-close{font-size:20.125px !important;}
html.text-size-large .newsletter-modal-close{font-size:25.875px !important;}
html.text-size-small .newsletter-reader-actions button,html.text-size-small .newsletter-reader-actions a{font-size:7.875px !important;}
html.text-size-large .newsletter-reader-actions button,html.text-size-large .newsletter-reader-actions a{font-size:10.125px !important;}
html.text-size-small .newsletter-email-panel h3{font-size:20.125px !important;}
html.text-size-large .newsletter-email-panel h3{font-size:25.875px !important;}
html.text-size-small .newsletter-email-panel > p{font-size:8.75px !important;}
html.text-size-large .newsletter-email-panel > p{font-size:11.25px !important;}
html.text-size-small .newsletter-email-title{font-size:8.75px !important;}
html.text-size-large .newsletter-email-title{font-size:11.25px !important;}
html.text-size-small .newsletter-email-form label{font-size:7.875px !important;}
html.text-size-large .newsletter-email-form label{font-size:10.125px !important;}
html.text-size-small .newsletter-email-form input[type="email"]{font-size:10.5px !important;}
html.text-size-large .newsletter-email-form input[type="email"]{font-size:13.5px !important;}
html.text-size-small .newsletter-email-submit{font-size:8.75px !important;}
html.text-size-large .newsletter-email-submit{font-size:11.25px !important;}
html.text-size-small .newsletter-email-message{font-size:7.875px !important;}
html.text-size-large .newsletter-email-message{font-size:10.125px !important;}
html.text-size-small .newsletter-email-note{font-size:7px !important;}
html.text-size-large .newsletter-email-note{font-size:9px !important;}
html.text-size-small .newsletter-toast{font-size:7.875px !important;}
html.text-size-large .newsletter-toast{font-size:10.125px !important;}
html.text-size-small .admin-newsletter-sync-copy strong{font-size:9.625px !important;}
html.text-size-large .admin-newsletter-sync-copy strong{font-size:12.375px !important;}
html.text-size-small .admin-newsletter-sync-copy span{font-size:7px !important;}
html.text-size-large .admin-newsletter-sync-copy span{font-size:9px !important;}
html.text-size-small .admin-newsletter-sync-actions a,html.text-size-small .admin-newsletter-sync-actions button{font-size:7px !important;}
html.text-size-large .admin-newsletter-sync-actions a,html.text-size-large .admin-newsletter-sync-actions button{font-size:9px !important;}
@media (max-width: 390px){
html.text-size-small .newsletter-card h4{font-size:13.125px !important;}
html.text-size-large .newsletter-card h4{font-size:16.875px !important;}
html.text-size-small .newsletter-action{font-size:6.5625px !important;}
html.text-size-large .newsletter-action{font-size:8.4375px !important;}
html.text-size-small .newsletter-reader-actions button,html.text-size-small .newsletter-reader-actions a{font-size:7px !important;}
html.text-size-large .newsletter-reader-actions button,html.text-size-large .newsletter-reader-actions a{font-size:9px !important;}
}
html.text-size-small .admin-stats.admin-stats-four span{font-size:5.6875px !important;}
html.text-size-large .admin-stats.admin-stats-four span{font-size:7.3125px !important;}
html.text-size-small .admin-stats.admin-stats-four strong{font-size:17.5px !important;}
html.text-size-large .admin-stats.admin-stats-four strong{font-size:22.5px !important;}
html.text-size-small .calendar-overline{font-size:7px !important;}
html.text-size-large .calendar-overline{font-size:9px !important;}
html.text-size-small .calendar-hero h3{font-size:21px !important;}
html.text-size-large .calendar-hero h3{font-size:27px !important;}
html.text-size-small .calendar-hero p{font-size:8.75px !important;}
html.text-size-large .calendar-hero p{font-size:11.25px !important;}
html.text-size-small .calendar-hero-stat span{font-size:6.125px !important;}
html.text-size-large .calendar-hero-stat span{font-size:7.875px !important;}
html.text-size-small .calendar-hero-stat strong{font-size:14.875px !important;}
html.text-size-large .calendar-hero-stat strong{font-size:19.125px !important;}
html.text-size-small .calendar-section-heading h3{font-size:16.625px !important;}
html.text-size-large .calendar-section-heading h3{font-size:21.375px !important;}
html.text-size-small .calendar-section-heading p{font-size:7.875px !important;}
html.text-size-large .calendar-section-heading p{font-size:10.125px !important;}
html.text-size-small .calendar-choice-copy small{font-size:5.6875px !important;}
html.text-size-large .calendar-choice-copy small{font-size:7.3125px !important;}
html.text-size-small .calendar-choice-copy strong{font-size:8.75px !important;}
html.text-size-large .calendar-choice-copy strong{font-size:11.25px !important;}
html.text-size-small .calendar-choice-check{font-size:9.625px !important;}
html.text-size-large .calendar-choice-check{font-size:12.375px !important;}
html.text-size-small .calendar-viewer-title span{font-size:6.125px !important;}
html.text-size-large .calendar-viewer-title span{font-size:7.875px !important;}
html.text-size-small .calendar-viewer-title strong{font-size:14.875px !important;}
html.text-size-large .calendar-viewer-title strong{font-size:19.125px !important;}
html.text-size-small .calendar-view-toggle button{font-size:7px !important;}
html.text-size-large .calendar-view-toggle button{font-size:9px !important;}
html.text-size-small .calendar-loading{font-size:8.75px !important;}
html.text-size-large .calendar-loading{font-size:11.25px !important;}
html.text-size-small .calendar-status{font-size:7px !important;}
html.text-size-large .calendar-status{font-size:9px !important;}
html.text-size-small .calendar-action{font-size:7.875px !important;}
html.text-size-large .calendar-action{font-size:10.125px !important;}
html.text-size-small .calendar-help strong{font-size:8.75px !important;}
html.text-size-large .calendar-help strong{font-size:11.25px !important;}
html.text-size-small .calendar-help p{font-size:7px !important;}
html.text-size-large .calendar-help p{font-size:9px !important;}
html.text-size-small .gallery-overline{font-size:7.875px !important;}
html.text-size-large .gallery-overline{font-size:10.125px !important;}
html.text-size-small .gallery-hero h3{font-size:clamp(1.75rem, 6.125vw, 2.35rem) !important;}
html.text-size-large .gallery-hero h3{font-size:clamp(1.75rem, 7.875vw, 2.35rem) !important;}
html.text-size-small .gallery-hero p{font-size:11.375px !important;}
html.text-size-large .gallery-hero p{font-size:14.625px !important;}
html.text-size-small .gallery-hero-stats span{font-size:7.875px !important;}
html.text-size-large .gallery-hero-stats span{font-size:10.125px !important;}
html.text-size-small .gallery-search input{font-size:12.25px !important;}
html.text-size-large .gallery-search input{font-size:15.75px !important;}
html.text-size-small .gallery-year-row button{font-size:10.5px !important;}
html.text-size-large .gallery-year-row button{font-size:13.5px !important;}
html.text-size-small .gallery-drive-link,html.text-size-small .gallery-refresh{font-size:9.625px !important;}
html.text-size-large .gallery-drive-link,html.text-size-large .gallery-refresh{font-size:12.375px !important;}
html.text-size-small .gallery-setup strong,html.text-size-small .gallery-error strong,html.text-size-small .gallery-empty strong,html.text-size-small .gallery-loading strong{font-size:13.125px !important;}
html.text-size-large .gallery-setup strong,html.text-size-large .gallery-error strong,html.text-size-large .gallery-empty strong,html.text-size-large .gallery-loading strong{font-size:16.875px !important;}
html.text-size-small .gallery-setup p,html.text-size-small .gallery-error p,html.text-size-small .gallery-empty p,html.text-size-small .gallery-loading p{font-size:10.5px !important;}
html.text-size-large .gallery-setup p,html.text-size-large .gallery-error p,html.text-size-large .gallery-empty p,html.text-size-large .gallery-loading p{font-size:13.5px !important;}
html.text-size-small .gallery-photo-badge{font-size:7.875px !important;}
html.text-size-large .gallery-photo-badge{font-size:10.125px !important;}
html.text-size-small .gallery-album-overline{font-size:7px !important;}
html.text-size-large .gallery-album-overline{font-size:9px !important;}
html.text-size-small .gallery-album-copy > span:last-child{font-size:8.75px !important;}
html.text-size-large .gallery-album-copy > span:last-child{font-size:11.25px !important;}
html.text-size-small .gallery-album-arrow{font-size:18.375px !important;}
html.text-size-large .gallery-album-arrow{font-size:23.625px !important;}
html.text-size-small .gallery-album-header h3{font-size:clamp(1.55rem, 5.25vw, 2.2rem) !important;}
html.text-size-large .gallery-album-header h3{font-size:clamp(1.55rem, 6.75vw, 2.2rem) !important;}
html.text-size-small .gallery-album-header p{font-size:9.625px !important;}
html.text-size-large .gallery-album-header p{font-size:12.375px !important;}
html.text-size-small .gallery-modal-close,html.text-size-small .gallery-viewer-header button{font-size:23.625px !important;}
html.text-size-large .gallery-modal-close,html.text-size-large .gallery-viewer-header button{font-size:30.375px !important;}
html.text-size-small .gallery-album-toolbar button,html.text-size-small .gallery-album-toolbar a{font-size:9.625px !important;}
html.text-size-large .gallery-album-toolbar button,html.text-size-large .gallery-album-toolbar a{font-size:12.375px !important;}
html.text-size-small .gallery-photo-loading{font-size:10.5px !important;}
html.text-size-large .gallery-photo-loading{font-size:13.5px !important;}
html.text-size-small .gallery-photo-hover strong{font-size:8.75px !important;}
html.text-size-large .gallery-photo-hover strong{font-size:11.25px !important;}
html.text-size-small .gallery-photo-hover small{font-size:7px !important;}
html.text-size-large .gallery-photo-hover small{font-size:9px !important;}
html.text-size-small .gallery-album-note{font-size:9.625px !important;}
html.text-size-large .gallery-album-note{font-size:12.375px !important;}
html.text-size-small .gallery-viewer-header span{font-size:7.875px !important;}
html.text-size-large .gallery-viewer-header span{font-size:10.125px !important;}
html.text-size-small .gallery-viewer-header strong{font-size:10.5px !important;}
html.text-size-large .gallery-viewer-header strong{font-size:13.5px !important;}
html.text-size-small .gallery-viewer-nav{font-size:32.375px !important;}
html.text-size-large .gallery-viewer-nav{font-size:41.625px !important;}
html.text-size-small .gallery-viewer-copy span{font-size:8.75px !important;}
html.text-size-large .gallery-viewer-copy span{font-size:11.25px !important;}
html.text-size-small .gallery-viewer-actions button,html.text-size-small .gallery-viewer-actions a{font-size:8.75px !important;}
html.text-size-large .gallery-viewer-actions button,html.text-size-large .gallery-viewer-actions a{font-size:11.25px !important;}
html.text-size-small .gallery-toast{font-size:9.625px !important;}
html.text-size-large .gallery-toast{font-size:12.375px !important;}
html.text-size-small .notice-hero h3{font-size:clamp(1.65rem,6.125vw,2.25rem) !important;}
html.text-size-large .notice-hero h3{font-size:clamp(1.65rem,7.875vw,2.25rem) !important;}
html.text-size-small .notice-card h3{font-size:clamp(1.28rem,4.9vw,1.72rem) !important;}
html.text-size-large .notice-card h3{font-size:clamp(1.28rem,6.3vw,1.72rem) !important;}
html.text-size-small .notice-detail-content h3{font-size:clamp(1.8rem,7vw,2.55rem) !important;}
html.text-size-large .notice-detail-content h3{font-size:clamp(1.8rem,9vw,2.55rem) !important;}
html.text-size-small .notice-image-enlarge{font-size:9.625px !important;}
html.text-size-large .notice-image-enlarge{font-size:12.375px !important;}
html.text-size-small .notice-document-type{font-size:7.875px !important;}
html.text-size-large .notice-document-type{font-size:10.125px !important;}
html.text-size-small .resource-overline{font-size:7.875px !important;}
html.text-size-large .resource-overline{font-size:10.125px !important;}
html.text-size-small .resource-hero h3{font-size:clamp(1.65rem,5.25vw,2.2rem) !important;}
html.text-size-large .resource-hero h3{font-size:clamp(1.65rem,6.75vw,2.2rem) !important;}
html.text-size-small .resource-hero p{font-size:11.375px !important;}
html.text-size-large .resource-hero p{font-size:14.625px !important;}
html.text-size-small .resource-hero-count span{font-size:7.875px !important;}
html.text-size-large .resource-hero-count span{font-size:10.125px !important;}
html.text-size-small .resource-search input{font-size:13.125px !important;}
html.text-size-large .resource-search input{font-size:16.875px !important;}
html.text-size-small .resource-filter-row button{font-size:10.5px !important;}
html.text-size-large .resource-filter-row button{font-size:13.5px !important;}
html.text-size-small .resource-featured{font-size:7.875px !important;}
html.text-size-large .resource-featured{font-size:10.125px !important;}
html.text-size-small .resource-file-icon strong{font-size:9.625px !important;}
html.text-size-large .resource-file-icon strong{font-size:12.375px !important;}
html.text-size-small .resource-file-icon i{font-size:21px !important;}
html.text-size-large .resource-file-icon i{font-size:27px !important;}
html.text-size-small .resource-category{font-size:7.875px !important;}
html.text-size-large .resource-category{font-size:10.125px !important;}
html.text-size-small .resource-card p{font-size:10.9375px !important;}
html.text-size-large .resource-card p{font-size:14.0625px !important;}
html.text-size-small .resource-meta{font-size:8.75px !important;}
html.text-size-large .resource-meta{font-size:11.25px !important;}
html.text-size-small .resource-actions a,html.text-size-small .resource-actions button{font-size:9.625px !important;}
html.text-size-large .resource-actions a,html.text-size-large .resource-actions button{font-size:12.375px !important;}
html.text-size-small .resource-empty span{font-size:29.75px !important;}
html.text-size-large .resource-empty span{font-size:38.25px !important;}
html.text-size-small .resource-email-close{font-size:21px !important;}
html.text-size-large .resource-email-close{font-size:27px !important;}
html.text-size-small .resource-email-panel > p{font-size:10.5px !important;}
html.text-size-large .resource-email-panel > p{font-size:13.5px !important;}
html.text-size-small .resource-email-file{font-size:10.5px !important;}
html.text-size-large .resource-email-file{font-size:13.5px !important;}
html.text-size-small .resource-email-panel label span{font-size:8.75px !important;}
html.text-size-large .resource-email-panel label span{font-size:11.25px !important;}
html.text-size-small .resource-email-message{font-size:10.5px !important;}
html.text-size-large .resource-email-message{font-size:13.5px !important;}
html.text-size-small .resource-toast{font-size:10.5px !important;}
html.text-size-large .resource-toast{font-size:13.5px !important;}
html.text-size-small .recipe-overline{font-size:7.875px !important;}
html.text-size-large .recipe-overline{font-size:10.125px !important;}
html.text-size-small .recipe-hero h3{font-size:clamp(1.7rem,5.25vw,2.25rem) !important;}
html.text-size-large .recipe-hero h3{font-size:clamp(1.7rem,6.75vw,2.25rem) !important;}
html.text-size-small .recipe-hero p{font-size:11.375px !important;}
html.text-size-large .recipe-hero p{font-size:14.625px !important;}
html.text-size-small .recipe-count-badge span{font-size:7.875px !important;}
html.text-size-large .recipe-count-badge span{font-size:10.125px !important;}
html.text-size-small .recipe-search input{font-size:13.125px !important;}
html.text-size-large .recipe-search input{font-size:16.875px !important;}
html.text-size-small .recipe-featured{font-size:7.875px !important;}
html.text-size-large .recipe-featured{font-size:10.125px !important;}
html.text-size-small .recipe-favourite{font-size:21px !important;}
html.text-size-large .recipe-favourite{font-size:27px !important;}
html.text-size-small .recipe-card-meta span{font-size:7px !important;}
html.text-size-large .recipe-card-meta span{font-size:9px !important;}
html.text-size-small .recipe-card p{font-size:10.9375px !important;}
html.text-size-large .recipe-card p{font-size:14.0625px !important;}
html.text-size-small .recipe-contributor{font-size:8.75px !important;}
html.text-size-large .recipe-contributor{font-size:11.25px !important;}
html.text-size-small .recipe-open-btn span{font-size:19.25px !important;}
html.text-size-large .recipe-open-btn span{font-size:24.75px !important;}
html.text-size-small .recipe-empty span{font-size:29.75px !important;}
html.text-size-large .recipe-empty span{font-size:38.25px !important;}
html.text-size-small .recipe-modal-close{font-size:21px !important;}
html.text-size-large .recipe-modal-close{font-size:27px !important;}
html.text-size-small .recipe-detail-meta span{font-size:7px !important;}
html.text-size-large .recipe-detail-meta span{font-size:9px !important;}
html.text-size-small .recipe-detail-copy h3{font-size:clamp(2rem,7vw,3rem) !important;}
html.text-size-large .recipe-detail-copy h3{font-size:clamp(2rem,9vw,3rem) !important;}
html.text-size-small .recipe-detail-contributor{font-size:9.625px !important;}
html.text-size-large .recipe-detail-contributor{font-size:12.375px !important;}
html.text-size-small .recipe-detail-summary{font-size:12.25px !important;}
html.text-size-large .recipe-detail-summary{font-size:15.75px !important;}
html.text-size-small .recipe-facts span{font-size:8.75px !important;}
html.text-size-large .recipe-facts span{font-size:11.25px !important;}
html.text-size-small .recipe-detail-section li{font-size:11.375px !important;}
html.text-size-large .recipe-detail-section li{font-size:14.625px !important;}
html.text-size-small .recipe-detail-section p{font-size:11.375px !important;}
html.text-size-large .recipe-detail-section p{font-size:14.625px !important;}
html.text-size-small .recipe-zine-pages > p{font-size:9.625px !important;}
html.text-size-large .recipe-zine-pages > p{font-size:12.375px !important;}
html.text-size-small .recipe-page-grid span{font-size:7.875px !important;}
html.text-size-large .recipe-page-grid span{font-size:10.125px !important;}
html.text-size-small .recipe-page-toolbar button{font-size:18.375px !important;}
html.text-size-large .recipe-page-toolbar button{font-size:23.625px !important;}
html.text-size-small .recipe-submit-panel > p{font-size:10.5px !important;}
html.text-size-large .recipe-submit-panel > p{font-size:13.5px !important;}
html.text-size-small .recipe-submit-form label > span{font-size:7.875px !important;}
html.text-size-large .recipe-submit-form label > span{font-size:10.125px !important;}
html.text-size-small .recipe-submit-form input,html.text-size-small .recipe-submit-form select,html.text-size-small .recipe-submit-form textarea{font-size:11.375px !important;}
html.text-size-large .recipe-submit-form input,html.text-size-large .recipe-submit-form select,html.text-size-large .recipe-submit-form textarea{font-size:14.625px !important;}
html.text-size-small .recipe-submit-message{font-size:10.5px !important;}
html.text-size-large .recipe-submit-message{font-size:13.5px !important;}
html.text-size-small .park-profile-hero h3{font-size:clamp(1.45rem, 3.5vw, 2rem) !important;}
html.text-size-large .park-profile-hero h3{font-size:clamp(1.45rem, 4.5vw, 2rem) !important;}
html.text-size-small .rally-card.has-park-logo .rally-date-block strong{font-size:12.25px !important;}
html.text-size-large .rally-card.has-park-logo .rally-date-block strong{font-size:15.75px !important;}
html.text-size-small .park-accordion > summary{font-size:14px !important;}
html.text-size-large .park-accordion > summary{font-size:18px !important;}
html.text-size-small .park-accordion > summary b{font-size:15.75px !important;}
html.text-size-large .park-accordion > summary b{font-size:20.25px !important;}
html.text-size-small .hero .eyebrow{font-size:7.875px !important;}
html.text-size-large .hero .eyebrow{font-size:10.125px !important;}
html.text-size-small .hero h1{font-size:clamp(2rem, 7vw, 2.8rem) !important;}
html.text-size-large .hero h1{font-size:clamp(2rem, 9vw, 2.8rem) !important;}
html.text-size-small .hero .tagline{font-size:8.75px !important;}
html.text-size-large .hero .tagline{font-size:11.25px !important;}
html.text-size-small .section-kicker{font-size:7.875px !important;}
html.text-size-large .section-kicker{font-size:10.125px !important;}
html.text-size-small .section-heading h2{font-size:19.25px !important;}
html.text-size-large .section-heading h2{font-size:24.75px !important;}
html.text-size-small .tile.visual-tile .label{font-size:14.875px !important;}
html.text-size-large .tile.visual-tile .label{font-size:19.125px !important;}
html.text-size-small .tile.visual-tile .sub{font-size:8.75px !important;}
html.text-size-large .tile.visual-tile .sub{font-size:11.25px !important;}
html.text-size-small .tile.featured.visual-tile .label{font-size:20.125px !important;}
html.text-size-large .tile.featured.visual-tile .label{font-size:25.875px !important;}
html.text-size-small .tile.featured.visual-tile .sub{font-size:9.625px !important;}
html.text-size-large .tile.featured.visual-tile .sub{font-size:12.375px !important;}
html.text-size-small .tile-wide.visual-tile .label{font-size:15.75px !important;}
html.text-size-large .tile-wide.visual-tile .label{font-size:20.25px !important;}
html.text-size-small .screen-header h2{font-size:clamp(1.9rem, 6.5625vw, 2.55rem) !important;}
html.text-size-large .screen-header h2{font-size:clamp(1.9rem, 8.4375vw, 2.55rem) !important;}
html.text-size-small .screen-kicker{font-size:7.875px !important;}
html.text-size-large .screen-kicker{font-size:10.125px !important;}
html.text-size-small .rally-venue{font-size:15.75px !important;}
html.text-size-large .rally-venue{font-size:20.25px !important;}
html.text-size-small .calendar-choice-copy strong{font-size:11.375px !important;}
html.text-size-large .calendar-choice-copy strong{font-size:14.625px !important;}
html.text-size-small .newsletter-card h4{font-size:14.875px !important;}
html.text-size-large .newsletter-card h4{font-size:19.125px !important;}
html.text-size-small .milestone-progress-heading h3{font-size:21px !important;}
html.text-size-large .milestone-progress-heading h3{font-size:27px !important;}
html.text-size-small .notice-card h3{font-size:clamp(1.35rem,5.075vw,1.9rem) !important;}
html.text-size-large .notice-card h3{font-size:clamp(1.35rem,6.525vw,1.9rem) !important;}
html.text-size-small .tabbar button{font-size:8.75px !important;}
html.text-size-large .tabbar button{font-size:11.25px !important;}
@media (max-width: 430px){
html.text-size-small .tile.visual-tile .label{font-size:13.125px !important;}
html.text-size-large .tile.visual-tile .label{font-size:16.875px !important;}
html.text-size-small .tile.featured.visual-tile .label{font-size:17.5px !important;}
html.text-size-large .tile.featured.visual-tile .label{font-size:22.5px !important;}
}
html.text-size-small .hero .eyebrow{font-size:7px !important;}
html.text-size-large .hero .eyebrow{font-size:9px !important;}
html.text-size-small .hero h1{font-size:clamp(1.8rem, 5.95vw, 2.35rem) !important;}
html.text-size-large .hero h1{font-size:clamp(1.8rem, 7.65vw, 2.35rem) !important;}
html.text-size-small .hero .tagline{font-size:7.875px !important;}
html.text-size-large .hero .tagline{font-size:10.125px !important;}
html.text-size-small .gallery-error button,html.text-size-small .gallery-load-more{font-size:10.5px !important;}
html.text-size-large .gallery-error button,html.text-size-large .gallery-load-more{font-size:13.5px !important;}
@media (max-width: 430px){
html.text-size-small .hero h1{font-size:clamp(1.65rem, 6.125vw, 2rem) !important;}
html.text-size-large .hero h1{font-size:clamp(1.65rem, 7.875vw, 2rem) !important;}
html.text-size-small .clock .time{font-size:15.75px !important;}
html.text-size-large .clock .time{font-size:20.25px !important;}
}
html.text-size-small .faq-hero::after{font-size:166.25px !important;}
html.text-size-large .faq-hero::after{font-size:213.75px !important;}
html.text-size-small .faq-overline{font-size:8.75px !important;}
html.text-size-large .faq-overline{font-size:11.25px !important;}
html.text-size-small .faq-hero h3{font-size:clamp(1.9rem,6.125vw,2.55rem) !important;}
html.text-size-large .faq-hero h3{font-size:clamp(1.9rem,7.875vw,2.55rem) !important;}
html.text-size-small .faq-hero p{font-size:12.25px !important;}
html.text-size-large .faq-hero p{font-size:15.75px !important;}
html.text-size-small .faq-hero-stats span{font-size:7.875px !important;}
html.text-size-large .faq-hero-stats span{font-size:10.125px !important;}
html.text-size-small .faq-search input{font-size:13.125px !important;}
html.text-size-large .faq-search input{font-size:16.875px !important;}
html.text-size-small .faq-filter-row button{font-size:10.5px !important;}
html.text-size-large .faq-filter-row button{font-size:13.5px !important;}
html.text-size-small .faq-refresh{font-size:10.5px !important;}
html.text-size-large .faq-refresh{font-size:13.5px !important;}
html.text-size-small .faq-section-heading span{font-size:7.875px !important;}
html.text-size-large .faq-section-heading span{font-size:10.125px !important;}
html.text-size-small .faq-feature-card small{font-size:7px !important;}
html.text-size-large .faq-feature-card small{font-size:9px !important;}
html.text-size-small .faq-feature-card strong{font-size:12.25px !important;}
html.text-size-large .faq-feature-card strong{font-size:15.75px !important;}
html.text-size-small .faq-feature-card b{font-size:18.375px !important;}
html.text-size-large .faq-feature-card b{font-size:23.625px !important;}
html.text-size-small .faq-question-copy small{font-size:7px !important;}
html.text-size-large .faq-question-copy small{font-size:9px !important;}
html.text-size-small .faq-question-copy strong{font-size:13.125px !important;}
html.text-size-large .faq-question-copy strong{font-size:16.875px !important;}
html.text-size-small .faq-chevron{font-size:17.5px !important;}
html.text-size-large .faq-chevron{font-size:22.5px !important;}
html.text-size-small .faq-answer > p{font-size:12.25px !important;}
html.text-size-large .faq-answer > p{font-size:15.75px !important;}
html.text-size-small .faq-steps li{font-size:11.375px !important;}
html.text-size-large .faq-steps li{font-size:14.625px !important;}
html.text-size-small .faq-steps li::before{font-size:9.625px !important;}
html.text-size-large .faq-steps li::before{font-size:12.375px !important;}
html.text-size-small .faq-action-link{font-size:10.5px !important;}
html.text-size-large .faq-action-link{font-size:13.5px !important;}
html.text-size-small .faq-contact-card p{font-size:11.375px !important;}
html.text-size-large .faq-contact-card p{font-size:14.625px !important;}
html.text-size-small .faq-contact-actions a{font-size:9.625px !important;}
html.text-size-large .faq-contact-actions a{font-size:12.375px !important;}
html.text-size-small .faq-error{font-size:10.5px !important;}
html.text-size-large .faq-error{font-size:13.5px !important;}
html.text-size-small .faq-empty p{font-size:10.5px !important;}
html.text-size-large .faq-empty p{font-size:13.5px !important;}
html.text-size-small .faq-image-close{font-size:21px !important;}
html.text-size-large .faq-image-close{font-size:27px !important;}
html.text-size-small .merch-overline,html.text-size-small .merch-section-kicker{font-size:8.75px !important;}
html.text-size-large .merch-overline,html.text-size-large .merch-section-kicker{font-size:11.25px !important;}
html.text-size-small .merch-hero h3{font-size:clamp(26.25px,5.25vw,38.5px) !important;}
html.text-size-large .merch-hero h3{font-size:clamp(33.75px,6.75vw,49.5px) !important;}
html.text-size-small .merch-hero p{font-size:11.375px !important;}
html.text-size-large .merch-hero p{font-size:14.625px !important;}
html.text-size-small .merch-filter{font-size:10.5px !important;}
html.text-size-large .merch-filter{font-size:13.5px !important;}
html.text-size-small .merch-section-heading h3{font-size:24.5px !important;}
html.text-size-large .merch-section-heading h3{font-size:31.5px !important;}
html.text-size-small .merch-section-heading span:last-child{font-size:9.625px !important;}
html.text-size-large .merch-section-heading span:last-child{font-size:12.375px !important;}
html.text-size-small .merch-card-badge{font-size:7px !important;}
html.text-size-large .merch-card-badge{font-size:9px !important;}
html.text-size-small .merch-card-category{font-size:7px !important;}
html.text-size-large .merch-card-category{font-size:9px !important;}
html.text-size-small .merch-card h4{font-size:17.5px !important;}
html.text-size-large .merch-card h4{font-size:22.5px !important;}
html.text-size-small .merch-card p{font-size:8.75px !important;}
html.text-size-large .merch-card p{font-size:11.25px !important;}
html.text-size-small .merch-card-price{font-size:13.125px !important;}
html.text-size-large .merch-card-price{font-size:16.875px !important;}
html.text-size-small .merch-card-price.pending{font-size:8.75px !important;}
html.text-size-large .merch-card-price.pending{font-size:11.25px !important;}
html.text-size-small .merch-card button{font-size:9.625px !important;}
html.text-size-large .merch-card button{font-size:12.375px !important;}
html.text-size-small .merch-close{font-size:20.125px !important;}
html.text-size-large .merch-close{font-size:25.875px !important;}
html.text-size-small .merch-modal h3,html.text-size-small .merch-cart-panel h3,html.text-size-small .merch-checkout-panel h3{font-size:26.25px !important;}
html.text-size-large .merch-modal h3,html.text-size-large .merch-cart-panel h3,html.text-size-large .merch-checkout-panel h3{font-size:33.75px !important;}
html.text-size-small .merch-modal-copy p{font-size:10.5px !important;}
html.text-size-large .merch-modal-copy p{font-size:13.5px !important;}
html.text-size-small .merch-price-large{font-size:19.25px !important;}
html.text-size-large .merch-price-large{font-size:24.75px !important;}
html.text-size-small .merch-price-large.pending{font-size:10.5px !important;}
html.text-size-large .merch-price-large.pending{font-size:13.5px !important;}
html.text-size-small .merch-options label,html.text-size-small .merch-checkout-form label{font-size:8.75px !important;}
html.text-size-large .merch-options label,html.text-size-large .merch-checkout-form label{font-size:11.25px !important;}
html.text-size-small .merch-cart-item strong{font-size:10.5px !important;}
html.text-size-large .merch-cart-item strong{font-size:13.5px !important;}
html.text-size-small .merch-cart-item small{font-size:7.875px !important;}
html.text-size-large .merch-cart-item small{font-size:10.125px !important;}
html.text-size-small .merch-cart-item button{font-size:17.5px !important;}
html.text-size-large .merch-cart-item button{font-size:22.5px !important;}
html.text-size-small .merch-cart-total span{font-size:9.625px !important;}
html.text-size-large .merch-cart-total span{font-size:12.375px !important;}
html.text-size-small .merch-cart-note{font-size:8.75px !important;}
html.text-size-large .merch-cart-note{font-size:11.25px !important;}
html.text-size-small .merch-checkout-message{font-size:8.75px !important;}
html.text-size-large .merch-checkout-message{font-size:11.25px !important;}
html.text-size-small .merch-success strong{font-size:21px !important;}
html.text-size-large .merch-success strong{font-size:27px !important;}
@media (max-width:520px){
html.text-size-small .merch-hero h3{font-size:27.125px !important;}
html.text-size-large .merch-hero h3{font-size:34.875px !important;}
}
html.text-size-small .intention-overline{font-size:7.875px !important;}
html.text-size-large .intention-overline{font-size:10.125px !important;}
html.text-size-small .intention-hero h3{font-size:24.5px !important;}
html.text-size-large .intention-hero h3{font-size:31.5px !important;}
html.text-size-small .intention-hero p{font-size:9.625px !important;}
html.text-size-large .intention-hero p{font-size:12.375px !important;}
html.text-size-small .intention-club-note{font-size:8.75px !important;}
html.text-size-large .intention-club-note{font-size:11.25px !important;}
html.text-size-small .intention-section-heading span{font-size:7px !important;}
html.text-size-large .intention-section-heading span{font-size:9px !important;}
html.text-size-small .intention-section-heading h3{font-size:19.25px !important;}
html.text-size-large .intention-section-heading h3{font-size:24.75px !important;}
html.text-size-small .intention-section-heading p{font-size:8.75px !important;}
html.text-size-large .intention-section-heading p{font-size:11.25px !important;}
html.text-size-small .intention-grid label > span{font-size:8.75px !important;}
html.text-size-large .intention-grid label > span{font-size:11.25px !important;}
html.text-size-small .intention-grid input,html.text-size-small .intention-grid select,html.text-size-small .intention-grid textarea{font-size:10.5px !important;}
html.text-size-large .intention-grid input,html.text-size-large .intention-grid select,html.text-size-large .intention-grid textarea{font-size:13.5px !important;}
html.text-size-small .intention-helper{font-size:7.875px !important;}
html.text-size-large .intention-helper{font-size:10.125px !important;}
html.text-size-small .intention-total-card span{font-size:7.875px !important;}
html.text-size-large .intention-total-card span{font-size:10.125px !important;}
html.text-size-small .intention-total-card strong{font-size:18.375px !important;}
html.text-size-large .intention-total-card strong{font-size:23.625px !important;}
html.text-size-small .intention-confirm{font-size:8.75px !important;}
html.text-size-large .intention-confirm{font-size:11.25px !important;}
html.text-size-small .intention-submit{font-size:11.375px !important;}
html.text-size-large .intention-submit{font-size:14.625px !important;}
html.text-size-small .intention-message{font-size:9.625px !important;}
html.text-size-large .intention-message{font-size:12.375px !important;}
html.text-size-small .intention-success strong{font-size:22.75px !important;}
html.text-size-large .intention-success strong{font-size:29.25px !important;}
html.text-size-small .intention-success p{font-size:8.75px !important;}
html.text-size-large .intention-success p{font-size:11.25px !important;}
html.text-size-small .intention-success-actions button{font-size:8.75px !important;}
html.text-size-large .intention-success-actions button{font-size:11.25px !important;}
html.text-size-small .rally-intention-launch{font-size:10.5px !important;}
html.text-size-large .rally-intention-launch{font-size:13.5px !important;}
html.text-size-small .park-club-booking-note{font-size:8.75px !important;}
html.text-size-large .park-club-booking-note{font-size:11.25px !important;}
html.text-size-small .park-club-booking-note strong{font-size:9.625px !important;}
html.text-size-large .park-club-booking-note strong{font-size:12.375px !important;}
html.text-size-small .admin-intention-status span{font-size:7px !important;}
html.text-size-large .admin-intention-status span{font-size:9px !important;}
html.text-size-small .intention-member-lookup{font-size:8.75px !important;}
html.text-size-large .intention-member-lookup{font-size:11.25px !important;}
html.text-size-small .intention-deadline-banner strong{font-size:14.875px !important;}
html.text-size-large .intention-deadline-banner strong{font-size:19.125px !important;}
html.text-size-small .intention-deadline-banner span{font-size:8.75px !important;}
html.text-size-large .intention-deadline-banner span{font-size:11.25px !important;}
html.text-size-small .intention-deadline-banner small{font-size:7.875px !important;}
html.text-size-large .intention-deadline-banner small{font-size:10.125px !important;}
html.text-size-small .intention-thank-you-close{font-size:21.875px !important;}
html.text-size-large .intention-thank-you-close{font-size:28.125px !important;}
html.text-size-small #intentionThankYouContent h3{font-size:25.375px !important;}
html.text-size-large #intentionThankYouContent h3{font-size:32.625px !important;}
html.text-size-small #intentionThankYouContent > p{font-size:9.625px !important;}
html.text-size-large #intentionThankYouContent > p{font-size:12.375px !important;}
html.text-size-small .intention-confirmation-reference span{font-size:7px !important;}
html.text-size-large .intention-confirmation-reference span{font-size:9px !important;}
html.text-size-small .intention-confirmation-reference strong{font-size:15.75px !important;}
html.text-size-large .intention-confirmation-reference strong{font-size:20.25px !important;}
html.text-size-small .intention-confirmation-grid span{font-size:7px !important;}
html.text-size-large .intention-confirmation-grid span{font-size:9px !important;}
html.text-size-small .intention-confirmation-grid strong{font-size:8.75px !important;}
html.text-size-large .intention-confirmation-grid strong{font-size:11.25px !important;}
html.text-size-small .intention-bank-card > span{font-size:7.875px !important;}
html.text-size-large .intention-bank-card > span{font-size:10.125px !important;}
html.text-size-small .intention-bank-card > strong{font-size:14.875px !important;}
html.text-size-large .intention-bank-card > strong{font-size:19.125px !important;}
html.text-size-small .intention-bank-card p{font-size:8.75px !important;}
html.text-size-large .intention-bank-card p{font-size:11.25px !important;}
html.text-size-small .intention-programme-link{font-size:8.75px !important;}
html.text-size-large .intention-programme-link{font-size:11.25px !important;}
html.text-size-small .intention-email-result{font-size:7.875px !important;}
html.text-size-large .intention-email-result{font-size:10.125px !important;}
html.text-size-small .settings-message{font-size:8.75px !important;}
html.text-size-large .settings-message{font-size:11.25px !important;}
html.text-size-small .settings-push-status{font-size:8.75px !important;}
html.text-size-large .settings-push-status{font-size:11.25px !important;}
html.text-size-small .park-rating-hero h3{font-size:21px !important;}
html.text-size-large .park-rating-hero h3{font-size:27px !important;}
html.text-size-small .park-rating-hero p{font-size:8.75px !important;}
html.text-size-large .park-rating-hero p{font-size:11.25px !important;}
html.text-size-small .park-rating-loading{font-size:10.5px !important;}
html.text-size-large .park-rating-loading{font-size:13.5px !important;}
html.text-size-small .park-rating-open{font-size:8.75px !important;}
html.text-size-large .park-rating-open{font-size:11.25px !important;}
html.text-size-small .admin-quick-service strong{font-size:10.5px !important;}
html.text-size-large .admin-quick-service strong{font-size:13.5px !important;}
html.text-size-small .admin-quick-service span{font-size:7.875px !important;}
html.text-size-large .admin-quick-service span{font-size:10.125px !important;}
html.text-size-small .admin-quick-service a{font-size:7.875px !important;}
html.text-size-large .admin-quick-service a{font-size:10.125px !important;}
html.text-size-small .admin-notification-tools strong{font-size:10.5px !important;}
html.text-size-large .admin-notification-tools strong{font-size:13.5px !important;}
html.text-size-small .admin-notification-tools small{font-size:7.875px !important;}
html.text-size-large .admin-notification-tools small{font-size:10.125px !important;}
html.text-size-small .admin-notification-template-buttons button{font-size:7.875px !important;}
html.text-size-large .admin-notification-template-buttons button{font-size:10.125px !important;}
html.text-size-small .admin-record-card .admin-request-changes{font-size:7.875px !important;}
html.text-size-large .admin-record-card .admin-request-changes{font-size:10.125px !important;}
html.text-size-small .admin-record-card .admin-delivery-chip{font-size:7px !important;}
html.text-size-large .admin-record-card .admin-delivery-chip{font-size:9px !important;}
/* ===== end v33 functional text-size scaling ===== */

/* ===== v34 admin, rally and mobile usability fixes ===== */

/* The fixed bottom navigation clears the page while a member scrolls down.
   It reappears immediately on upward scroll, route changes or a bottom-edge tap. */
.tabbar.is-auto-hidden {
  transform: translateX(-50%) translateY(calc(100% + env(safe-area-inset-bottom))) !important;
  visibility: hidden;
  pointer-events: none;
}

/* Explicit fallback colours prevent native white controls with white text on
   browsers that do not support colour-mix() or render disabled controls natively. */
.app input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
.app textarea,
.app select {
  color: #fff8ea !important;
  -webkit-text-fill-color: #fff8ea;
  background-color: #102519 !important;
  color-scheme: dark;
}
.app input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"])::placeholder,
.app textarea::placeholder {
  color: #b8b0a0 !important;
  -webkit-text-fill-color: #b8b0a0;
  opacity: 1;
}
.app select option {
  color: #fff8ea !important;
  background: #102519 !important;
}
.app input:disabled,
.app textarea:disabled,
.app select:disabled {
  color: #ded5c3 !important;
  -webkit-text-fill-color: #ded5c3;
  background-color: #183524 !important;
  opacity: .78;
}

/* Three clear Admin work areas: overview, edit menu and selected records. */
.admin-section-nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin: 0 0 15px;
  padding: 5px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background-color: #0b2115;
}
.admin-section-nav button {
  min-height: 46px;
  padding: 7px 8px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: #c7c0b1;
  background-color: #12321f;
  font: 850 10px/1.2 var(--font-body);
}
.admin-section-nav button.active {
  color: #171006;
  border-color: #f5d46f;
  background: linear-gradient(145deg, var(--gold-light), var(--gold));
}
.admin-section-panel[hidden] { display: none !important; }
.admin-section-heading {
  margin: 2px 2px 13px;
  text-align: left;
}
.admin-section-heading > span {
  display: block;
  color: var(--gold);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.admin-section-heading h3 {
  margin: 4px 0 3px;
  color: var(--cream);
  font-family: var(--font-display);
  font-size: 20px;
}
.admin-section-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}
.admin-edit-grid { margin-top: 0; }
.admin-editing-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 2px 0 12px;
}
.admin-editing-header > button {
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  color: var(--gold-light);
  background-color: #102519;
  font-weight: 850;
}
.admin-editing-header h3 {
  margin: 3px 0 0;
  color: var(--cream);
  font-family: var(--font-display);
  font-size: 20px;
}

/* Intention-export controls remain readable even while unavailable. */
.admin-intention-tools label {
  min-width: 0;
  display: grid;
  gap: 6px;
  color: #fff8ea;
  font-weight: 800;
}
.admin-intention-tools label > span { color: #fff8ea; }
.admin-intention-tools select {
  border: 1px solid #6d622c !important;
  background-color: #102519 !important;
}
.admin-intention-tools button {
  border: 1px solid #f0ca4a !important;
  color: #171006 !important;
  -webkit-text-fill-color: #171006;
  background: linear-gradient(145deg, #ffe07a, #efbd24) !important;
  font-weight: 850;
}
.admin-intention-tools button:disabled {
  color: #4b401d !important;
  -webkit-text-fill-color: #4b401d;
  background: #d8c67e !important;
  border-color: #b49e4e !important;
  opacity: .72;
}
.admin-intention-tools small {
  grid-column: 1 / -1;
  color: #c7c0b1;
}

/* Park and rally records use a stable image/content grid. This removes the
   large empty centre column and keeps all descriptive text left aligned. */
.admin-record-card.admin-park-record,
.admin-record-card.admin-rally-record {
  grid-template-columns: 74px minmax(0, 1fr) !important;
  align-items: center;
  text-align: left;
}
.admin-record-card.admin-park-record .admin-park-preview,
.admin-record-card.admin-rally-record .admin-park-preview {
  grid-column: 1;
  grid-row: 1;
  width: 64px;
  height: 64px;
  margin: 0;
  object-fit: contain;
}
.admin-record-card.admin-park-record .admin-record-main,
.admin-record-card.admin-rally-record .admin-record-main {
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  align-items: flex-start;
  text-align: left;
}
.admin-record-card.admin-park-record:not(:has(.admin-park-preview)) .admin-record-main,
.admin-record-card.admin-rally-record:not(:has(.admin-park-preview)) .admin-record-main {
  grid-column: 1 / -1;
}
.admin-record-card.admin-park-record .admin-record-main strong,
.admin-record-card.admin-rally-record .admin-record-main strong,
.admin-record-card.admin-park-record .admin-record-main small,
.admin-record-card.admin-rally-record .admin-record-main small,
.admin-record-card.admin-park-record .admin-record-number,
.admin-record-card.admin-rally-record .admin-record-number {
  width: 100%;
  text-align: left;
  white-space: normal;
  overflow-wrap: anywhere;
}
.admin-record-card.admin-park-record .admin-park-meta,
.admin-record-card.admin-rally-record .admin-park-meta {
  justify-content: flex-start;
  text-align: left;
}
.admin-record-card.admin-park-record .admin-record-actions,
.admin-record-card.admin-rally-record .admin-record-actions {
  grid-column: 1 / -1;
  grid-row: 2;
  justify-content: flex-start;
}

.rally-intention-launch.is-completed,
.rally-intention-launch.is-completed:disabled {
  color: #c9c1b1 !important;
  background: #173020 !important;
  border-color: #516151 !important;
  cursor: not-allowed;
  opacity: .8;
}
.intention-form.is-completed-rally { opacity: .86; }

@media (max-width: 520px) {
  .admin-section-nav button { min-height: 44px; font-size: 9px; }
  .admin-stats-ten { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-intention-tools { grid-template-columns: 1fr; }
  .admin-intention-tools small { grid-column: 1; }
  .admin-record-card.admin-park-record,
  .admin-record-card.admin-rally-record { grid-template-columns: 66px minmax(0, 1fr) !important; }
  .admin-record-card.admin-park-record .admin-park-preview,
  .admin-record-card.admin-rally-record .admin-park-preview { width: 58px; height: 58px; }
}
/* ===== end v34 admin, rally and mobile usability fixes ===== */

/* ===== v35 member detail request and Admin approval workflow ===== */
.settings-request-status {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 14px;
  align-items: center;
  margin: 0 0 12px;
  padding: 14px;
  border: 1px solid rgba(239, 189, 36, .34);
  border-radius: 14px;
  background: rgba(239, 189, 36, .08);
}
.settings-request-status[hidden] { display: none !important; }
.settings-request-status > div { display: grid; gap: 3px; min-width: 0; }
.settings-request-status-label {
  color: var(--gold);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.settings-request-status strong { color: var(--cream); font-size: 12px; }
.settings-request-status small { color: var(--muted); font-size: 9px; line-height: 1.4; }
.settings-request-status p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.5;
}
.settings-request-status button {
  min-height: 38px;
  padding: 8px 11px;
  border: 1px solid rgba(239, 189, 36, .5);
  border-radius: 10px;
  color: var(--gold-light);
  background: #102519;
  font-size: 9px;
  font-weight: 850;
}
.settings-request-status[data-status="approved"] {
  border-color: rgba(79, 174, 108, .45);
  background: rgba(79, 174, 108, .12);
}
.settings-request-status[data-status="rejected"] {
  border-color: rgba(210, 83, 69, .5);
  background: rgba(210, 83, 69, .12);
}
.settings-change-summary {
  margin-bottom: 12px;
  padding: 11px 12px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 11px;
  color: var(--muted);
  background: rgba(255,255,255,.035);
  font-size: 9px;
  line-height: 1.45;
}
.settings-change-summary.has-changes {
  border-color: rgba(239, 189, 36, .45);
  color: var(--gold-light);
  background: rgba(239, 189, 36, .08);
}
#settingsProfileChangeForm label[data-profile-field] {
  padding: 8px;
  border: 1px solid transparent;
  border-radius: 11px;
}
#settingsProfileChangeForm label[data-profile-field].is-changed {
  border-color: rgba(239, 189, 36, .44);
  background: rgba(239, 189, 36, .055);
}
#settingsProfileChangeForm [data-current-value] {
  display: block;
  margin-top: 5px;
  color: var(--gold-light);
  font-size: 8px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
#settingsProfileChangeForm [data-current-value][hidden] { display: none !important; }
.settings-profile-actions {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: 9px;
  margin-top: 12px;
}
.settings-profile-actions button {
  min-height: 45px;
  border-radius: 12px;
  font-weight: 900;
}
#settingsResetProfileChange {
  border: 1px solid var(--border);
  color: var(--cream);
  background: #102519;
}
.settings-profile-actions .settings-profile-submit { margin-top: 0; }

.admin-member-request-tools {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(255,255,255,.04);
}
.admin-member-request-tools[hidden] { display: none !important; }
.admin-member-request-tools > div:first-child { display: grid; gap: 3px; }
.admin-member-request-tools strong { color: var(--cream); font-size: 12px; }
.admin-member-request-tools small { color: var(--muted); font-size: 9px; }
.admin-request-filter-buttons { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 7px; }
.admin-request-filter-buttons button {
  min-height: 38px;
  padding: 7px;
  border: 1px solid rgba(190,151,83,.28);
  border-radius: 10px;
  color: var(--cream);
  background: #102519;
  font-size: 9px;
  font-weight: 850;
}
.admin-request-filter-buttons button.active {
  border-color: var(--gold);
  color: #171006;
  background: linear-gradient(145deg, var(--gold-light), var(--gold));
}
.admin-request-filter-buttons span {
  display: inline-grid;
  min-width: 18px;
  min-height: 18px;
  margin-left: 3px;
  place-items: center;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  font-size: 8px;
}
.admin-member-request-card .admin-request-changes {
  gap: 4px;
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(255,255,255,.04);
}
.admin-member-request-card .admin-request-changes strong { color: var(--gold-light); font-size: 9px; }
.admin-member-request-card .admin-request-changes span { color: var(--muted); line-height: 1.4; }
.admin-member-message { display: block; margin-top: 6px; color: var(--muted); }
.admin-member-request-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(239,189,36,.3);
  border-radius: 13px;
  background: rgba(239,189,36,.07);
}
.admin-member-request-summary > div { display: grid; gap: 3px; }
.admin-member-request-summary span { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.admin-member-request-summary strong { color: var(--cream); font-size: 10px; overflow-wrap: anywhere; }
.admin-member-request-summary small { color: var(--muted); font-size: 9px; }
.admin-member-compare {
  padding: 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 13px;
  background: rgba(255,255,255,.025);
}
.admin-member-compare.is-changed {
  border-color: rgba(239,189,36,.45);
  background: rgba(239,189,36,.06);
}
.admin-member-compare-title {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  margin-bottom: 9px;
}
.admin-member-compare-title strong { color: var(--cream); font-size: 10px; }
.admin-member-compare-title span {
  padding: 3px 7px;
  border-radius: 999px;
  color: #171006;
  background: var(--gold);
  font-size: 7px;
  font-weight: 900;
  text-transform: uppercase;
}
.admin-member-compare-title span.unchanged { color: var(--muted); background: rgba(255,255,255,.07); }
.admin-member-compare-values { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.admin-member-compare-values label { display: grid; gap: 5px; }
.admin-member-compare-values label > span { color: var(--muted); font-size: 8px; }
.admin-member-compare-values input[readonly],
.admin-member-compare-values textarea[readonly] { opacity: .72; }
.admin-member-review-actions {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 9px;
}
.admin-member-review-actions button { min-height: 44px; border-radius: 11px; font-size: 9px; font-weight: 900; }
.admin-reject-btn {
  border: 1px solid rgba(218,83,66,.7);
  color: #ffd2cc;
  background: rgba(173,46,37,.22);
}

@media (max-width: 620px) {
  .settings-request-status { grid-template-columns: 1fr; }
  .settings-request-status button { width: 100%; }
  .settings-profile-actions { grid-template-columns: 1fr; }
  .admin-request-filter-buttons { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-member-request-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-member-compare-values { grid-template-columns: 1fr; }
  .admin-member-review-actions { grid-template-columns: 1fr; }
}
/* ===== end v35 member detail request and Admin approval workflow ===== */

/* ===== v36 communications reliability and delivery diagnostics ===== */
.admin-message.info {
  color: #d9e7dc;
  border-color: rgba(116, 166, 132, .38);
  background: rgba(67, 112, 81, .18);
}
.admin-communication-tools {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: #102519;
}
.admin-communication-tools[hidden] { display: none !important; }
.admin-communication-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.admin-communication-heading > div { display: grid; gap: 3px; min-width: 0; }
.admin-communication-heading strong { color: var(--cream); font-size: 12px; }
.admin-communication-heading small { color: var(--muted); font-size: 9px; line-height: 1.45; }
.admin-communication-heading button,
.admin-test-email-form button {
  min-height: 40px;
  padding: 9px 12px;
  border: 1px solid #f0ca4a;
  border-radius: 11px;
  color: #171006;
  background: linear-gradient(145deg, #ffe07a, #efbd24);
  font-size: 9px;
  font-weight: 900;
}
.admin-communication-heading button:disabled,
.admin-test-email-form button:disabled { opacity: .58; }
.admin-communication-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.admin-communication-status-grid > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(190, 151, 83, .22);
  border-radius: 11px;
  background: rgba(255, 255, 255, .035);
}
.admin-communication-status-grid span { color: var(--muted); font-size: 8px; line-height: 1.35; }
.admin-communication-status-grid strong { color: var(--gold-light); font-size: 11px; overflow-wrap: anywhere; }
.admin-test-email-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 9px;
}
.admin-test-email-form label { display: grid; gap: 5px; min-width: 0; }
.admin-test-email-form label > span { color: var(--cream); font-size: 9px; font-weight: 800; }
.admin-test-email-form input {
  width: 100%;
  min-height: 42px;
  border: 1px solid #6d622c;
  border-radius: 11px;
  color: #fff8ea;
  background: #0d2116;
}
.admin-communication-message {
  padding: 10px 11px;
  border: 1px solid rgba(218, 83, 66, .55);
  border-radius: 11px;
  color: #ffd2cc;
  background: rgba(173, 46, 37, .18);
  font-size: 9px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.admin-communication-message[hidden] { display: none !important; }
.admin-communication-message.success {
  border-color: rgba(83, 166, 104, .5);
  color: #c6f1d0;
  background: rgba(46, 125, 66, .18);
}
.admin-communication-message.info {
  border-color: rgba(190, 151, 83, .45);
  color: #f8e5ad;
  background: rgba(190, 151, 83, .1);
}
.admin-communication-record { text-align: left; }
.admin-communication-record.status-failed { border-color: rgba(218, 83, 66, .55); }
.admin-communication-record.status-partial { border-color: rgba(239, 189, 36, .5); }
.admin-email-error {
  display: block;
  margin-top: 6px;
  color: #ffc1b9 !important;
  overflow-wrap: anywhere;
}
.admin-record-card .admin-delivery-chip { line-height: 1.35; }

@media (max-width: 680px) {
  .admin-communication-heading { align-items: stretch; flex-direction: column; }
  .admin-communication-heading button { width: 100%; }
  .admin-communication-status-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-test-email-form { grid-template-columns: 1fr; }
  .admin-test-email-form button { width: 100%; }
}
/* ===== end v36 communications reliability and delivery diagnostics ===== */
html.text-size-small .admin-communication-heading strong { font-size: 10.5px !important; }
html.text-size-large .admin-communication-heading strong { font-size: 13.5px !important; }
html.text-size-small .admin-communication-heading small,
html.text-size-small .admin-test-email-form label > span,
html.text-size-small .admin-communication-message { font-size: 7.875px !important; }
html.text-size-large .admin-communication-heading small,
html.text-size-large .admin-test-email-form label > span,
html.text-size-large .admin-communication-message { font-size: 10.125px !important; }
html.text-size-small .admin-communication-heading button,
html.text-size-small .admin-test-email-form button { font-size: 7.875px !important; }
html.text-size-large .admin-communication-heading button,
html.text-size-large .admin-test-email-form button { font-size: 10.125px !important; }
html.text-size-small .admin-communication-status-grid span { font-size: 7px !important; }
html.text-size-large .admin-communication-status-grid span { font-size: 9px !important; }
html.text-size-small .admin-communication-status-grid strong { font-size: 9.625px !important; }
html.text-size-large .admin-communication-status-grid strong { font-size: 12.375px !important; }

/* ========================================================================== 
   v37 — Notification reliability, guided setup and in-app notification centre
   ========================================================================== */
.home-alerts-button{
  position:absolute;top:18px;left:18px;z-index:4;width:44px;height:44px;border-radius:15px;
  border:1px solid rgba(218,174,35,.55);background:rgba(8,37,21,.88);color:var(--gold-light);
  display:grid;place-items:center;padding:0;
}
.home-alerts-button svg{width:22px;height:22px;}
.home-alerts-button span{position:absolute;right:-5px;top:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:20px;background:#f2c744;color:#112819;font:900 10px/20px system-ui;text-align:center;border:2px solid #082515;}
.notification-setup-reminder{position:relative;margin:16px 20px 0;padding:17px 54px 17px 18px;border-radius:20px;border:1px solid rgba(218,174,35,.48);background:linear-gradient(145deg,rgba(25,70,40,.98),rgba(7,39,23,.98));color:#fff;display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;}
.notification-setup-reminder[hidden]{display:none;}
.notification-setup-reminder span{display:block;color:var(--gold);font:800 .7rem/1.2 system-ui;letter-spacing:.13em;text-transform:uppercase;}
.notification-setup-reminder strong{display:block;margin:4px 0;font-family:Georgia,serif;font-size:1.08rem;}
.notification-setup-reminder p{margin:0;color:rgba(255,255,255,.72);font-size:.84rem;line-height:1.45;}
.notification-setup-reminder>button:not(.notification-reminder-dismiss){min-height:44px;border:0;border-radius:14px;padding:0 16px;background:var(--gold);color:#102719;font-weight:900;}
.notification-reminder-dismiss{position:absolute;right:8px;top:6px;border:0;background:transparent;color:rgba(255,255,255,.7);font-size:25px;line-height:1;}
.member-alerts-screen{padding-bottom:120px;}
.member-alerts-page-header{margin-bottom:18px;}
.member-alerts-hero{margin:0 20px 14px;padding:22px;border:1px solid rgba(218,174,35,.42);border-radius:24px;background:linear-gradient(145deg,rgba(18,59,34,.96),rgba(5,35,21,.98));display:flex;justify-content:space-between;gap:18px;align-items:center;}
.member-alerts-hero h3{margin:5px 0 5px;color:#fff;font-family:Georgia,serif;font-size:1.45rem;}
.member-alerts-hero p{margin:0;color:rgba(255,255,255,.72);line-height:1.5;}
.member-alerts-count{width:74px;height:74px;flex:0 0 74px;border-radius:22px;border:1px solid rgba(218,174,35,.42);background:rgba(0,0,0,.17);display:grid;place-items:center;align-content:center;}
.member-alerts-count strong{color:var(--gold-light);font:900 1.65rem/1 Georgia,serif;}
.member-alerts-count span{margin-top:3px;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;}
.member-alerts-actions{margin:0 20px 10px;display:flex;gap:10px;}
.member-alerts-actions button{flex:1;min-height:44px;border-radius:14px;border:1px solid rgba(218,174,35,.4);background:rgba(18,59,34,.95);color:#fff;font-weight:850;}
.member-alerts-status{margin:0 20px 10px;color:var(--muted);font-size:.82rem;}
.member-alerts-list{display:grid;gap:11px;margin:0 20px;}
.member-alert-card{position:relative;border:1px solid rgba(218,174,35,.34);border-radius:19px;background:linear-gradient(145deg,rgba(19,61,35,.97),rgba(7,39,23,.98));overflow:hidden;}
.member-alert-card.is-read{opacity:.72;}
.member-alert-open{width:100%;border:0;background:transparent;text-align:left;color:#fff;padding:18px 42px 18px 18px;display:block;}
.member-alert-category{display:block;color:var(--gold);font:900 .68rem/1.2 system-ui;text-transform:uppercase;letter-spacing:.12em;margin-bottom:5px;}
.member-alert-open strong{display:block;font:700 1.08rem/1.25 Georgia,serif;color:#fff;}
.member-alert-open p{margin:7px 0;color:rgba(255,255,255,.76);line-height:1.45;}
.member-alert-open small{color:rgba(255,255,255,.53);}
.member-alert-unread-dot{position:absolute;right:17px;top:18px;width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 5px rgba(218,174,35,.14);}
.member-alerts-empty{margin:20px;padding:28px;border:1px dashed rgba(218,174,35,.36);border-radius:20px;text-align:center;color:#fff;background:rgba(12,48,28,.72);}
.member-alerts-empty p{color:var(--muted);margin:6px 0 0;}
.notification-health-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0;}
.notification-health-grid>div{border:1px solid rgba(218,174,35,.25);border-radius:14px;background:rgba(0,0,0,.14);padding:12px;}
.notification-health-grid span{display:block;color:rgba(255,255,255,.58);font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;}
.notification-health-grid strong{display:block;margin-top:4px;color:#fff;font-size:.9rem;overflow-wrap:anywhere;}
.notification-health-grid strong[data-state="success"],.notification-health-grid strong[data-state="granted"]{color:#bce8c8;}
.notification-health-grid strong[data-state="error"],.notification-health-grid strong[data-state="denied"]{color:#ffc1b9;}
.notification-health-grid strong[data-state="warning"],.notification-health-grid strong[data-state="default"]{color:#ffe184;}
.settings-notification-actions button{flex:1 1 190px;}
.notification-test-confirm,.notification-device-help{margin-top:12px;border-radius:16px;padding:15px;border:1px solid rgba(218,174,35,.36);background:rgba(0,0,0,.17);color:#fff;}
.notification-test-confirm p,.notification-device-help p{margin:6px 0 12px;color:rgba(255,255,255,.72);line-height:1.45;}
.notification-test-confirm>div{display:flex;gap:9px;flex-wrap:wrap;}
.notification-test-confirm button,.notification-device-help button{min-height:42px;border-radius:13px;border:1px solid rgba(218,174,35,.42);background:rgba(255,255,255,.05);color:#fff;font-weight:850;padding:8px 13px;}
.notification-test-confirm button.primary{background:var(--gold);color:#102719;}
.settings-notification-centre-link{display:flex;justify-content:space-between;align-items:center;margin:13px 0 8px;min-height:48px;border-radius:14px;border:1px solid rgba(218,174,35,.35);padding:0 14px;color:#fff;text-decoration:none;font-weight:850;background:rgba(255,255,255,.04);}
.notification-setup-modal{position:fixed;inset:0;z-index:250;display:grid;place-items:center;padding:18px;}
.notification-setup-modal[hidden]{display:none;}
.notification-setup-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.72);}
.notification-setup-panel{position:relative;width:min(430px,100%);border-radius:25px;border:1px solid rgba(218,174,35,.55);background:linear-gradient(155deg,#174126,#062616);padding:25px;color:#fff;text-align:center;box-shadow:0 28px 70px rgba(0,0,0,.48);}
.notification-setup-panel>img{width:82px;height:82px;border-radius:50%;object-fit:cover;border:4px solid #d4aa36;background:#fff9ea;margin-bottom:12px;}
.notification-setup-panel h3{margin:6px 0 8px;font:700 1.6rem/1.2 Georgia,serif;}
.notification-setup-panel p{color:rgba(255,255,255,.76);line-height:1.5;}
.notification-setup-panel small{display:block;margin-top:13px;color:rgba(255,255,255,.52);line-height:1.4;}
.notification-setup-close{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#fff;font-size:27px;}
.notification-setup-modal-actions{display:grid;gap:9px;margin-top:18px;}
.notification-setup-modal-actions button{min-height:48px;border-radius:14px;border:1px solid rgba(218,174,35,.44);background:rgba(255,255,255,.05);color:#fff;font-weight:900;}
.notification-setup-modal-actions button.primary{background:var(--gold);color:#102719;}
@media(max-width:620px){
  .home-alerts-button{left:13px;top:13px;}
  .notification-setup-reminder{margin-left:12px;margin-right:12px;grid-template-columns:1fr;padding-right:42px;}
  .notification-setup-reminder>button:not(.notification-reminder-dismiss){width:100%;}
  .member-alerts-hero,.member-alerts-actions,.member-alerts-status,.member-alerts-list{margin-left:12px;margin-right:12px;}
  .member-alerts-hero{align-items:flex-start;}
  .member-alerts-count{width:62px;height:62px;flex-basis:62px;}
  .notification-health-grid{grid-template-columns:1fr;}
}

/* ===================== Version 38: member photo submissions ===================== */
.gallery-submit-card{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;margin:0 18px 16px;padding:16px;border:1px solid color-mix(in srgb,var(--accent,#b8893d) 32%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--accent,#b8893d) 14%,var(--surface,#fffaf2)),var(--surface,#fffaf2));border-radius:20px;box-shadow:0 10px 26px rgba(32,23,15,.08)}
.gallery-submit-card-icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:var(--accent,#b8893d);color:#fff}.gallery-submit-card-icon svg{width:26px;height:26px}.gallery-submit-card strong{display:block;font-size:1rem}.gallery-submit-card p{margin:4px 0 0;color:var(--muted,#746856);font-size:.87rem;line-height:1.4}.gallery-submit-card>button{border:0;border-radius:14px;padding:12px 16px;background:var(--accent,#9a6c2f);color:#fff;font-weight:800;white-space:nowrap;cursor:pointer}
.photo-submit-modal[hidden]{display:none}.photo-submit-modal{position:fixed;inset:0;z-index:3200;display:grid;align-items:end}.photo-submit-backdrop{position:absolute;inset:0;border:0;background:rgba(18,13,9,.64);backdrop-filter:blur(3px)}.photo-submit-panel{position:relative;width:min(760px,100%);max-height:min(92vh,900px);overflow:auto;margin:0 auto;padding:22px 20px calc(24px + env(safe-area-inset-bottom));border-radius:24px 24px 0 0;background:var(--surface,#fffaf2);box-shadow:0 -20px 70px rgba(0,0,0,.28);transform:translateY(24px);opacity:0;transition:.2s ease}.photo-submit-modal.open .photo-submit-panel{transform:none;opacity:1}.photo-submit-close{position:absolute;right:16px;top:14px;width:40px;height:40px;border-radius:50%;border:1px solid rgba(80,55,30,.14);background:rgba(255,255,255,.75);font-size:1.7rem;line-height:1;cursor:pointer}.photo-submit-panel h3{font-family:Georgia,serif;font-size:1.65rem;margin:5px 48px 4px 0}.photo-submit-intro{margin:0 0 18px;color:var(--muted,#746856);line-height:1.5}
.photo-submit-form{display:grid;grid-template-columns:1fr 1fr;gap:13px}.photo-submit-form label{display:flex;flex-direction:column;gap:7px}.photo-submit-form label>span{font-size:.8rem;font-weight:800;color:var(--muted,#746856);text-transform:uppercase;letter-spacing:.05em}.photo-submit-form label span small{font-weight:600;text-transform:none;letter-spacing:0}.photo-submit-form input,.photo-submit-form select,.photo-submit-form textarea{width:100%;border:1px solid rgba(92,69,44,.22);border-radius:13px;background:var(--surface-2,#fff);color:inherit;padding:12px 13px;font:inherit}.photo-submit-form textarea{resize:vertical}.photo-submit-form .full{grid-column:1/-1}
.photo-file-picker{position:relative;min-height:128px;align-items:center!important;justify-content:center;text-align:center;border:2px dashed color-mix(in srgb,var(--accent,#b8893d) 45%,transparent);border-radius:18px;background:color-mix(in srgb,var(--accent,#b8893d) 7%,transparent);cursor:pointer;padding:18px}.photo-file-picker input{position:absolute;inset:0;opacity:0;cursor:pointer}.photo-file-picker-icon{display:grid!important;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--accent,#b8893d);color:#fff!important;font-size:1.55rem!important;line-height:1}.photo-file-picker strong{margin-top:4px}.photo-file-picker small{color:var(--muted,#746856)}
.photo-selected-summary{font-size:.86rem;color:var(--muted,#746856);font-weight:700}.photo-selected-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.photo-selected-item{position:relative;overflow:hidden;border:1px solid rgba(92,69,44,.16);border-radius:14px;background:var(--surface-2,#fff)}.photo-selected-item img,.photo-selected-placeholder{width:100%;aspect-ratio:4/3;object-fit:cover;background:#e7ded0}.photo-selected-placeholder{display:grid;place-items:center;font-weight:900;color:#705c46}.photo-selected-item>div:not(.photo-selected-placeholder){padding:8px 34px 9px 9px}.photo-selected-item strong,.photo-selected-item small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.photo-selected-item strong{font-size:.78rem}.photo-selected-item small{font-size:.72rem;color:var(--muted,#746856);margin-top:2px}.photo-selected-item button{position:absolute;right:6px;bottom:7px;width:27px;height:27px;border:0;border-radius:50%;background:#6a271f;color:#fff;font-size:1.1rem;line-height:1;cursor:pointer}
.photo-consent{flex-direction:row!important;align-items:flex-start!important;gap:10px!important;padding:12px;border-radius:14px;background:rgba(84,115,61,.08)}.photo-consent input{width:20px!important;height:20px;flex:0 0 auto;margin-top:2px}.photo-consent span{text-transform:none!important;letter-spacing:0!important;line-height:1.45;font-weight:650!important}.photo-upload-progress>div{height:9px;border-radius:999px;overflow:hidden;background:rgba(80,55,30,.12)}.photo-upload-progress>div span{display:block;height:100%;width:0;background:var(--accent,#b8893d);transition:width .2s ease}.photo-upload-progress strong{display:block;margin-top:7px;font-size:.82rem}.photo-submit-message{padding:12px 14px;border-radius:13px;font-size:.9rem;line-height:1.45}.photo-submit-message.error{background:#f8e1de;color:#7a261d}.photo-submit-message.success{background:#e4f1df;color:#275b26}.photo-submit-message.warning{background:#fff0cf;color:#73520f}.photo-submit-actions{display:flex;justify-content:flex-end;gap:10px}.photo-submit-actions button{border:1px solid rgba(92,69,44,.2);border-radius:13px;padding:12px 16px;background:transparent;color:inherit;font-weight:800;cursor:pointer}.photo-submit-actions button.primary{border-color:transparent;background:var(--accent,#9a6c2f);color:#fff}.photo-submit-actions button:disabled{opacity:.55;cursor:wait}
.admin-photo-preview-row{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}.admin-photo-preview-row img,.admin-photo-preview-fallback{width:64px;height:52px;object-fit:cover;border-radius:9px;border:1px solid rgba(70,50,30,.16);background:#e6ded2}.admin-photo-preview-fallback{display:grid;place-items:center;font-size:.68rem;font-weight:800;color:#6b5b49}.admin-photo-files{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:8px}.admin-photo-file{overflow:hidden;border:1px solid rgba(70,50,30,.16);border-radius:13px;background:rgba(255,255,255,.55)}.admin-photo-file img,.admin-photo-file-placeholder{width:100%;aspect-ratio:4/3;object-fit:cover;background:#e6ded2}.admin-photo-file-placeholder{display:grid;place-items:center;font-weight:800;color:#6b5b49}.admin-photo-file div{padding:9px}.admin-photo-file strong,.admin-photo-file small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-photo-file small{margin-top:3px;color:var(--muted,#746856)}.admin-photo-file a{display:inline-block;margin-top:7px;font-size:.8rem;font-weight:800;color:var(--accent,#9a6c2f)}
@media(max-width:640px){.gallery-submit-card{grid-template-columns:auto 1fr}.gallery-submit-card>button{grid-column:1/-1;width:100%}.photo-submit-form{grid-template-columns:1fr}.photo-submit-form .full{grid-column:1}.photo-selected-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-photo-files{grid-template-columns:1fr}}

/* ===== v38 Admin photo submission review ===== */
.admin-photo-tools {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(255,255,255,.04);
}
.admin-photo-tools[hidden] { display: none !important; }
.admin-photo-tools > div:first-child { display: grid; gap: 3px; }
.admin-photo-tools strong { color: var(--cream); font-size: 12px; }
.admin-photo-tools small { color: var(--muted); font-size: 9px; }
.admin-photo-tools .admin-request-filter-buttons { grid-template-columns: repeat(5, minmax(0,1fr)); }
.admin-photo-submission-card { align-items: flex-start; }
.admin-photo-preview-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  width: min(288px, 100%);
}
.admin-photo-preview-link { display: block; }
.admin-photo-preview,
.admin-photo-preview-missing {
  width: 64px;
  height: 52px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 9px;
  background: rgba(255,255,255,.05);
}
.admin-photo-preview { display: block; object-fit: cover; }
.admin-photo-preview-missing {
  display: grid;
  place-items: center;
  padding: 5px;
  color: var(--muted);
  font-size: 7px;
  text-align: center;
}
.admin-photo-file-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
}
.admin-photo-file-card {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: rgba(255,255,255,.035);
}
.admin-photo-file-card > a { display: block; }
.admin-photo-file-card img,
.admin-photo-file-placeholder {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: rgba(255,255,255,.05);
}
.admin-photo-file-placeholder {
  display: grid;
  place-items: center;
  min-height: 130px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
}
.admin-photo-file-card > div { display: grid; gap: 4px; padding: 10px; }
.admin-photo-file-card strong,
.admin-photo-file-card small { overflow-wrap: anywhere; }
.admin-photo-file-card small { color: var(--muted); font-size: 8px; line-height: 1.4; }
.admin-photo-open-link { color: var(--gold-light); font-size: 9px; font-weight: 850; }
@media (max-width: 720px) {
  .admin-photo-tools .admin-request-filter-buttons { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .admin-photo-submission-card { grid-template-columns: 1fr; }
  .admin-photo-preview-strip { width: 100%; }
  .admin-photo-file-grid { grid-template-columns: 1fr; }
}

.admin-photo-review-summary > div { min-width: 0; }
.admin-photo-review-summary strong {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
.admin-photo-review-summary > div:nth-child(3) strong { white-space: nowrap; }
.admin-photo-file-card strong {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.3;
}
@media (max-width: 620px) {
  .admin-photo-review-summary { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* ===== end v38 Admin photo submission review ===== */

/* ===================== Version 39: rally weather integration ===================== */
.rally-weather-host { min-width: 0; }
.rally-weather-card {
  display: grid;
  gap: 14px;
  padding: 17px;
  border: 1px solid color-mix(in srgb, var(--accent) 44%, transparent);
  border-radius: 22px;
  background:
    radial-gradient(circle at 90% 0%, color-mix(in srgb, var(--blue, #4f7d91) 18%, transparent), transparent 38%),
    color-mix(in srgb, var(--surface-2) 95%, transparent);
  box-shadow: 0 15px 34px rgba(0,0,0,.18);
}

.rally-weather-heading,
.weather-weekend-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.rally-weather-heading > div { min-width: 0; }
.rally-weather-heading > div > span {
  display: block;
  color: var(--accent);
  font-size: .65rem;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.rally-weather-heading h4 {
  margin: 3px 0 0;
  color: var(--text);
  font-family: var(--font-display, Georgia, serif);
  font-size: 1.2rem;
  line-height: 1.18;
}
.weather-refresh-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 40px;
  padding: 8px 11px;
  border: 1px solid color-mix(in srgb, var(--accent) 50%, transparent);
  border-radius: 13px;
  background: color-mix(in srgb, var(--surface) 86%, transparent);
  color: var(--text);
  font-size: .75rem;
  font-weight: 900;
}
.weather-refresh-button.is-wide { width: 100%; }

.weather-loading {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 96px;
  padding: 17px;
  border: 1px solid color-mix(in srgb, var(--line) 72%, transparent);
  border-radius: 20px;
  background: color-mix(in srgb, var(--surface-2) 93%, transparent);
}
.weather-loading > span {
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  border: 3px solid color-mix(in srgb, var(--accent) 28%, transparent);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: ccsa-weather-spin .9s linear infinite;
}
.weather-loading strong,
.weather-loading small { display: block; }
.weather-loading strong { color: var(--text); }
.weather-loading small { margin-top: 3px; color: var(--muted); }
@keyframes ccsa-weather-spin { to { transform: rotate(360deg); } }

.weather-current-card {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: 13px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--line) 74%, transparent);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 84%, transparent);
}
.weather-current-main {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.weather-current-icon {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  flex: 0 0 auto;
  border-radius: 17px;
  background: color-mix(in srgb, var(--accent) 15%, var(--surface-2));
  font-size: 2rem;
}
.weather-current-main span,
.weather-current-main small { display: block; color: var(--muted); }
.weather-current-main span { font-size: .68rem; font-weight: 800; }
.weather-current-main strong { display: block; margin: 1px 0; color: var(--text); font-size: 1.65rem; line-height: 1; }
.weather-current-main small { font-size: .72rem; line-height: 1.35; }
.weather-current-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}
.weather-current-facts > div {
  min-width: 0;
  padding: 8px;
  border-radius: 11px;
  background: color-mix(in srgb, var(--surface-2) 88%, transparent);
}
.weather-current-facts span,
.weather-current-facts strong { display: block; }
.weather-current-facts span { color: var(--muted); font-size: .58rem; text-transform: uppercase; letter-spacing: .04em; }
.weather-current-facts strong { margin-top: 2px; color: var(--text); font-size: .72rem; line-height: 1.25; }

.weather-weekend-heading { align-items: end; }
.weather-weekend-heading strong { color: var(--text); font-size: .88rem; }
.weather-weekend-heading span { color: var(--muted); font-size: .64rem; text-align: right; }
.weather-day-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}
.weather-day-card {
  min-width: 0;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface) 85%, transparent);
}
.weather-day-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}
.weather-day-heading span { color: var(--accent); font-size: .66rem; font-weight: 900; }
.weather-day-heading b { font-size: 1.35rem; }
.weather-day-condition { display: block; min-height: 2.2em; margin: 7px 0 8px; color: var(--text); font-size: .74rem; line-height: 1.2; }
.weather-temperature-line { display: flex; align-items: baseline; gap: 7px; }
.weather-temperature-line span { color: var(--text); font-size: 1.3rem; font-weight: 900; }
.weather-temperature-line small { color: var(--muted); font-size: .82rem; font-weight: 800; }
.weather-day-facts { display: grid; gap: 4px; margin-top: 9px; }
.weather-day-facts > span { color: var(--muted); font-size: .62rem; line-height: 1.35; }
.weather-day-facts strong { color: var(--text); }

.weather-alert-list { display: grid; gap: 7px; }
.weather-planning-alert {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 10px 11px;
  border: 1px solid color-mix(in srgb, var(--amber, #c78c3f) 55%, transparent);
  border-radius: 13px;
  background: color-mix(in srgb, var(--amber, #c78c3f) 12%, var(--surface));
}
.weather-planning-alert.severity-high {
  border-color: color-mix(in srgb, var(--rust-light, #d87342) 68%, transparent);
  background: color-mix(in srgb, var(--rust, #b9532b) 15%, var(--surface));
}
.weather-planning-alert > span { font-size: 1.15rem; }
.weather-planning-alert strong,
.weather-planning-alert small { display: block; }
.weather-planning-alert strong { color: var(--text); font-size: .76rem; }
.weather-planning-alert small { margin-top: 2px; color: var(--muted); font-size: .66rem; line-height: 1.4; }

.weather-forecast-message,
.weather-location-missing p,
.weather-error-card p {
  margin: 0;
  padding: 13px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 85%, transparent);
  color: var(--muted);
  line-height: 1.5;
}
.weather-forecast-message strong,
.weather-forecast-message span { display: block; }
.weather-forecast-message strong { margin-bottom: 4px; color: var(--text); }
.weather-forecast-message.is-future { border: 1px dashed color-mix(in srgb, var(--accent) 48%, transparent); }
.weather-location-missing small { color: var(--muted); }
.weather-cache-warning { margin: -2px 0 0; color: var(--gold-light); font-size: .7rem; line-height: 1.4; }
.weather-source-note {
  display: grid;
  gap: 5px;
  padding-top: 3px;
  color: var(--muted);
  font-size: .61rem;
  line-height: 1.45;
}
.weather-source-note a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }

.admin-weather-location-note {
  margin: -4px 0 2px;
  padding: 10px 12px;
  border-radius: 13px;
  border: 1px dashed color-mix(in srgb, var(--accent) 45%, transparent);
  color: var(--muted);
  font-size: .76rem;
  line-height: 1.5;
}

@media (max-width: 520px) {
  .rally-weather-card { padding: 14px; }
  .weather-current-card { grid-template-columns: 1fr; }
  .weather-day-grid { grid-template-columns: 1fr; }
  .weather-day-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 12px;
    align-items: start;
  }
  .weather-day-heading,
  .weather-day-condition,
  .weather-day-facts { grid-column: 1; }
  .weather-temperature-line { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
  .weather-day-condition { min-height: 0; margin: 5px 0; }
  .weather-day-facts { grid-template-columns: repeat(3, minmax(0, auto)); gap: 7px; }
}

@media (max-width: 370px) {
  .weather-refresh-button span { display: none; }
  .weather-weekend-heading { display: grid; }
  .weather-weekend-heading span { text-align: left; }
  .weather-day-facts { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .weather-loading > span { animation: none; }
}


/* ===== BEGIN V40 ABOUT & SOLID APPEARANCE =====
   Six solid-colour themes. This final layer intentionally removes decorative
   gradient fills from the app shell, cards, controls and modals while keeping
   image content intact. Text colours are selected for strong contrast. */

:root,
[data-theme="bark"] {
  --bg:#17110d; --bg-soft:#211812; --surface:#2b211a; --surface-raised:#3a2d23; --surface-soft:#49382c;
  --cream:#fff8e9; --hero-text:#fff8e9; --hero-muted:#d9cdbc; --muted:#d4c8b7; --ink:#17100b;
  --gold:#d6aa4b; --gold-light:#f0d38c; --rust:#a95a31; --rust-light:#d6864d; --green:#5e9a5f;
  --blue:#5a8da2; --plum:#927294; --amber:#d19641; --crest-bg:#fff8e9;
  --border:rgba(214,170,75,.32); --border-strong:rgba(214,170,75,.62);
  --hero-solid:#211812; --control-solid:#35291f; --nav-solid:#201711; --modal-solid:#241b15;
}
[data-theme="ccsa-green"] {
  --bg:#052b20; --bg-soft:#063b2b; --surface:#074a35; --surface-raised:#086044; --surface-soft:#0a6d4d;
  --cream:#ffffff; --hero-text:#ffffff; --hero-muted:#d9efe7; --muted:#c8e2d8; --ink:#092015;
  --gold:#ffe500; --gold-light:#fff176; --rust:#b98228; --rust-light:#d9aa3d; --green:#0b7a55;
  --blue:#4e8190; --plum:#78647f; --amber:#ce9b35; --crest-bg:#ffffff;
  --border:rgba(255,229,0,.34); --border-strong:rgba(255,229,0,.7);
  --hero-solid:#063b2b; --control-solid:#07412f; --nav-solid:#04251b; --modal-solid:#063529;
}
[data-theme="leather"] {
  --bg:#212121; --bg-soft:#2b2b2b; --surface:#3b3b3b; --surface-raised:#505050; --surface-soft:#5c514c;
  --cream:#ffffff; --hero-text:#ffffff; --hero-muted:#e8e8e8; --muted:#dedede; --ink:#171717;
  --gold:#d5c8bf; --gold-light:#f0e8e3; --rust:#8f6550; --rust-light:#b78a73; --green:#6f8f76;
  --blue:#708a96; --plum:#8f7b8d; --amber:#aa875f; --crest-bg:#ffffff;
  --border:rgba(255,255,255,.24); --border-strong:rgba(255,255,255,.5);
  --hero-solid:#2b2b2b; --control-solid:#454545; --nav-solid:#242424; --modal-solid:#303030;
}
[data-theme="luxury"] {
  --bg:#110d0c; --bg-soft:#1d1512; --surface:#2b201a; --surface-raised:#4a3527; --surface-soft:#5b432e;
  --cream:#fef7ec; --hero-text:#fef7ec; --hero-muted:#e6d2ba; --muted:#dbbc95; --ink:#110d0c;
  --gold:#b47527; --gold-light:#dbbc95; --rust:#914820; --rust-light:#b96b31; --green:#7f8b66;
  --blue:#687f86; --plum:#806d75; --amber:#b47527; --crest-bg:#fef7ec;
  --border:rgba(219,188,149,.34); --border-strong:rgba(219,188,149,.68);
  --hero-solid:#1d1512; --control-solid:#39291f; --nav-solid:#15100e; --modal-solid:#241a15;
}
[data-theme="midlands"] {
  --bg:#000000; --bg-soft:#111111; --surface:#181818; --surface-raised:#2d2a25; --surface-soft:#39352e;
  --cream:#fcfbfc; --hero-text:#fcfbfc; --hero-muted:#e2ded5; --muted:#d5d0c4; --ink:#000000;
  --gold:#c3b389; --gold-light:#e3d9bc; --rust:#8c6247; --rust-light:#b08464; --green:#6e816f;
  --blue:#75868b; --plum:#86798a; --amber:#a58d58; --crest-bg:#fcfbfc;
  --border:rgba(195,179,137,.36); --border-strong:rgba(195,179,137,.7);
  --hero-solid:#111111; --control-solid:#242424; --nav-solid:#080808; --modal-solid:#161616;
}
[data-theme="boutique"] {
  --bg:#1c1b19; --bg-soft:#272724; --surface:#343530; --surface-raised:#45463f; --surface-soft:#52534b;
  --cream:#fffefe; --hero-text:#fffefe; --hero-muted:#e9e7df; --muted:#d8d7d1; --ink:#1c1b19;
  --gold:#f4d675; --gold-light:#ffe79b; --rust:#a4653d; --rust-light:#c88a5e; --green:#73866d;
  --blue:#728993; --plum:#8c7d90; --amber:#c69d48; --crest-bg:#fffefe;
  --border:rgba(244,214,117,.34); --border-strong:rgba(244,214,117,.68);
  --hero-solid:#272724; --control-solid:#3e3f39; --nav-solid:#20201e; --modal-solid:#2b2c28;
}

/* Theme-aware premium variables, all solid. */
html[data-theme] {
  --premium-body-top:var(--bg); --premium-body-mid:var(--bg); --premium-body-bottom:var(--bg);
  --premium-hero-base:var(--hero-solid); --premium-main-top:var(--bg); --premium-main-bottom:var(--bg);
  --premium-screen-top:var(--hero-solid); --premium-screen-main:var(--bg); --premium-header-base:var(--hero-solid);
  --premium-header-overlay:transparent; --premium-card-a:var(--surface); --premium-card-b:var(--surface);
  --premium-card-c:var(--surface); --premium-card-text:var(--cream); --premium-card-muted:var(--muted);
  --premium-control-a:var(--control-solid); --premium-control-b:var(--control-solid);
  --premium-nav-a:var(--nav-solid); --premium-nav-b:var(--nav-solid); --premium-nav-text:var(--muted);
  --premium-modal:var(--modal-solid); --premium-image-backdrop:#000;
  color-scheme:dark;
}

/* App shell and main surfaces use solid colours only. */
html[data-theme],
html[data-theme] body,
html[data-theme] body::before,
html[data-theme] .app,
html[data-theme] .hero,
html[data-theme] .hero::before,
html[data-theme] main,
html[data-theme] .screen,
html[data-theme] .screen-header,
html[data-theme] .screen-header::before,
html[data-theme] .screen-header::after {
  background-image:none !important;
}
html[data-theme], html[data-theme] body { background-color:var(--bg) !important; color:var(--cream) !important; }
html[data-theme] .app, html[data-theme] main, html[data-theme] .screen { background-color:var(--bg) !important; }
html[data-theme] .hero, html[data-theme] .screen-header { background-color:var(--hero-solid) !important; }
html[data-theme] body::before, html[data-theme] .hero::before { display:none !important; }

/* Common panels and cards. Images remain normal <img> elements. */
html[data-theme] :where(
  .tile.visual-tile,.rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .calendar-viewer-header,.calendar-viewer-footer,.calendar-help,.newsletter-card,.newsletter-hero,.newsletter-reader-panel,
  .newsletter-email-panel,.committee-card,.committee-hero,.committee-payment,.milestone-summary,.milestone-progress-card,
  .milestone-lookup-card,.notice-card,.notice-hero,.notice-document,.notice-detail-panel,.notice-email-panel,.notice-view-menu,
  .admin-login-card,.admin-dashboard,.admin-stats>div,.admin-newsletter-sync,.admin-record-card,.admin-modal-panel,
  .settings-hero,.settings-card,.coming-soon,.photo-submit-card,.photo-admin-card,.notification-setup-panel,
  .weather-card,.weather-summary,.park-card,.park-detail-panel,.recipe-card,.recipe-hero,.resource-card,.resource-hero
) {
  background-image:none !important;
  background-color:var(--surface) !important;
  color:var(--cream) !important;
}
html[data-theme] :where(
  .rally-filter,.notice-filter-row button,.newsletter-year-filter,.calendar-view-toggle button,.admin-tabs button,
  .notice-search,.notice-view-button,.newsletter-search,.admin-search,.milestone-input-wrap,.calendar-action,.committee-action,
  .milestone-reset,.newsletter-card-actions a,.newsletter-card-actions button,.notice-document-actions a,
  .notice-document-actions button,.settings-segment button,.settings-actions button,.settings-update-button,
  .settings-install-button,.settings-profile-load,.settings-profile-actions button,.settings-link-list a,
  .settings-notification-centre-link,.notification-test-confirm button,.notification-device-help button,
  input,textarea,select
) {
  background-image:none !important;
  background-color:var(--control-solid) !important;
  color:var(--cream) !important;
  border-color:var(--border) !important;
}
html[data-theme] :where(
  button.active,.settings-segment button.active,.settings-actions .primary,.settings-update-button,
  .settings-profile-submit:not(:disabled),.faq-scope-switch button.active,.admin-tabs button.active,
  .newsletter-year-filter.active,.calendar-view-toggle button.active,.notification-setup-modal-actions .primary
) {
  background-image:none !important;
  background-color:var(--gold) !important;
  color:var(--ink) !important;
  border-color:var(--gold-light) !important;
}
html[data-theme] :where(h1,h2,h3,h4,strong,label,legend,.label,.rally-venue,.screen-header h2) { color:var(--cream) !important; }
html[data-theme] :where(p,small,.sub,.settings-note,.settings-about,.settings-hero p,.settings-toggle small) { color:var(--muted) !important; }
html[data-theme] input::placeholder, html[data-theme] textarea::placeholder { color:var(--muted) !important; opacity:.82; }
html[data-theme] select option { background:var(--surface) !important; color:var(--cream) !important; }
html[data-theme] .tabbar { background-image:none !important; background-color:var(--nav-solid) !important; }
html[data-theme] .tabbar button.active { background-image:none !important; background-color:var(--surface-raised) !important; color:var(--gold-light) !important; }
html[data-theme] .back-btn { background-image:none !important; background-color:var(--surface-raised) !important; color:var(--cream) !important; }

/* Settings theme chooser. */
.settings-theme-help { margin:-4px 0 13px; color:var(--muted) !important; font-size:.88rem; line-height:1.45; }
.settings-theme-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.settings-theme-options button {
  min-height:86px; display:flex; flex-direction:column; align-items:stretch; justify-content:center; gap:9px;
  padding:12px; border-radius:16px; text-align:left; background:var(--control-solid) !important;
  color:var(--cream) !important; border:2px solid var(--border) !important;
}
.settings-theme-options button.active { border-color:var(--gold) !important; box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 28%,transparent); }
.settings-theme-options button:focus-visible { outline:3px solid var(--gold-light); outline-offset:2px; }
.theme-swatch-strip { display:grid; grid-template-columns:repeat(4,1fr); overflow:hidden; height:18px; border-radius:7px; border:1px solid rgba(255,255,255,.28); }
.theme-swatch-strip i { display:block; background:var(--swatch); }
.theme-choice-copy { display:grid; gap:2px; }
.theme-choice-copy strong { color:var(--cream) !important; font-size:.9rem; line-height:1.2; }
.theme-choice-copy small { color:var(--muted) !important; font-size:.72rem; line-height:1.25; }

/* About: intentionally small images to keep the screen light and fast. */
.about-club-list { display:grid; gap:12px; margin-top:2px; }
.about-club-item { display:grid; grid-template-columns:64px minmax(0,1fr); gap:14px; align-items:start; padding:14px; border:1px solid var(--border); border-radius:18px; background:var(--control-solid); color:var(--cream); }
.about-club-item img { width:64px; height:64px; object-fit:contain; border-radius:12px; background:#fff; padding:5px; }
.about-club-item h4 { margin:1px 0 6px; font-family:var(--font-display); font-size:1.03rem; line-height:1.2; }
.about-club-item p { margin:0 0 9px; font-size:.85rem; line-height:1.48; }
.about-club-item a { display:inline-flex; align-items:center; gap:6px; color:var(--gold-light) !important; font-weight:800; font-size:.82rem; text-decoration:underline; text-underline-offset:3px; }
.app-about-summary { margin-top:14px !important; padding-top:14px; border-top:1px solid var(--border); }

@media (max-width:620px) {
  .settings-theme-options { grid-template-columns:1fr 1fr !important; }
}
@media (max-width:390px) {
  .settings-theme-options { grid-template-columns:1fr !important; }
  .about-club-item { grid-template-columns:54px minmax(0,1fr); gap:11px; }
  .about-club-item img { width:54px; height:54px; }
}
/* ===== END V40 ABOUT & SOLID APPEARANCE ===== */

/* V40 absolute gradient safeguard: every generated background layer is disabled.
   The only restored CSS background image is the small screen-header crest. */
html[data-theme] *,
html[data-theme] *::before,
html[data-theme] *::after {
  background-image: none !important;
}
html[data-theme] .screen-header::after {
  background-image: url("icons/emblem-crop.png") !important;
  background-color: var(--crest-bg) !important;
}


/* ===== V41 COMPACT HOME MENU =====
   Only the featured Rallies card and the Admin card remain full width.
   Committee and both website links now use the standard compact two-column tile. */
.tile.external:not(.tile-wide) .external-mark {
  position:absolute;
  z-index:2;
  top:12px;
  right:12px;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:999px;
  color:color-mix(in srgb,var(--accent) 80%,var(--cream));
  background-color:color-mix(in srgb,var(--surface-raised) 72%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 18%,var(--border));
}
.tile.external:not(.tile-wide) .external-mark svg { width:14px; height:14px; }
/* ===== END V41 COMPACT HOME MENU ===== */


/* ===== V42 SUBTLE SAME-TONE GRADIENTS =====
   Restores depth without introducing cross-colour blends. Every gradient moves
   only between lighter and darker values of the element's own theme colour.
   Text colours and contrast variables remain unchanged. */
html[data-theme] {
  --tone-bg-light:color-mix(in srgb,var(--bg) 94%,white);
  --tone-bg-dark:color-mix(in srgb,var(--bg) 92%,black);
  --tone-hero-light:color-mix(in srgb,var(--hero-solid) 92%,white);
  --tone-hero-dark:color-mix(in srgb,var(--hero-solid) 90%,black);
  --tone-surface-light:color-mix(in srgb,var(--surface) 92%,white);
  --tone-surface-dark:color-mix(in srgb,var(--surface) 91%,black);
  --tone-control-light:color-mix(in srgb,var(--control-solid) 91%,white);
  --tone-control-dark:color-mix(in srgb,var(--control-solid) 91%,black);
  --tone-nav-light:color-mix(in srgb,var(--nav-solid) 93%,white);
  --tone-nav-dark:color-mix(in srgb,var(--nav-solid) 92%,black);
  --tone-gold-light:color-mix(in srgb,var(--gold) 84%,white);
  --tone-gold-dark:color-mix(in srgb,var(--gold) 88%,black);
}

html[data-theme],
html[data-theme] body {
  background-image:linear-gradient(180deg,var(--tone-bg-light) 0%,var(--bg) 42%,var(--tone-bg-dark) 100%) !important;
  background-color:var(--bg) !important;
}
html[data-theme] .app,
html[data-theme] main,
html[data-theme] .screen {
  background-image:linear-gradient(180deg,var(--tone-bg-light) 0%,var(--bg) 34%,var(--tone-bg-dark) 100%) !important;
  background-color:var(--bg) !important;
}
html[data-theme] .hero,
html[data-theme] .screen-header {
  background-image:linear-gradient(155deg,var(--tone-hero-light) 0%,var(--hero-solid) 55%,var(--tone-hero-dark) 100%) !important;
  background-color:var(--hero-solid) !important;
}
html[data-theme] .screen-header::after {
  background-image:url("icons/emblem-crop.png") !important;
}

html[data-theme] :where(
  .tile.visual-tile,.rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .calendar-viewer-header,.calendar-viewer-footer,.calendar-help,.newsletter-card,.newsletter-hero,.newsletter-reader-panel,
  .newsletter-email-panel,.committee-card,.committee-hero,.committee-payment,.milestone-summary,.milestone-progress-card,
  .milestone-lookup-card,.notice-card,.notice-hero,.notice-document,.notice-detail-panel,.notice-email-panel,.notice-view-menu,
  .admin-login-card,.admin-dashboard,.admin-stats>div,.admin-newsletter-sync,.admin-record-card,.admin-modal-panel,
  .settings-hero,.settings-card,.coming-soon,.photo-submit-card,.photo-admin-card,.notification-setup-panel,
  .weather-card,.weather-summary,.park-card,.park-detail-panel,.recipe-card,.recipe-hero,.resource-card,.resource-hero,
  .about-club-item
) {
  background-image:linear-gradient(145deg,var(--tone-surface-light) 0%,var(--surface) 52%,var(--tone-surface-dark) 100%) !important;
  background-color:var(--surface) !important;
}

html[data-theme] :where(
  .rally-filter,.notice-filter-row button,.newsletter-year-filter,.calendar-view-toggle button,.admin-tabs button,
  .notice-search,.notice-view-button,.newsletter-search,.admin-search,.milestone-input-wrap,.calendar-action,.committee-action,
  .milestone-reset,.newsletter-card-actions a,.newsletter-card-actions button,.notice-document-actions a,
  .notice-document-actions button,.settings-segment button,.settings-actions button,.settings-install-button,
  .settings-profile-load,.settings-profile-actions button,.settings-link-list a,.settings-notification-centre-link,
  .notification-test-confirm button,.notification-device-help button,.settings-theme-options button,input,textarea,select
) {
  background-image:linear-gradient(145deg,var(--tone-control-light) 0%,var(--control-solid) 58%,var(--tone-control-dark) 100%) !important;
  background-color:var(--control-solid) !important;
}

html[data-theme] :where(
  button.active,.settings-segment button.active,.settings-actions .primary,.settings-update-button,
  .settings-profile-submit:not(:disabled),.faq-scope-switch button.active,.admin-tabs button.active,
  .newsletter-year-filter.active,.calendar-view-toggle button.active,.notification-setup-modal-actions .primary
) {
  background-image:linear-gradient(145deg,var(--tone-gold-light) 0%,var(--gold) 56%,var(--tone-gold-dark) 100%) !important;
  background-color:var(--gold) !important;
  color:var(--ink) !important;
}

html[data-theme] .tabbar {
  background-image:linear-gradient(180deg,var(--tone-nav-light) 0%,var(--nav-solid) 52%,var(--tone-nav-dark) 100%) !important;
  background-color:var(--nav-solid) !important;
}
html[data-theme] .tabbar button.active,
html[data-theme] .back-btn {
  background-image:linear-gradient(145deg,
    color-mix(in srgb,var(--surface-raised) 91%,white) 0%,
    var(--surface-raised) 55%,
    color-mix(in srgb,var(--surface-raised) 91%,black) 100%) !important;
  background-color:var(--surface-raised) !important;
}

/* Keep image areas, swatches and logos unchanged. */
html[data-theme] :where(img,.theme-swatch-strip,.theme-swatch-strip i,.screen-header::after) {
  color:inherit;
}
/* ===== END V42 SUBTLE SAME-TONE GRADIENTS ===== */


/* ===== BEGIN V44.5 ORIGINAL BARK & GOLD / CCSA GREEN THEMES =====
   These are new, isolated theme IDs copied from the final v39 visual system.
   The six existing themes above are intentionally unchanged. */
[data-theme="bark-classic"] {
  --bg:#0a140e; --bg-soft:#0f2016; --surface:#10261a; --surface-raised:#173421; --surface-soft:#1e4129;
  --cream:#fff8e9; --ink:#11150f; --muted:#c3baa6; --border:rgba(225,181,72,.20); --border-strong:rgba(225,181,72,.48);
  --gold:#d9aa3d; --gold-light:#f4d77b; --rust:#a95a31; --rust-light:#d6864d; --green:#5e9a5f;
  --blue:#5a8da2; --plum:#927294; --amber:#d19641; --crest-bg:#f8efdb; --hero-text:#fff9ed;
  --hero-muted:rgba(255,249,237,.78); --shadow:0 28px 72px rgba(0,0,0,.48); --card-shadow:0 16px 36px rgba(0,0,0,.31);
  --premium-body-top:#100b08; --premium-body-mid:#0b1710; --premium-body-bottom:#08110b; --premium-hero-base:#120d09;
  --premium-main-top:#0b1d13; --premium-main-bottom:#08150e; --premium-screen-top:#120d09; --premium-screen-main:#091a11;
  --premium-header-base:#130e0a; --premium-header-overlay:rgba(11,9,7,.55); --premium-card-a:#1b3e27;
  --premium-card-b:#10291a; --premium-card-c:#0d2317; --premium-card-text:#fff8ea; --premium-card-muted:rgba(255,248,234,.72);
  --premium-control-a:#173821; --premium-control-b:#0d2618; --premium-nav-a:#1a3e26; --premium-nav-b:#07190f;
  --premium-nav-text:rgba(255,249,235,.66); --premium-modal:#0b1f14; --premium-image-backdrop:#050805;
  --hero-solid:#120d09; --control-solid:#173821; --nav-solid:#07190f; --modal-solid:#0b1f14;
}
[data-theme="ccsa-green-classic"] {
  --bg:#07150d; --bg-soft:#0c2114; --surface:#10291a; --surface-raised:#173a24; --surface-soft:#224a2f;
  --cream:#fffbea; --ink:#0b160f; --muted:#c5c9b8; --border:rgba(242,199,50,.20); --border-strong:rgba(242,199,50,.48);
  --gold:#efc532; --gold-light:#ffe583; --rust:#c4902d; --rust-light:#d8ad4a; --green:#3d8c55;
  --blue:#4e8190; --plum:#78647f; --amber:#ce9b35; --crest-bg:#f7f2e1; --hero-text:#fffbea;
  --hero-muted:rgba(255,251,234,.75); --shadow:0 28px 72px rgba(0,0,0,.5); --card-shadow:0 16px 36px rgba(0,0,0,.32);
  --premium-body-top:#071008; --premium-body-mid:#071a0e; --premium-body-bottom:#061009; --premium-hero-base:#08150c;
  --premium-main-top:#0a2113; --premium-main-bottom:#07150d; --premium-screen-top:#08120a; --premium-screen-main:#071b0e;
  --premium-header-base:#09160c; --premium-header-overlay:rgba(5,14,8,.5); --premium-card-a:#173d25;
  --premium-card-b:#102c1a; --premium-card-c:#0c2114; --premium-card-text:#fffbea; --premium-card-muted:rgba(255,251,234,.74);
  --premium-control-a:#173d24; --premium-control-b:#0c2817; --premium-nav-a:#1a4529; --premium-nav-b:#06190e;
  --premium-nav-text:rgba(255,251,234,.68); --premium-modal:#0a2113; --premium-image-backdrop:#030804;
  --hero-solid:#08150c; --control-solid:#173d24; --nav-solid:#06190e; --modal-solid:#0a2113;
}

html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) {
  background:var(--premium-body-bottom) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) body {
  color:var(--cream) !important;
  background:
    radial-gradient(circle at 50% -12%,color-mix(in srgb,var(--gold) 18%,transparent),transparent 30rem),
    radial-gradient(circle at 6% 38%,color-mix(in srgb,var(--green) 15%,transparent),transparent 28rem),
    linear-gradient(180deg,var(--premium-body-top),var(--premium-body-mid) 48%,var(--premium-body-bottom)) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) body::before {
  display:block !important; content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.28;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.12) .55px,transparent .7px),
    linear-gradient(115deg,transparent 0 48%,rgba(255,255,255,.022) 49% 50%,transparent 51% 100%) !important;
  background-size:19px 19px,100% 100% !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) .app {
  color:var(--cream) !important;
  background:
    radial-gradient(circle at 50% -10%,color-mix(in srgb,var(--gold) 9%,transparent),transparent 27rem),
    linear-gradient(180deg,color-mix(in srgb,var(--bg) 95%,var(--premium-hero-base) 5%),var(--bg)) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) .hero {
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--premium-header-overlay) 75%,transparent),var(--premium-header-overlay)),
    radial-gradient(circle at 15% 0%,color-mix(in srgb,var(--gold) 18%,transparent),transparent 20rem),
    radial-gradient(circle at 92% 30%,color-mix(in srgb,var(--green) 16%,transparent),transparent 18rem),
    repeating-linear-gradient(100deg,rgba(255,255,255,.016) 0 1px,transparent 1px 5px),
    var(--premium-hero-base) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) .hero::before {
  display:block !important; opacity:.32 !important;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.18) .55px,transparent .7px),
    linear-gradient(125deg,transparent 0 45%,rgba(231,188,93,.055) 46% 48%,transparent 49% 100%) !important;
  background-size:18px 18px,100% 100% !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) main {
  background:
    radial-gradient(circle at 100% 10%,color-mix(in srgb,var(--green) 12%,transparent),transparent 24rem),
    linear-gradient(180deg,var(--premium-main-top),var(--premium-main-bottom) 68%,var(--bg)) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) .screen {
  background:
    radial-gradient(circle at 96% 3%,color-mix(in srgb,var(--gold) 11%,transparent),transparent 24rem),
    radial-gradient(circle at 0 45%,color-mix(in srgb,var(--green) 11%,transparent),transparent 23rem),
    linear-gradient(180deg,var(--premium-screen-top) 0 148px,var(--premium-screen-main) 148px,var(--bg) 100%) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) .screen-header {
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--premium-header-overlay) 35%,transparent),var(--premium-header-overlay)),
    repeating-linear-gradient(100deg,rgba(255,255,255,.014) 0 1px,transparent 1px 5px),
    var(--premium-header-base) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) .back-btn {
  background:linear-gradient(145deg,color-mix(in srgb,var(--green) 56%,var(--premium-header-base)),color-mix(in srgb,var(--premium-header-base) 85%,#000)) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) :where(
  .tile.visual-tile,.rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .calendar-viewer-header,.calendar-viewer-footer,.calendar-help,.newsletter-card,.newsletter-hero,.newsletter-reader-panel,
  .newsletter-email-panel,.committee-card,.committee-hero,.committee-payment,.milestone-summary,.milestone-progress-card,
  .milestone-lookup-card,.notice-card,.notice-hero,.notice-document,.notice-detail-panel,.notice-email-panel,.notice-view-menu,
  .admin-login-card,.admin-dashboard,.admin-stats>div,.admin-newsletter-sync,.admin-record-card,.admin-modal-panel,
  .settings-hero,.settings-card,.coming-soon,.photo-submit-card,.photo-admin-card,.notification-setup-panel,
  .weather-card,.weather-summary,.park-card,.park-detail-panel,.recipe-card,.recipe-hero,.resource-card,.resource-hero,
  .about-club-item,.games-intro,.game-card,.game-leaderboard,.game-panel
) {
  color:var(--cream) !important;
  background:
    radial-gradient(circle at 50% 7%,color-mix(in srgb,var(--accent,var(--green)) 12%,transparent),transparent 45%),
    linear-gradient(145deg,var(--premium-card-a),var(--premium-card-b) 62%,var(--premium-card-c)) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) :where(
  .rally-filter,.notice-filter-row button,.newsletter-year-filter,.calendar-view-toggle button,.admin-tabs button,
  .notice-search,.notice-view-button,.newsletter-search,.admin-search,.milestone-input-wrap,.calendar-action,.committee-action,
  .milestone-reset,.newsletter-card-actions a,.newsletter-card-actions button,.notice-document-actions a,
  .notice-document-actions button,.settings-segment button,.settings-actions button,.settings-install-button,
  .settings-profile-load,.settings-profile-actions button,.settings-link-list a,.settings-notification-centre-link,
  .notification-test-confirm button,.notification-device-help button,.settings-theme-options button,input,textarea,select
) {
  color:var(--cream) !important;
  background:linear-gradient(145deg,var(--premium-control-a),var(--premium-control-b)) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) :where(
  .notice-view-menu,.rally-detail-panel,.theme-sheet .panel,.admin-modal-panel,.newsletter-reader-panel,
  .newsletter-email-panel,.notice-detail-panel,.notice-email-panel
) {
  color:var(--cream) !important;
  background:
    radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--gold) 8%,transparent),transparent 40%),
    var(--premium-modal) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) .tabbar {
  background:linear-gradient(180deg,var(--premium-nav-a),var(--premium-nav-b)) !important;
}
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) .tabbar button { color:var(--premium-nav-text) !important; }
html:is([data-theme="bark-classic"],[data-theme="ccsa-green-classic"]) .tabbar button.active {
  color:var(--gold-light) !important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--premium-nav-a) 82%,var(--gold) 18%),var(--premium-nav-b)) !important;
}
/* ===== END V44.5 ORIGINAL THEMES ===== */


/* ---------- v44.9 temporary game leaderboard testing tool ---------- */
.admin-game-testing-tools {
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, #d45a4f 42%, var(--border));
  border-radius: 16px;
  background: linear-gradient(145deg, color-mix(in srgb, #d45a4f 7%, var(--surface-raised)), var(--surface));
}
.admin-game-testing-tools h4 { margin: 3px 0 4px; color: var(--cream); font-family: var(--font-display); font-size: 1rem; }
.admin-game-testing-tools p { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.45; }
.admin-game-testing-tools .admin-message { margin-top: 0; }
.admin-danger-action {
  min-height: 44px;
  padding: 10px 13px;
  border: 1px solid color-mix(in srgb, #d45a4f 68%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, #d45a4f 18%, var(--surface-raised));
  color: #ffd7d2;
  font-weight: 900;
}
.admin-danger-action:disabled { opacity: .58; cursor: wait; }


/* =====================================================================
   v45.0 Snag Batch 1: settings accordion and personal celebrations
   ===================================================================== */
.settings-card[data-settings-section] {
  padding: 0;
  overflow: hidden;
}
.settings-card[data-settings-section] > .settings-heading.settings-accordion-toggle {
  position: relative;
  margin: 0;
  min-height: 78px;
  padding: 18px 64px 18px 22px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  cursor: pointer;
  user-select: none;
  outline: none;
}
.settings-card[data-settings-section] > .settings-heading.settings-accordion-toggle::after {
  content: "›";
  position: absolute;
  right: 22px;
  top: 50%;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  color: var(--gold);
  font: 800 1.35rem/1 system-ui, sans-serif;
  transform: translateY(-50%) rotate(90deg);
  transition: transform .18s ease, background .18s ease;
}
.settings-card[data-settings-section].is-open > .settings-heading.settings-accordion-toggle::after {
  transform: translateY(-50%) rotate(-90deg);
  background: color-mix(in srgb, var(--gold) 10%, var(--surface-raised));
}
.settings-card[data-settings-section] > .settings-heading.settings-accordion-toggle:focus-visible {
  box-shadow: inset 0 0 0 3px color-mix(in srgb, var(--gold) 55%, transparent);
}
.settings-card[data-settings-section] > .settings-accordion-panel {
  padding: 0 22px 22px;
  border-top: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
}
.settings-card[data-settings-section] > .settings-accordion-panel > :first-child {
  margin-top: 18px;
}

.celebration-banner {
  display: block;
  position: relative;
  margin: 18px 18px 0;
  padding: 22px 24px 22px 26px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--gold) 55%, var(--border));
  border-left: 6px solid var(--gold);
  border-radius: 22px;
  background:
    radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--gold-light) 16%, transparent), transparent 36%),
    linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 95%, white 5%), var(--surface));
  box-shadow: var(--card-shadow), inset 0 1px 0 rgba(255,255,255,.08);
}
.celebration-banner::before {
  content: "✦  ✧  ✦";
  position: absolute;
  right: 22px;
  top: 16px;
  color: color-mix(in srgb, var(--gold-light) 74%, transparent);
  font-size: 1rem;
  letter-spacing: .35em;
}
.celebration-banner::after {
  width: 150px;
  height: 150px;
  right: -65px;
  bottom: -85px;
}
.celebration-banner .celebration-copy { max-width: 720px; }
.celebration-banner .celebration-kicker {
  margin-bottom: 7px;
  padding-right: 100px;
  font-size: .72rem;
  letter-spacing: .15em;
}
.celebration-banner .celebration-copy h2 {
  margin: 0;
  color: var(--cream);
  font-size: clamp(1.35rem, 4vw, 2rem);
  line-height: 1.12;
}
.celebration-message {
  margin-top: 10px;
  color: var(--muted);
  font-size: .92rem;
  line-height: 1.55;
}
.celebration-message p { margin: 0; }
.celebration-message p + p { margin-top: 10px; }
.celebration-message strong { color: var(--cream); }
@media (max-width: 520px) {
  .settings-card[data-settings-section] > .settings-heading.settings-accordion-toggle {
    min-height: 72px;
    padding: 16px 56px 16px 18px;
  }
  .settings-card[data-settings-section] > .settings-heading.settings-accordion-toggle::after { right: 16px; }
  .settings-card[data-settings-section] > .settings-accordion-panel { padding: 0 18px 18px; }
  .celebration-banner { margin: 14px 12px 0; padding: 20px 18px 20px 20px; }
  .celebration-banner::before { right: 12px; font-size: .78rem; }
  .celebration-banner .celebration-kicker { padding-right: 72px; font-size: .62rem; }
}

/* ===== v46.0 native park ratings ===== */
.park-rating-screen { padding: 0 14px 130px; }
.park-rating-page-header { margin-left: -14px !important; margin-right: -14px !important; }
.park-rating-form { display: grid; gap: 14px; }
.park-rating-card {
  border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  border-radius: 20px;
  padding: 16px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--panel) 96%, white 4%), color-mix(in srgb, var(--panel) 94%, black 6%));
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
}
.park-rating-card-heading { display: flex; align-items: center; gap: 11px; margin-bottom: 14px; }
.park-rating-card-heading > span {
  width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
  flex: 0 0 auto; background: var(--gold); color: var(--ink, #171006); font-weight: 950;
}
.park-rating-card-heading strong { display: block; color: var(--cream); font-family: var(--font-display); font-size: 19px; }
.park-rating-card-heading small { display: block; margin-top: 2px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.park-rating-field { display: grid; gap: 6px; color: var(--cream); font-size: 10px; font-weight: 850; }
.park-rating-field > span { letter-spacing: .02em; }
.park-rating-field small { color: var(--muted); font-weight: 650; }
.park-rating-field input,
.park-rating-field select,
.park-rating-field textarea {
  width: 100%; border: 1px solid color-mix(in srgb, var(--gold) 36%, transparent);
  border-radius: 13px; background: color-mix(in srgb, var(--panel) 88%, white 12%);
  color: var(--cream); padding: 12px 13px; font: inherit; font-size: 12px; outline: none;
}
.park-rating-field input:focus,
.park-rating-field select:focus,
.park-rating-field textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 18%, transparent); }
.park-rating-field textarea { resize: vertical; min-height: 82px; }
.park-rating-member-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.park-rating-member-grid .full { grid-column: 1 / -1; }
.park-rating-selected-park {
  margin-top: 10px; border-radius: 13px; padding: 12px; background: color-mix(in srgb, var(--gold) 9%, transparent);
  color: var(--muted); font-size: 10px; line-height: 1.5;
}
.park-rating-selected-park strong { display: block; color: var(--cream); font-size: 12px; }
.park-rating-selected-park span { display: block; margin-top: 2px; }
.park-rating-scores-card { padding-bottom: 8px; }
.park-rating-score-row {
  display: grid; grid-template-columns: minmax(150px, 1fr) auto; gap: 12px; align-items: center;
  padding: 12px 0; border-top: 1px solid color-mix(in srgb, var(--gold) 18%, transparent);
}
.park-rating-score-row:first-of-type { border-top: 0; }
.park-rating-score-copy strong { display: block; color: var(--cream); font-size: 11px; }
.park-rating-score-copy small { display: block; margin-top: 2px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.park-rating-score-options { display: grid; grid-template-columns: repeat(5, 34px); gap: 5px; }
.park-rating-score-options label { cursor: pointer; }
.park-rating-score-options input { position: absolute; opacity: 0; pointer-events: none; }
.park-rating-score-options span {
  width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--gold) 48%, transparent); color: var(--cream);
  background: color-mix(in srgb, var(--panel) 88%, white 12%); font-size: 11px; font-weight: 900;
}
.park-rating-score-options input:checked + span { background: var(--gold); color: var(--ink, #171006); border-color: var(--gold); transform: translateY(-1px); }
.park-rating-score-options input:focus-visible + span { outline: 2px solid var(--cream); outline-offset: 2px; }
.park-rating-declaration {
  display: flex; align-items: flex-start; gap: 10px; border: 1px solid color-mix(in srgb, var(--gold) 26%, transparent);
  border-radius: 15px; padding: 13px; color: var(--cream); background: color-mix(in srgb, var(--panel) 94%, black 6%);
  font-size: 10px; line-height: 1.45;
}
.park-rating-declaration input { width: 20px; height: 20px; flex: 0 0 auto; accent-color: var(--gold); }
.park-rating-submit { border: 0; border-radius: 15px; padding: 15px; background: var(--gold); color: var(--ink, #171006); font-weight: 950; font-size: 12px; }
.park-rating-submit:disabled { opacity: .58; }
.park-rating-message { border-radius: 14px; padding: 13px; font-size: 10px; line-height: 1.5; }
.park-rating-message.info { background: color-mix(in srgb, var(--gold) 10%, transparent); color: var(--cream); }
.park-rating-message.success { background: rgba(45,132,67,.18); color: #d9ffe2; border: 1px solid rgba(86,190,111,.38); }
.park-rating-message.error { background: rgba(171,48,48,.16); color: #ffd9d9; border: 1px solid rgba(216,83,83,.38); }

.admin-park-rating-tools { display: grid; gap: 12px; margin: 0 0 16px; padding: 14px; border: 1px solid color-mix(in srgb, var(--gold) 30%, transparent); border-radius: 18px; background: var(--panel); }
.admin-park-rating-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.admin-park-rating-summary > div { padding: 10px; border-radius: 12px; background: color-mix(in srgb, var(--gold) 8%, transparent); }
.admin-park-rating-summary span { display: block; color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.admin-park-rating-summary strong { display: block; margin-top: 4px; color: var(--cream); font-size: 13px; overflow-wrap: anywhere; }
.admin-park-rating-filters { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)) auto; gap: 8px; align-items: end; }
.admin-park-rating-filters label { display: grid; gap: 4px; color: var(--muted); font-size: 8px; font-weight: 800; }
.admin-park-rating-filters select,
.admin-park-rating-filters button { min-height: 40px; border-radius: 10px; border: 1px solid color-mix(in srgb, var(--gold) 35%, transparent); background: color-mix(in srgb, var(--panel) 90%, white 10%); color: var(--cream); padding: 8px 10px; font: inherit; font-size: 9px; font-weight: 850; }
.admin-park-rating-filters button { background: var(--gold); color: var(--ink, #171006); border-color: var(--gold); }
.admin-park-category-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.admin-park-category-summary div { display: flex; justify-content: space-between; gap: 8px; padding: 8px 9px; border-radius: 10px; background: color-mix(in srgb, var(--panel) 84%, white 16%); color: var(--muted); font-size: 8px; }
.admin-park-category-summary strong { color: var(--cream); }
.admin-park-rating-card .admin-rating-scores { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.admin-park-rating-card .admin-rating-scores span { padding: 4px 7px; border-radius: 999px; background: color-mix(in srgb, var(--gold) 10%, transparent); color: var(--cream); font-size: 8px; }
.admin-park-rating-card .admin-rating-comment { display: block; margin-top: 6px; color: var(--muted); line-height: 1.45; }
.admin-record-actions button[data-park-rating-toggle] { min-width: 74px; }

@media (max-width: 640px) {
  .park-rating-member-grid { grid-template-columns: 1fr; }
  .park-rating-member-grid .full { grid-column: auto; }
  .park-rating-score-row { grid-template-columns: 1fr; }
  .park-rating-score-options { grid-template-columns: repeat(5, minmax(40px,1fr)); }
  .park-rating-score-options span { width: 100%; height: 40px; }
  .admin-park-rating-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-park-rating-filters { grid-template-columns: 1fr 1fr; }
  .admin-park-rating-filters button { grid-column: 1 / -1; }
  .admin-park-category-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
.admin-park-ranking-summary { padding: 10px; border-radius: 12px; background: color-mix(in srgb, var(--gold) 7%, transparent); }
.admin-park-ranking-summary > strong { display: block; margin-bottom: 6px; color: var(--cream); font-size: 10px; }
.admin-park-ranking-summary > div { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-top: 1px solid color-mix(in srgb, var(--gold) 16%, transparent); color: var(--muted); font-size: 8px; }
.admin-park-ranking-summary > div:first-of-type { border-top: 0; }
.admin-park-ranking-summary b { color: var(--cream); text-align: right; }
.admin-park-ranking-summary p { margin: 0; color: var(--muted); font-size: 8px; }

/* ========================================================================== */
/* Version 47 — intention form, public ticker and rally-register controls      */
/* ========================================================================== */
.intention-form{display:grid;gap:14px;margin-top:14px}
.intention-section{padding:16px;border:1px solid var(--gold-border);border-radius:19px;background:var(--panel);box-shadow:var(--shadow-soft)}
.intention-section-heading{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.intention-section-heading>span{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border-radius:50%;background:var(--gold);color:#171006;font-size:15px;font-weight:950}
.intention-section-heading>div{min-width:0}.intention-section-heading h3{margin:0;color:var(--cream);font-family:var(--font-display);font-size:20px;line-height:1.05}.intention-section-heading p{margin:3px 0 0;color:var(--muted);font-size:10px;line-height:1.45}
.intention-grid textarea{width:100%;box-sizing:border-box;resize:vertical}
.intention-food-product{border:1px solid var(--gold-border);border-radius:14px;background:color-mix(in srgb,var(--panel-strong) 84%,transparent);overflow:hidden;transition:border-color .18s ease,background .18s ease}
.intention-food-product+.intention-food-product{margin-top:8px}.intention-food-product.selected{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 8%,var(--panel-strong))}
.intention-food-product-main{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 12px;margin:0!important}.intention-food-product-main input{width:18px;height:18px;accent-color:var(--gold)}.intention-food-product-main span{min-width:0}.intention-food-product-main strong{display:block;color:var(--cream);font-size:11px}.intention-food-product-main small{display:block;margin-top:2px;color:var(--muted);font-size:9px;line-height:1.35}.intention-food-product-main b{color:var(--gold);font-size:11px;white-space:nowrap}
.intention-food-quantity{display:grid!important;grid-template-columns:auto 90px 1fr;align-items:center;gap:10px;padding:9px 12px;border-top:1px solid var(--gold-border);margin:0!important}.intention-food-quantity span{font-size:9px;color:var(--muted);font-weight:800}.intention-food-quantity select{min-height:38px}.intention-food-quantity em{text-align:right;color:var(--cream);font-style:normal;font-weight:900;font-size:11px}
.intention-ticker{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;margin:12px 16px 0;padding:10px 12px;border:1px solid var(--gold-border);border-radius:15px;background:var(--panel);color:var(--cream);text-decoration:none;overflow:hidden;box-shadow:var(--shadow-soft)}
.intention-ticker-label{color:var(--gold);font-size:8px;font-weight:950;letter-spacing:.13em;text-transform:uppercase;white-space:nowrap}.intention-ticker-track{min-width:0;overflow:hidden;white-space:nowrap}.intention-ticker-track strong{display:inline-block;padding-left:100%;font-size:10px;line-height:1.35;animation:intentionTicker 18s linear infinite}.intention-ticker-action{color:var(--gold);font-size:9px;font-weight:900;white-space:nowrap}
@keyframes intentionTicker{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@media(prefers-reduced-motion:reduce){.intention-ticker-track strong{padding-left:0;animation:none;white-space:normal}}
.admin-intention-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px;border:1px solid var(--gold-border);border-radius:17px;background:var(--panel);margin-bottom:14px}.admin-intention-summary{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.admin-intention-summary>div{padding:9px;border:1px solid var(--gold-border);border-radius:12px;background:var(--panel-strong)}.admin-intention-summary span{display:block;color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.08em}.admin-intention-summary strong{display:block;margin-top:3px;color:var(--cream);font-family:var(--font-display);font-size:18px}.admin-register-actions{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap}.admin-register-actions button{flex:1 1 210px}.admin-register-email{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:12px;border:1px solid var(--gold-border);border-radius:14px;background:var(--panel-strong)}.admin-register-email>div,.admin-register-email .full,.admin-register-email>button{grid-column:1/-1}.admin-register-email strong{display:block;color:var(--cream);font-size:12px}.admin-register-email small{display:block;margin-top:3px;color:var(--muted);font-size:9px;line-height:1.4}.admin-register-email textarea{resize:vertical}
@media(max-width:600px){.intention-ticker{margin:10px 8px 0;grid-template-columns:auto minmax(0,1fr)}.intention-ticker-action{display:none}.admin-intention-tools,.admin-register-email{grid-template-columns:1fr}.admin-intention-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-register-email>div,.admin-register-email .full,.admin-register-email>button{grid-column:auto}.intention-section{padding:13px}.intention-section-heading h3{font-size:18px}}

/* ===== v47 combined rally register and guest intentions ===== */
.admin-combined-register-list{display:grid;gap:10px;margin-top:14px}.admin-register-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 14px;border:1px solid color-mix(in srgb,var(--accent,#d8a937) 48%,transparent);border-radius:16px;background:color-mix(in srgb,var(--panel,#0d291d) 94%,white 6%)}.admin-register-row>div:first-child{display:grid;gap:3px}.admin-register-row strong{font-family:var(--font-display,Georgia,serif);font-size:1.04rem}.admin-register-row small{opacity:.78}.admin-register-row.is-cancelled{opacity:.55}.admin-register-type{width:max-content;padding:3px 8px;border-radius:999px;background:var(--accent,#d8a937);color:#111;font-size:.64rem;font-weight:900;letter-spacing:.12em}.admin-register-row-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.admin-register-row-actions button{border:1px solid var(--line,#8a7226);border-radius:999px;background:transparent;color:inherit;padding:7px 11px;font-weight:800}.admin-register-row-actions .danger{border-color:#b75a4e;color:#ffb4aa}.admin-register-member-note{max-width:150px;text-align:right;font-size:.72rem;opacity:.6}.admin-register-empty{margin:12px 0 0;padding:14px;border-radius:14px;background:color-mix(in srgb,var(--panel,#0d291d) 92%,white 8%);opacity:.78}.admin-register-message{display:block;margin-top:10px;padding:10px 12px;border-radius:12px}.admin-register-message.success{background:rgba(62,154,92,.16);color:#bff1ca}.admin-register-message.error{background:rgba(176,61,51,.18);color:#ffc2ba}.guest-admin-dialog{width:min(650px,calc(100vw - 24px));border:1px solid #987d28;border-radius:22px;background:#0b2118;color:#fff;padding:0;box-shadow:0 24px 80px #0009}.guest-admin-dialog::backdrop{background:#000b}.guest-admin-dialog form{padding:20px}.guest-admin-dialog-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:18px}.guest-admin-dialog-head span{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:#e5b13f}.guest-admin-dialog-head h3{margin:3px 0 0;font-family:var(--font-display,Georgia,serif);font-size:1.7rem}.guest-admin-dialog-head button{border:0;background:transparent;color:white;font-size:1.7rem}.guest-admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.guest-admin-grid label{display:grid;gap:6px;font-weight:800;font-size:.78rem}.guest-admin-grid label.full{grid-column:1/-1}.guest-admin-grid input,.guest-admin-grid select,.guest-admin-grid textarea{width:100%;border:1px solid #75621f;border-radius:12px;background:#153b29;color:#fff;padding:11px;font:inherit}.guest-admin-dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.guest-admin-dialog-actions button{border:1px solid #aa8a2b;border-radius:999px;padding:10px 16px;background:transparent;color:#fff;font-weight:900}.guest-admin-dialog-actions button[type=submit]{background:#e5b13f;color:#111}.intention-ticker{overflow:hidden}.intention-ticker-track{white-space:nowrap;animation:ccsa-intention-marquee 18s linear infinite}@keyframes ccsa-intention-marquee{0%{transform:translateX(100%)}100%{transform:translateX(-100%)}}
@media(max-width:620px){.admin-register-row{align-items:flex-start;flex-direction:column}.admin-register-row-actions{justify-content:flex-start}.admin-register-member-note{text-align:left;max-width:none}.guest-admin-grid{grid-template-columns:1fr}}


/* ===================== Version 48: mobile park summaries and ticker cleanup ===================== */
.intention-ticker{display:block;margin:10px 10px 0;padding:11px 14px;border-radius:14px;overflow:hidden}
.intention-ticker-track{display:block;overflow:hidden;white-space:nowrap;animation:none!important;transform:none!important}
.intention-ticker-track strong{display:inline-block;padding-left:100%;font-size:11px;line-height:1.4;animation:intentionTickerV48 19s linear infinite}
@keyframes intentionTickerV48{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@media(prefers-reduced-motion:reduce){.intention-ticker-track{white-space:normal}.intention-ticker-track strong{display:block;padding-left:0;animation:none;white-space:normal}}
.intention-food-quantity.is-hidden{display:none!important}
.intention-food-heading>div{display:grid;gap:3px}.intention-food-heading strong{display:block}.intention-food-heading span{display:block;line-height:1.4}

#parkDetailContent{display:grid;gap:12px;padding-top:4px}
.park-mobile-hero{display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;align-items:center;padding:15px;border:1px solid color-mix(in srgb,var(--accent) 48%,transparent);border-radius:22px;background:linear-gradient(150deg,color-mix(in srgb,var(--surface-2) 94%,white 6%),color-mix(in srgb,var(--surface) 96%,black 4%));box-shadow:0 14px 30px rgba(0,0,0,.18)}
.park-mobile-hero img{width:84px;height:84px;object-fit:contain;border-radius:16px;background:color-mix(in srgb,var(--surface) 84%,transparent);padding:5px}
.park-mobile-hero span{color:var(--accent);font-size:.67rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.park-mobile-hero h3{margin:4px 0 6px;color:var(--text);font-family:var(--font-display,Georgia,serif);font-size:clamp(1.35rem,5vw,1.8rem);line-height:1.1}
.park-mobile-hero p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.55}
.park-mobile-hero>div{min-width:0}
.park-mobile-hero.no-image{grid-template-columns:minmax(0,1fr)}
.park-mobile-hero.no-image>div{grid-column:1/-1;width:100%}
.park-action-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;position:sticky;top:0;z-index:3;padding:4px 0;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(8px)}
.park-action{min-height:46px;padding:8px 5px;display:grid;place-items:center;gap:2px;border-radius:13px;font-size:.72rem;text-align:center}
.park-action span{font-size:1rem}.park-action b{font-size:.72rem}
.park-rally-card{display:grid;gap:12px;padding:15px;border-radius:18px;border:1px solid color-mix(in srgb,var(--accent) 42%,transparent);background:color-mix(in srgb,var(--surface-2) 94%,transparent)}
.park-rally-card>div{display:grid;gap:3px}.park-rally-card span{font-size:.65rem;color:var(--accent);font-weight:900;letter-spacing:.1em;text-transform:uppercase}.park-rally-card strong{font-family:var(--font-display,Georgia,serif);font-size:1.1rem;color:var(--text)}.park-rally-card small{color:var(--muted)}
.park-rally-card .park-intention-only{margin:0;min-height:50px}
.park-description-card{padding:15px;border:1px solid color-mix(in srgb,var(--line) 76%,transparent);border-radius:18px;background:color-mix(in srgb,var(--surface-2) 94%,transparent)}
.park-description-copy{position:relative;color:var(--text);line-height:1.68;font-size:.92rem}.park-description-copy p{margin:0 0 12px}.park-description-copy p:last-child{margin-bottom:0}.park-description-copy.is-collapsed{max-height:8.1em;overflow:hidden}.park-description-copy.is-collapsed:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3em;background:linear-gradient(transparent,var(--surface-2))}
.park-show-more{margin-top:11px;border:1px solid color-mix(in srgb,var(--accent) 50%,transparent);border-radius:999px;background:transparent;color:var(--accent);padding:8px 13px;font-weight:900}
.park-quick-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.park-quick-facts>div{padding:11px;border-radius:14px;border:1px solid color-mix(in srgb,var(--line) 68%,transparent);background:color-mix(in srgb,var(--surface) 86%,transparent)}.park-quick-facts span{display:block;color:var(--accent);font-size:.61rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.park-quick-facts strong{display:block;margin-top:4px;color:var(--text);font-size:.9rem;line-height:1.4}
.park-facility-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.park-facility-grid>div{display:flex;gap:9px;align-items:flex-start;padding:10px;border-radius:13px;background:color-mix(in srgb,var(--surface) 84%,transparent);border:1px solid color-mix(in srgb,var(--line) 58%,transparent)}.park-facility-grid>div>span{width:26px;flex:0 0 26px;text-align:center;font-size:1.05rem}.park-facility-grid p{margin:0;min-width:0}.park-facility-grid strong{display:block;color:var(--text);font-size:.86rem;line-height:1.3}.park-facility-grid small{display:block;margin-top:3px;color:var(--muted);font-size:.76rem;line-height:1.4}.park-confirm-note{margin:12px 0 0;color:var(--muted);font-size:.78rem;line-height:1.5}
.park-detail-list{display:grid;gap:9px}.park-detail-list>div{padding:11px 12px;border-radius:13px;background:color-mix(in srgb,var(--surface) 84%,transparent)}.park-detail-list strong{color:var(--accent);font-size:.72rem}.park-detail-list p{margin:4px 0 0;color:var(--text);font-size:.82rem;line-height:1.5}.park-accordion-body h5{margin:15px 0 9px;color:var(--text);font-family:var(--font-display,Georgia,serif);font-size:1rem}
.park-reviews-card{overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 38%,transparent);border-radius:18px;background:color-mix(in srgb,var(--surface-2) 94%,transparent)}.park-review-tabs{display:grid;grid-template-columns:1fr 1fr;padding:6px;gap:5px;border-bottom:1px solid color-mix(in srgb,var(--line) 64%,transparent)}.park-review-tabs button{min-height:42px;border:0;border-radius:12px;background:transparent;color:var(--muted);font-weight:900}.park-review-tabs button.is-active{background:var(--accent);color:var(--accent-contrast,#15110a)}.park-review-panel{display:none;padding:15px}.park-review-panel.is-active{display:block}.park-google-score,.park-midlands-score{display:grid;grid-template-columns:auto 1fr;gap:1px 12px;align-items:center}.park-google-score>strong,.park-midlands-score>strong{grid-row:1/span 2;font-family:var(--font-display,Georgia,serif);font-size:2.5rem;color:var(--text)}.park-google-score>span,.park-midlands-score>span{color:var(--accent);letter-spacing:.04em}.park-google-score>small,.park-midlands-score>small{color:var(--muted)}.park-review-updated,.park-review-empty{margin:12px 0;color:var(--muted);font-size:.84rem;line-height:1.55}.park-review-link{display:flex;justify-content:center;align-items:center;min-height:45px;margin-top:12px;border-radius:13px;background:color-mix(in srgb,var(--accent) 16%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 46%,transparent);color:var(--text);font-weight:900;text-decoration:none}.park-review-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:13px}.park-review-stats>div{padding:10px;border-radius:12px;background:color-mix(in srgb,var(--surface) 84%,transparent)}.park-review-stats span{display:block;color:var(--muted);font-size:.67rem}.park-review-stats strong{display:block;margin-top:3px;color:var(--text);font-size:1.1rem}.park-category-bars{display:grid;gap:7px;margin-top:13px}.park-category-bars>div{display:flex;justify-content:space-between;gap:10px;padding:8px 10px;border-radius:10px;background:color-mix(in srgb,var(--surface) 82%,transparent);font-size:.76rem}.park-category-bars span{color:var(--muted)}.park-category-bars strong{color:var(--text)}.park-member-comments{margin-top:14px}.park-member-comments h5{margin:0 0 8px;color:var(--text)}.park-member-comments blockquote{margin:7px 0;padding:10px 12px;border-left:3px solid var(--accent);border-radius:0 10px 10px 0;background:color-mix(in srgb,var(--surface) 84%,transparent);color:var(--text);font-size:.86rem;line-height:1.55}.park-midlands-review-loading{color:var(--muted)}
.park-video-link a{display:flex;justify-content:center;align-items:center;min-height:48px;border-radius:13px;background:var(--accent);color:var(--accent-contrast,#111);font-weight:900;text-decoration:none}
@media(max-width:430px){.park-mobile-hero{grid-template-columns:72px minmax(0,1fr);padding:13px}.park-mobile-hero img{width:72px;height:72px}.park-action-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.park-facility-grid{grid-template-columns:1fr 1fr}.park-quick-facts{grid-template-columns:1fr 1fr}}
@media(max-width:350px){.park-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.park-facility-grid,.park-quick-facts{grid-template-columns:1fr}}

.intention-ticker[hidden]{display:none!important}


/* ===================== Version 49: A-Z Park Setup catalogue ===================== */
.admin-park-az{margin:0 0 13px;padding:12px;border:1px solid var(--border);border-radius:17px;background:color-mix(in srgb,var(--surface-raised) 88%,transparent);display:grid;gap:10px}
.admin-park-az[hidden]{display:none!important}
.admin-park-az-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.admin-park-az-heading>div{display:grid;gap:2px}
.admin-park-az-heading strong{font-size:12px;color:var(--text)}
.admin-park-az-heading small,.admin-park-az-heading>span{font-size:8px;line-height:1.4;color:var(--muted)}
.admin-park-az-heading>span{flex:0 0 auto;padding:5px 8px;border-radius:999px;background:color-mix(in srgb,var(--gold) 12%,transparent);color:var(--gold-light);font-weight:850}
.admin-park-az-letters{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:6px}
.admin-park-az-letters button{min-width:0;min-height:38px;padding:0 5px;border:1px solid var(--border);border-radius:10px;background:transparent;color:var(--text);font-size:9px;font-weight:900}
.admin-park-az-letters button.active{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 18%,transparent);color:var(--gold-light);box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 8%,transparent)}
.admin-park-az-letters button:disabled{opacity:.25}
@media(max-width:600px){.admin-park-az-heading{display:grid}.admin-park-az-heading>span{justify-self:start}.admin-park-az-letters{grid-template-columns:repeat(7,minmax(0,1fr))}.admin-park-az-letters button{min-height:42px;font-size:10px}}
html.text-size-small .admin-park-az-heading strong{font-size:10.5px!important}
html.text-size-large .admin-park-az-heading strong{font-size:13.5px!important}
html.text-size-small .admin-park-az-heading small,html.text-size-small .admin-park-az-heading>span{font-size:7px!important}
html.text-size-large .admin-park-az-heading small,html.text-size-large .admin-park-az-heading>span{font-size:9px!important}


/* ===================== Version 50: KZN Park Map ===================== */
.park-map-home-icon svg{width:54px;height:54px;color:var(--accent)}
.park-map-screen{padding-bottom:110px}
.park-map-intro{margin:0 16px 12px;padding:14px 15px;border:1px solid color-mix(in srgb,var(--accent) 34%,transparent);border-radius:18px;background:color-mix(in srgb,var(--surface-2) 94%,transparent)}
.park-map-intro strong{display:block;color:var(--text);font-family:var(--font-display,Georgia,serif);font-size:1.05rem}.park-map-intro p{margin:5px 0 0;color:var(--muted);font-size:.85rem;line-height:1.5}
.park-map-toolbar{display:grid;gap:9px;margin:0 16px 10px}.park-map-toggle{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:5px;border:1px solid color-mix(in srgb,var(--line) 70%,transparent);border-radius:15px;background:color-mix(in srgb,var(--surface-2) 94%,transparent)}
.park-map-toggle button{min-height:44px;border:0;border-radius:11px;background:transparent;color:var(--muted);font-weight:900}.park-map-toggle button.is-active{background:var(--accent);color:var(--accent-contrast,#17110d)}
.park-map-search input{width:100%;min-height:46px;padding:0 15px;border:1px solid color-mix(in srgb,var(--line) 74%,transparent);border-radius:13px;background:color-mix(in srgb,var(--surface) 92%,transparent);color:var(--text);font:inherit}.park-map-search input::placeholder{color:var(--muted)}
.park-map-status-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 16px 9px}.park-map-status-row p{margin:0;color:var(--muted);font-size:.76rem;line-height:1.4}.park-map-status-row strong{color:var(--text)}.park-map-status-row button{flex:0 0 auto;border:1px solid color-mix(in srgb,var(--accent) 50%,transparent);border-radius:999px;background:transparent;color:var(--accent);padding:7px 10px;font-weight:900;font-size:.72rem}
.park-map-frame{position:relative;height:min(62vh,620px);min-height:430px;margin:0 12px;border:1px solid color-mix(in srgb,var(--accent) 42%,transparent);border-radius:21px;overflow:hidden;background:repeating-linear-gradient(45deg,color-mix(in srgb,var(--surface) 96%,white 4%) 0 16px,color-mix(in srgb,var(--surface-2) 96%,black 4%) 16px 32px);box-shadow:0 14px 30px rgba(0,0,0,.2)}
.park-map-canvas,.park-map-tiles,.park-map-markers{position:absolute;inset:0;overflow:hidden}.park-map-canvas{touch-action:none;cursor:grab}.park-map-canvas:active{cursor:grabbing}.park-map-tiles img{position:absolute;width:256px;height:256px;max-width:none;user-select:none;pointer-events:none}.park-map-markers{pointer-events:none}
.park-map-marker,.park-map-cluster{position:absolute;z-index:4;transform:translate(-50%,-50%);pointer-events:auto;border:0;cursor:pointer}.park-map-marker{width:28px;height:36px;padding:0;background:transparent;overflow:visible}.park-map-marker>span{display:block;width:25px;height:25px;margin:auto;border:3px solid #fff;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#2f6f51;box-shadow:0 3px 9px rgba(0,0,0,.38)}.park-map-marker>span:after{content:"";display:block;width:7px;height:7px;margin:6px;border-radius:50%;background:#fff}.park-map-marker.is-rally>span{background:var(--accent)}
.park-map-marker b{position:absolute;left:50%;top:35px;transform:translateX(-50%);display:none;width:max-content;max-width:180px;padding:5px 8px;border-radius:8px;background:rgba(20,17,13,.92);color:#fff;font-size:11px;line-height:1.2;white-space:nowrap;box-shadow:0 3px 10px rgba(0,0,0,.32)}.park-map-marker:focus b,.park-map-marker:hover b{display:block}
.park-map-cluster{display:grid;place-items:center;width:39px;height:39px;border:3px solid #fff;border-radius:50%;background:#2f6f51;color:#fff;font-weight:900;box-shadow:0 3px 11px rgba(0,0,0,.38)}.park-map-cluster.has-rally{background:var(--accent);color:var(--accent-contrast,#17110d)}
.park-map-controls{position:absolute;right:10px;top:10px;z-index:8;display:grid;overflow:hidden;border:1px solid rgba(255,255,255,.55);border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.28)}.park-map-controls button{width:42px;height:42px;border:0;border-bottom:1px solid rgba(0,0,0,.12);background:rgba(255,255,255,.94);color:#26211b;font-size:1.25rem;font-weight:900}.park-map-controls button:last-child{border-bottom:0;font-size:1rem}
.park-map-legend{position:absolute;left:9px;bottom:28px;z-index:8;display:flex;gap:10px;padding:6px 8px;border-radius:10px;background:rgba(255,255,255,.93);color:#25201b;font-size:10px;font-weight:800;box-shadow:0 3px 10px rgba(0,0,0,.22)}.park-map-legend span{display:flex;align-items:center;gap:4px}.park-map-legend i{width:10px;height:10px;border-radius:50%;background:#2f6f51}.park-map-legend i.is-rally{background:#c7922d}
.park-map-attribution{position:absolute;right:5px;bottom:4px;z-index:8;padding:2px 4px;border-radius:4px;background:rgba(255,255,255,.88);color:#333;font-size:9px;text-decoration:none}
.park-map-directory-card{margin:12px 16px 0;border:1px solid color-mix(in srgb,var(--line) 70%,transparent);border-radius:17px;background:color-mix(in srgb,var(--surface-2) 94%,transparent);overflow:hidden}.park-map-directory-card summary{display:flex;align-items:center;justify-content:space-between;min-height:50px;padding:0 14px;color:var(--text);font-weight:900;cursor:pointer}.park-map-directory-card summary::-webkit-details-marker{display:none}.park-map-directory-card[open] summary b{transform:rotate(45deg)}.park-map-directory{display:grid;border-top:1px solid color-mix(in srgb,var(--line) 65%,transparent);max-height:420px;overflow:auto}
.park-map-list-item{display:grid;grid-template-columns:24px minmax(0,1fr) 18px;gap:7px;align-items:center;min-height:58px;padding:9px 12px;border:0;border-bottom:1px solid color-mix(in srgb,var(--line) 55%,transparent);background:transparent;color:var(--text);text-align:left}.park-map-list-item:last-child{border-bottom:0}.park-map-list-item strong{display:block;font-size:.88rem}.park-map-list-item small{display:block;margin-top:3px;color:var(--muted);font-size:.72rem}.park-map-list-pin{color:#2f6f51;font-size:1rem}.park-map-list-pin.is-rally{color:var(--accent)}.park-map-list-item>b{color:var(--accent);font-size:1.15rem}.park-map-empty{padding:16px;color:var(--muted)}
.park-map-coordinate-note{margin:12px 16px 0;color:var(--muted);font-size:.72rem;line-height:1.5}
.park-map-detail-sheet{position:fixed;inset:0;z-index:1100;display:none}.park-map-detail-sheet.open{display:block}.park-map-detail-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.72)}.park-map-detail-panel{position:absolute;left:0;right:0;bottom:0;max-height:92dvh;overflow:auto;padding:12px 14px calc(30px + env(safe-area-inset-bottom));border-radius:24px 24px 0 0;background:var(--bg);box-shadow:0 -18px 50px rgba(0,0,0,.42)}.park-map-detail-heading{padding:3px 48px 12px 2px}.park-map-detail-heading span{color:var(--accent);font-size:.65rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.park-map-detail-heading h3{margin:4px 0 0;color:var(--text);font-family:var(--font-display,Georgia,serif);font-size:1.25rem}.park-map-detail-panel #parkMapDetailContent{display:grid;gap:12px}
.park-map-detail-panel #parkMapDetailContent{width:100%;min-width:0}
.park-map-detail-panel #parkMapDetailContent>*{width:100%;min-width:0;max-width:100%}
.park-map-detail-panel .park-description-copy,.park-map-detail-panel .park-description-copy p{max-width:100%;overflow-wrap:anywhere}
@media (min-width:760px){.park-map-screen{max-width:1100px;margin:0 auto}.park-map-toolbar{grid-template-columns:minmax(330px,430px) minmax(240px,1fr);align-items:center}.park-map-frame{height:650px}.park-map-detail-panel{left:50%;right:auto;width:min(720px,94vw);transform:translateX(-50%);border-radius:24px 24px 0 0}.park-map-directory{grid-template-columns:1fr 1fr}.park-map-list-item:nth-child(odd){border-right:1px solid color-mix(in srgb,var(--line) 55%,transparent)}}

/* Version 50.1: KZN Park Map coordinate sync */
.park-map-home-icon img{width:100%;height:100%;object-fit:contain;display:block}

/* ===================== Version 50.5: Theme-aware button contrast =====================
   Keep ordinary action buttons readable on dark theme surfaces. Selected/highlighted
   controls retain their existing accent contrast, while light map controls and solid
   gold confirmation controls keep dark text. */
html[data-theme] {
  --button-text: var(--cream, #fff8ea);
  --button-text-muted: color-mix(in srgb, var(--cream, #fff8ea) 76%, var(--muted, #c8c0b2));
  --button-on-light: var(--ink, #171006);
}

html[data-theme] :where(
  button:not(.active):not(.is-active):not([aria-selected="true"]):not([aria-pressed="true"]):not(.danger):not(.admin-danger-action),
  [role="button"]:not(.active):not(.is-active):not([aria-selected="true"]):not([aria-pressed="true"]),
  a[class*="-button"]:not(.active):not(.is-active),
  a[class*="-btn"]:not(.active):not(.is-active),
  a[class*="-action"]:not(.active):not(.is-active)
) {
  color: var(--button-text) !important;
  -webkit-text-fill-color: var(--button-text) !important;
}

html[data-theme] :where(
  button:not(.active):not(.is-active),
  [role="button"]:not(.active):not(.is-active)
) :where(span, strong, small, b, i) {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme] .app button:disabled:not(.active):not(.is-active):not(.danger):not(.admin-danger-action) {
  color: var(--button-text-muted) !important;
  -webkit-text-fill-color: var(--button-text-muted) !important;
}

/* Controls which intentionally sit on a pale or solid-gold background. */
html[data-theme] .park-map-controls button,
html[data-theme] .settings-update-button,
html[data-theme] .settings-actions .primary,
html[data-theme] .settings-profile-submit:not(:disabled),
html[data-theme] .notification-setup-reminder > button:not(.notification-reminder-dismiss),
html[data-theme] .notification-test-confirm button.primary,
html[data-theme] .notification-setup-modal-actions button.primary,
html[data-theme] .park-rating-submit,
html[data-theme] .admin-park-rating-filters button,
html[data-theme] .guest-admin-dialog-actions button[type="submit"],
html[data-theme] .sudoku-win-card .primary,
html[data-theme] .wj-action-row .wj-guess-btn,
html[data-theme] .wj-win-card .primary,
html[data-theme] .game-modal-card .primary,
html[data-theme] .guest-success button {
  color: var(--button-on-light) !important;
  -webkit-text-fill-color: var(--button-on-light) !important;
}

/* Selected controls already receive an accent fill from their component/theme. */
html[data-theme] button.active :where(span, strong, small, b, i),
html[data-theme] button.is-active :where(span, strong, small, b, i),
html[data-theme] button[aria-selected="true"] :where(span, strong, small, b, i),
html[data-theme] button[aria-pressed="true"] :where(span, strong, small, b, i) {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}
/* ===================== End Version 50.5 ===================== */

/* ===================== v51 MIDLANDS CLASSIFIEDS ===================== */
.classifieds-screen { min-height: 100dvh; padding-bottom: 110px; background: var(--bg); color: var(--text); }
.classifieds-page-header { display: grid; grid-template-columns: 48px minmax(0,1fr); align-items: center; gap: 12px; }
.classifieds-header-icon { width: 58px; height: 58px; justify-self: end; }
.classifieds-header-icon img { width: 100%; height: 100%; object-fit: contain; }
.classifieds-hero { margin: 20px 18px 12px; padding: 22px; border: 1px solid var(--border); border-radius: 26px; background: linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 92%, var(--gold) 8%), var(--surface)); box-shadow: var(--shadow-soft); }
.classifieds-overline { display: block; margin-bottom: 7px; color: var(--gold-light); font-size: 9px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.classifieds-hero h3 { margin: 0; font-family: var(--font-display); font-size: 27px; line-height: 1.05; }
.classifieds-hero p { margin: 9px 0 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.classifieds-hero-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 18px; }
.classifieds-primary,.classifieds-secondary { min-height: 46px; padding: 0 15px; border-radius: 14px; font-size: 11px; font-weight: 900; }
.classifieds-primary { border: 1px solid color-mix(in srgb, var(--gold) 72%, transparent); background: var(--gold); color: var(--on-accent, #171006); }
.classifieds-secondary { border: 1px solid var(--border); background: var(--surface-raised); color: var(--text); }
.classifieds-disclaimer { margin: 0 18px 13px; padding: 14px 16px; border-left: 3px solid var(--gold); border-radius: 4px 16px 16px 4px; background: color-mix(in srgb, var(--surface-raised) 92%, transparent); }
.classifieds-disclaimer strong { color: var(--gold-light); font-size: 11px; }
.classifieds-disclaimer p { margin: 5px 0 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.classifieds-controls { margin: 0 18px 12px; padding: 14px; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); }
.classifieds-search input,.classifieds-select-row select { width: 100%; min-height: 46px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-raised); color: var(--text); font-size: 12px; }
.classifieds-search input { padding: 0 14px; }
.classifieds-filter-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 6px; margin-top: 10px; }
.classifieds-filter-row button { min-height: 38px; padding: 5px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface-raised); color: var(--text); font-size: 9px; font-weight: 850; }
.classifieds-filter-row button.active { border-color: var(--gold); background: var(--gold); color: var(--on-accent, #171006); }
.classifieds-select-row { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 10px; }
.classifieds-select-row label { display: grid; gap: 5px; color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.classifieds-select-row select { padding: 0 12px; text-transform: none; letter-spacing: 0; }
.classifieds-count-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 20px 10px; }
.classifieds-count-row strong { font-family: var(--font-display); font-size: 17px; }
.classifieds-count-row button { min-height: 36px; padding: 0 13px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface); color: var(--text); font-size: 9px; font-weight: 850; }
.classifieds-loading { margin: 25px 18px; padding: 24px; text-align: center; color: var(--muted); }
.classifieds-loading span { display: inline-block; width: 18px; height: 18px; margin-right: 8px; border: 2px solid var(--border); border-top-color: var(--gold); border-radius: 50%; animation: classifieds-spin .8s linear infinite; vertical-align: middle; }
@keyframes classifieds-spin { to { transform: rotate(360deg); } }
.classifieds-message { margin: 10px 18px; padding: 12px 14px; border: 1px solid color-mix(in srgb, #d36b57 65%, transparent); border-radius: 14px; background: color-mix(in srgb, #5f2018 35%, var(--surface)); color: #ffe1d8; font-size: 10px; line-height: 1.5; }
.classifieds-message.success { border-color: color-mix(in srgb, #58b879 65%, transparent); background: color-mix(in srgb, #174f2b 40%, var(--surface)); color: #dfffea; }
.classifieds-message.info { border-color: var(--border); background: var(--surface-raised); color: var(--muted); }
.classifieds-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; padding: 0 18px; }
.classified-card { display: grid; grid-template-rows: 150px auto; min-width: 0; overflow: hidden; padding: 0; text-align: left; border: 1px solid var(--border); border-radius: 19px; background: var(--surface); color: var(--text); box-shadow: var(--shadow-soft); }
.classified-card-image { position: relative; display: block; overflow: hidden; background: color-mix(in srgb, var(--surface-raised) 88%, var(--gold) 12%); }
.classified-card-image img { width: 100%; height: 100%; object-fit: cover; }
.classified-card-placeholder { display: grid; width: 100%; height: 100%; place-items: center; font-size: 42px; }
.classified-card-image > span.is-sold { position: absolute; top: 9px; right: 9px; padding: 5px 8px; border-radius: 999px; background: #b64a3e; color: white; font-size: 8px; font-weight: 900; text-transform: uppercase; }
.classified-card.is-sold .classified-card-image img { filter: grayscale(.35); opacity: .72; }
.classified-card-copy { display: grid; align-content: start; gap: 5px; padding: 13px; min-width: 0; }
.classified-card-meta { color: var(--gold-light); font-size: 8px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.classified-card-copy strong { font-family: var(--font-display); font-size: 16px; line-height: 1.12; overflow-wrap: anywhere; }
.classified-card-copy b { color: var(--gold-light); font-size: 12px; }
.classified-card-copy small { color: var(--muted); font-size: 9px; line-height: 1.45; }
.classifieds-empty { grid-column: 1/-1; padding: 36px 22px; border: 1px dashed var(--border); border-radius: 20px; text-align: center; background: var(--surface); }
.classifieds-empty strong { font-family: var(--font-display); font-size: 19px; }
.classifieds-empty p { margin: 7px 0 0; color: var(--muted); font-size: 11px; }
.classifieds-sheet { position: fixed; inset: 0; z-index: 95; display: flex; align-items: flex-end; justify-content: center; }
.classifieds-backdrop { position: absolute; inset: 0; border: 0; background: rgba(0,0,0,.72); }
.classifieds-detail-panel,.classifieds-form-panel { position: relative; width: min(620px,100%); max-height: 92dvh; overflow-y: auto; border: 1px solid var(--border); border-radius: 28px 28px 0 0; background: var(--surface-raised); box-shadow: 0 -24px 70px rgba(0,0,0,.5); }
.classifieds-form-panel { padding: 22px 18px calc(24px + env(safe-area-inset-bottom)); }
.classifieds-close { position: sticky; z-index: 3; float: right; top: 12px; right: 12px; width: 40px; height: 40px; margin: 12px 12px -52px 0; border: 1px solid var(--border); border-radius: 50%; background: color-mix(in srgb, var(--surface) 92%, transparent); color: var(--text); font-size: 22px; }
.classifieds-detail-gallery { background: #080b09; }
.classifieds-detail-main-image { height: min(48dvh,420px); }
.classifieds-detail-main-image img { width: 100%; height: 100%; object-fit: contain; }
.classifieds-detail-empty-image { display: grid; height: 240px; place-items: center; color: var(--muted); }
.classifieds-detail-thumbs { display: flex; gap: 7px; padding: 8px 12px 12px; overflow-x: auto; }
.classifieds-detail-thumbs button { flex: 0 0 60px; height: 52px; padding: 0; overflow: hidden; border: 2px solid transparent; border-radius: 9px; background: transparent; }
.classifieds-detail-thumbs button.active { border-color: var(--gold); }
.classifieds-detail-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.classifieds-detail-copy { padding: 20px 18px calc(25px + env(safe-area-inset-bottom)); }
.classifieds-detail-badges { display: flex; flex-wrap: wrap; gap: 6px; padding-right: 48px; }
.classifieds-detail-badges span { padding: 5px 8px; border: 1px solid var(--border); border-radius: 999px; color: var(--gold-light); font-size: 8px; font-weight: 900; text-transform: uppercase; }
.classifieds-detail-copy h3 { margin: 12px 0 4px; font-family: var(--font-display); font-size: 28px; line-height: 1.08; overflow-wrap: anywhere; }
.classifieds-detail-price { color: var(--gold-light); font-size: 20px; font-weight: 900; }
.classifieds-detail-description { white-space: pre-wrap; color: var(--text); font-size: 12px; line-height: 1.7; }
.classifieds-detail-facts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin: 17px 0; }
.classifieds-detail-facts div { padding: 11px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); }
.classifieds-detail-facts span { display: block; color: var(--muted); font-size: 7px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.classifieds-detail-facts strong { display: block; margin-top: 4px; font-size: 10px; overflow-wrap: anywhere; }
.classifieds-contact-actions { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.classifieds-contact-actions a { display: grid; min-height: 46px; place-items: center; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); color: var(--text); font-size: 10px; font-weight: 900; text-decoration: none; }
.classifieds-contact-actions a.classifieds-contact-primary { border-color: #3f9e62; background: #287849; color: white; }
.classifieds-sold-contact { grid-column: 1/-1; padding: 13px; border-radius: 13px; background: color-mix(in srgb, #a3463d 25%, var(--surface)); color: #ffdcd7; text-align: center; font-size: 10px; font-weight: 800; }
.classifieds-safety-note { margin: 14px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.classifieds-form-panel > h3 { margin: 0; font-family: var(--font-display); font-size: 25px; }
.classifieds-form-panel > p { margin: 7px 44px 18px 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.classifieds-form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.classifieds-form label,.classifieds-manage-lookup label { display: grid; gap: 5px; color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.classifieds-form label.full,.classifieds-form .full { grid-column: 1/-1; }
.classifieds-form input,.classifieds-form select,.classifieds-form textarea,.classifieds-manage-lookup input { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); color: var(--text); font-size: 12px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.classifieds-form textarea { resize: vertical; line-height: 1.55; }
.classifieds-form-section { grid-column: 1/-1; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--border); }
.classifieds-form-section strong { color: var(--gold-light); font-family: var(--font-display); font-size: 15px; }
.classifieds-file-field small { color: var(--muted); font-size: 8px; text-transform: none; letter-spacing: 0; }
.classifieds-file-preview { display: grid; gap: 6px; }
.classifieds-file-preview > div { display: grid; grid-template-columns: minmax(0,1fr) auto 32px; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); font-size: 9px; }
.classifieds-file-preview span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.classifieds-file-preview small { color: var(--muted); }
.classifieds-file-preview button { width: 30px; height: 30px; border: 0; border-radius: 50%; background: color-mix(in srgb, #b84b40 24%, var(--surface-raised)); color: #ffd9d3; }
.classifieds-methods { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0; padding: 12px; border: 1px solid var(--border); border-radius: 13px; }
.classifieds-methods legend { padding: 0 5px; color: var(--muted); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.classifieds-methods label,.classifieds-consent { display: flex; align-items: flex-start; gap: 8px; text-transform: none; letter-spacing: 0; line-height: 1.45; }
.classifieds-methods input,.classifieds-consent input { width: 18px; min-height: 18px; flex: 0 0 18px; padding: 0; }
.classifieds-progress { position: relative; min-height: 48px; overflow: hidden; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); }
.classifieds-progress > span { position: absolute; inset: 0 auto 0 0; width: 0; background: color-mix(in srgb, var(--gold) 28%, transparent); }
.classifieds-progress strong { position: relative; z-index: 1; display: grid; min-height: 48px; place-items: center; font-size: 9px; }
.classifieds-form-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 7px; }
.classifieds-manage-lookup { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.classifieds-manage-lookup button { grid-column: 1/-1; }
.classifieds-manage-list { display: grid; gap: 10px; margin-top: 14px; }
.classifieds-manage-card { display: grid; grid-template-columns: 72px minmax(0,1fr); gap: 11px; padding: 11px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); }
.classifieds-manage-card.is-inactive { opacity: .7; }
.classifieds-manage-card.no-image { grid-template-columns: 1fr; }
.classifieds-manage-card > img { width: 72px; height: 72px; border-radius: 11px; object-fit: cover; }
.classifieds-manage-card > div { min-width: 0; }
.classifieds-manage-card span { color: var(--gold-light); font-size: 7px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.classifieds-manage-card strong { display: block; margin: 4px 0; font-family: var(--font-display); font-size: 14px; }
.classifieds-manage-card small,.classifieds-manage-card p { color: var(--muted); font-size: 8px; line-height: 1.45; }
.classifieds-manage-card nav { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.classifieds-manage-card button { min-height: 34px; padding: 0 9px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-raised); color: var(--text); font-size: 8px; font-weight: 850; }
.classifieds-manage-card button.danger { color: #ffd2cb; border-color: color-mix(in srgb,#d66b5d 60%,transparent); }
.admin-classified-preview { width: 64px; height: 64px; border-radius: 12px; object-fit: cover; }
.admin-classified-status { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.admin-classified-status span { padding: 4px 7px; border-radius: 999px; background: rgba(255,255,255,.06); color: var(--gold-light); font-size: 8px; font-weight: 800; }

@media (max-width: 430px) {
  .classifieds-grid { grid-template-columns: 1fr; }
  .classified-card { grid-template-columns: 126px minmax(0,1fr); grid-template-rows: auto; min-height: 132px; }
  .classified-card-image { min-height: 132px; }
  .classifieds-filter-row { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 360px) {
  .classifieds-hero-actions,.classifieds-select-row,.classifieds-form,.classifieds-manage-lookup { grid-template-columns: 1fr; }
  .classifieds-form label.full,.classifieds-form .full,.classifieds-form-section,.classifieds-manage-lookup button { grid-column: auto; }
  .classifieds-detail-facts,.classifieds-contact-actions { grid-template-columns: 1fr; }
}

/* v51.1 automatic classifieds member identity */
.classifieds-form input[readonly], .classifieds-manage-lookup input[readonly] {
  opacity: .9;
  cursor: default;
  border-style: dashed;
}
.classifieds-identity-note {
  margin: -.25rem 0 .35rem;
  color: var(--text-soft, var(--muted));
  font-size: .82rem;
}

/* v51.3 — Classifieds storage safeguards */
.admin-classified-storage {
  margin-top: 18px;
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--accent, #d7aa37) 45%, transparent);
  border-radius: 22px;
  background: color-mix(in srgb, var(--panel, #0d2f20) 92%, transparent);
}
.admin-classified-storage-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.admin-classified-storage-heading h4 {
  margin: 3px 0 4px;
  font-family: var(--display-font, Georgia, serif);
  font-size: 1.2rem;
}
.admin-classified-storage-heading p,
.admin-classified-storage > p {
  margin: 0;
  color: var(--muted, #d9cfae);
  line-height: 1.5;
}
.admin-classified-storage-heading > span {
  flex: 0 0 auto;
  padding: 8px 11px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #d7aa37) 16%, transparent);
  color: var(--text, #fff8e8);
  font-size: .76rem;
  font-weight: 800;
}
.admin-classified-storage-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0 12px;
}
.admin-classified-storage-grid > div {
  min-width: 0;
  padding: 12px;
  border-radius: 15px;
  background: color-mix(in srgb, var(--panel-strong, #123b28) 94%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent, #d7aa37) 20%, transparent);
}
.admin-classified-storage-grid span {
  display: block;
  margin-bottom: 5px;
  color: var(--muted, #d9cfae);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.admin-classified-storage-grid strong {
  display: block;
  color: var(--text, #fff8e8);
  font-size: 1rem;
  overflow-wrap: anywhere;
}
@media (max-width: 760px) {
  .admin-classified-storage-heading { flex-direction: column; }
  .admin-classified-storage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-classified-storage-grid > div:last-child { grid-column: 1 / -1; }
}

/* =====================================================================
   v52.0 — Emergency Assistance Hub
   ===================================================================== */
.emergency-home-tile .visual-icon-wrap {
  width: 88px;
  height: 88px;
  margin-top: 5px;
  margin-bottom: 2px;
}
.emergency-home-tile .visual-icon-wrap img { object-fit: contain; }

.emergency-screen {
  --emergency-red: #d94b43;
  --emergency-red-dark: #8e211d;
  --emergency-green: #298a57;
  --emergency-cream: #fff5df;
}
.emergency-page-header { padding-right: 112px; }
.emergency-page-header::after { display: none; }
.emergency-page-header::before { right: 112px; }
.emergency-header-icon {
  position: absolute;
  top: 22px;
  right: 18px;
  width: 88px;
  height: 88px;
  object-fit: contain;
  filter: drop-shadow(0 14px 18px rgba(0,0,0,.48));
}
.emergency-hero {
  display: grid;
  gap: 18px;
  margin: 18px 16px 12px;
  padding: 22px;
  overflow: hidden;
  position: relative;
  border: 1px solid rgba(255,151,139,.38);
  border-radius: 24px;
  background:
    radial-gradient(circle at 100% 0%, rgba(255,255,255,.15), transparent 34%),
    linear-gradient(145deg, #6f1817, #a42d29 54%, #681413);
  box-shadow: 0 22px 42px rgba(62,4,3,.36), inset 0 1px 0 rgba(255,255,255,.12);
}
.emergency-hero::after {
  content: "SOS";
  position: absolute;
  right: -12px;
  bottom: -27px;
  color: rgba(255,255,255,.055);
  font: 900 88px/1 var(--font-body);
  letter-spacing: -.08em;
  pointer-events: none;
}
.emergency-hero > div { position: relative; z-index: 1; }
.emergency-hero span,
.emergency-section-heading > span {
  display: block;
  color: var(--gold-light);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.emergency-hero h3 {
  margin: 5px 0 8px;
  color: #fff;
  font: 700 clamp(1.65rem, 7vw, 2.2rem)/1.04 var(--font-display);
  letter-spacing: -.035em;
}
.emergency-hero p {
  max-width: 390px;
  margin: 0;
  color: rgba(255,255,255,.84);
  font-size: 12px;
  line-height: 1.62;
}
.emergency-hero p strong { color: #fff; }
.emergency-hero-call {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 58px;
  border: 1px solid rgba(255,255,255,.62);
  border-radius: 17px;
  background: linear-gradient(180deg, #fff8e9, #ead9b6);
  color: #5f1311;
  font-size: 15px;
  font-weight: 900;
  box-shadow: 0 14px 28px rgba(25,0,0,.32), inset 0 1px 0 #fff;
}
.emergency-safety-note {
  display: grid;
  gap: 4px;
  margin: 0 16px 16px;
  padding: 13px 14px;
  border: 1px solid color-mix(in srgb, var(--gold) 25%, transparent);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface-raised) 94%, transparent);
}
.emergency-safety-note strong { color: var(--gold-light); font-size: 10px; }
.emergency-safety-note span { color: var(--muted); font-size: 9px; line-height: 1.5; }
.emergency-message {
  margin: 0 16px 14px;
  padding: 12px 14px;
  border: 1px solid var(--border-strong);
  border-radius: 13px;
  background: var(--surface-raised);
  font-size: 10px;
  line-height: 1.5;
}
.emergency-message.success { border-color: rgba(75,183,118,.55); color: #bdf2cf; }
.emergency-message.error { border-color: rgba(224,91,78,.6); color: #ffd0cb; }

.emergency-section {
  margin: 14px 16px 0;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 22px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--gold) 7%, transparent), transparent 15rem),
    linear-gradient(145deg, var(--surface-raised), var(--surface));
  box-shadow: var(--card-shadow), inset 0 1px 0 rgba(255,255,255,.04);
}
.emergency-section-heading { margin-bottom: 15px; }
.emergency-section-heading h3 {
  margin: 4px 0 5px;
  color: var(--cream);
  font: 700 21px/1.12 var(--font-display);
  letter-spacing: -.025em;
}
.emergency-section-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.55;
}
.emergency-contact-grid { display: grid; gap: 10px; }
.emergency-contact-card {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr);
  gap: 11px;
  align-items: start;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 17px;
  background: color-mix(in srgb, var(--surface-soft) 72%, var(--surface));
}
.emergency-contact-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(236,112,101,.38);
  border-radius: 15px;
  background: rgba(158,45,39,.24);
  color: #ffb4aa;
  font-size: 18px;
  font-weight: 900;
}
.emergency-contact-copy { min-width: 0; }
.emergency-contact-copy > span {
  color: var(--gold-light);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.emergency-contact-copy h4 {
  margin: 3px 0 5px;
  color: var(--cream);
  font: 700 15px/1.16 var(--font-display);
}
.emergency-contact-copy p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.5;
}
.emergency-contact-copy small { color: color-mix(in srgb, var(--muted) 74%, transparent); font-size: 7px; }
.emergency-contact-actions {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
}
.emergency-contact-actions:has(> :only-child) { grid-template-columns: 1fr; }
.emergency-call-button,
.emergency-whatsapp-button,
.emergency-location-actions button,
.emergency-location-actions a,
.emergency-rally-actions button,
.emergency-rally-actions a,
.emergency-share-actions button,
.emergency-ice-actions button {
  min-height: 44px;
  display: grid;
  place-items: center;
  padding: 9px 12px;
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  color: var(--cream);
  background: var(--surface-raised);
  font-size: 9px;
  font-weight: 900;
  text-align: center;
  text-decoration: none;
}
.emergency-call-button,
.emergency-location-actions button:first-child,
.emergency-share-actions button:last-child,
.emergency-ice-actions button:last-child {
  border-color: rgba(244,131,119,.55);
  background: linear-gradient(145deg, #a7352f, #7d211d);
  color: #fff;
}
.emergency-whatsapp-button {
  border-color: rgba(67,191,116,.5);
  background: linear-gradient(145deg, #2d8d58, #1e6c42);
  color: #fff;
}
.emergency-loading,
.emergency-empty {
  padding: 18px;
  border: 1px dashed var(--border-strong);
  border-radius: 15px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.55;
  text-align: center;
}
.emergency-loading span {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 8px;
  border: 2px solid var(--border-strong);
  border-top-color: var(--gold);
  border-radius: 50%;
  animation: emergency-spin .8s linear infinite;
}
@keyframes emergency-spin { to { transform: rotate(360deg); } }

.emergency-location-status {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--surface);
}
.emergency-location-status strong { color: var(--cream); font-size: 11px; }
.emergency-location-status span { color: var(--muted); font-size: 9px; line-height: 1.5; overflow-wrap: anywhere; }
.emergency-location-actions,
.emergency-share-actions,
.emergency-rally-actions,
.emergency-ice-actions {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
  margin-top: 10px;
}
.emergency-location-actions:has(> :only-child),
.emergency-rally-actions:has(> :only-child) { grid-template-columns: 1fr; }
.emergency-rally-select {
  display: grid;
  gap: 6px;
  margin-bottom: 11px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.emergency-rally-select select,
.emergency-ice-editor input,
.emergency-ice-editor textarea {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
  color: var(--cream);
  font: 500 11px/1.4 var(--font-body);
  text-transform: none;
  letter-spacing: 0;
}
.emergency-rally-card {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 17px;
  background: var(--surface);
}
.emergency-rally-heading {
  padding: 15px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--green) 34%, var(--surface-raised)), var(--surface));
}
.emergency-rally-heading span { color: var(--gold-light); font-size: 8px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.emergency-rally-heading h4 { margin: 4px 0 2px; font: 700 18px/1.15 var(--font-display); }
.emergency-rally-heading p { margin: 0; color: var(--muted); font-size: 9px; }
.emergency-rally-card dl,
.emergency-ice-summary dl { margin: 0; }
.emergency-rally-card dl > div,
.emergency-ice-summary dl > div {
  display: grid;
  grid-template-columns: minmax(90px,.8fr) minmax(0,1.4fr);
  gap: 9px;
  padding: 10px 14px;
  border-top: 1px solid var(--border);
}
.emergency-rally-card dt,
.emergency-ice-summary dt { color: var(--muted); font-size: 8px; font-weight: 800; }
.emergency-rally-card dd,
.emergency-ice-summary dd { margin: 0; color: var(--cream); font-size: 9px; line-height: 1.45; overflow-wrap: anywhere; }
.emergency-rally-extra { padding: 13px 14px; border-top: 1px solid var(--border); }
.emergency-rally-extra > strong { color: var(--gold-light); font-size: 9px; }
.emergency-rally-extra > div {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto auto;
  align-items: center;
  gap: 7px;
  margin-top: 8px;
  color: var(--muted);
  font-size: 8px;
}
.emergency-rally-extra b { color: var(--cream); font-size: 8px; overflow-wrap: anywhere; }
.emergency-rally-extra button { min-height: 32px; border: 1px solid rgba(244,131,119,.45); border-radius: 9px; background: #81231f; color: #fff; font-size: 8px; }
.emergency-rally-card > .emergency-rally-actions { margin: 0; padding: 12px 14px 14px; border-top: 1px solid var(--border); }
.emergency-muted { margin: 0; padding: 14px; color: var(--muted); font-size: 9px; line-height: 1.5; }

.emergency-ice-summary {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--surface);
}
.emergency-ice-summary > p { margin: 0; padding: 15px; color: var(--muted); font-size: 9px; }
.emergency-ice-editor { margin-top: 11px; }
.emergency-ice-editor > summary {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 13px;
  border: 1px solid var(--border-strong);
  border-radius: 13px;
  background: var(--surface-raised);
  color: var(--cream);
  font-size: 10px;
  font-weight: 850;
  cursor: pointer;
  list-style: none;
}
.emergency-ice-editor > summary::-webkit-details-marker { display: none; }
.emergency-ice-editor > summary::after { content: "+"; color: var(--gold-light); font-size: 18px; }
.emergency-ice-editor[open] > summary::after { content: "–"; }
.emergency-ice-editor form {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 9px;
  padding-top: 12px;
}
.emergency-ice-editor label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.emergency-ice-editor .full { grid-column: 1 / -1; }
.emergency-ice-editor textarea { resize: vertical; }
.emergency-ice-actions button:first-child { color: #ffd0cb; border-color: rgba(224,91,78,.45); }
.emergency-call-checklist ol {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  counter-reset: emergency-step;
  list-style: none;
}
.emergency-call-checklist li {
  position: relative;
  min-height: 38px;
  padding: 9px 10px 9px 42px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  color: var(--muted);
  font-size: 9px;
  line-height: 1.45;
  counter-increment: emergency-step;
}
.emergency-call-checklist li::before {
  content: counter(emergency-step);
  position: absolute;
  left: 9px;
  top: 50%;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  transform: translateY(-50%);
  border-radius: 8px;
  background: color-mix(in srgb, var(--gold) 18%, var(--surface-raised));
  color: var(--gold-light);
  font-size: 9px;
  font-weight: 900;
}

@media (min-width: 480px) {
  .emergency-hero { grid-template-columns: minmax(0,1fr) 150px; align-items: center; }
  .emergency-contact-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .emergency-contact-card:first-child { grid-column: 1 / -1; }
}
@media (max-width: 370px) {
  .emergency-page-header { padding-right: 92px; }
  .emergency-header-icon { width: 72px; height: 72px; right: 12px; top: 30px; }
  .emergency-location-actions,
  .emergency-share-actions,
  .emergency-rally-actions,
  .emergency-ice-actions,
  .emergency-ice-editor form { grid-template-columns: 1fr; }
  .emergency-ice-editor .full { grid-column: auto; }
}
.emergency-source-link {
  display: inline-block;
  margin-top: 7px;
  color: var(--gold-light);
  font-size: 7px;
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 2px;
  overflow-wrap: anywhere;
}


/* =====================================================================
   v52.1 — Private Security Company Selector
   ===================================================================== */
.security-company-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.security-company-option {
  min-width: 0;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  gap: 2px 9px;
  min-height: 76px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-soft) 72%, var(--surface));
  color: var(--cream);
  text-align: left;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.security-company-option img {
  grid-row: 1 / 3;
  width: 58px;
  height: 58px;
  object-fit: contain;
  border-radius: 13px;
  filter: drop-shadow(0 5px 6px rgba(0,0,0,.28));
}
.security-company-option span {
  align-self: end;
  min-width: 0;
  color: var(--cream);
  font-size: 9px;
  font-weight: 850;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.security-company-option b {
  align-self: start;
  color: var(--muted);
  font-size: 7px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.security-company-option.selected {
  border-color: color-mix(in srgb, var(--gold) 78%, #fff 10%);
  background: color-mix(in srgb, var(--gold) 15%, var(--surface-raised));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--gold) 23%, transparent), inset 0 1px 0 rgba(255,255,255,.1);
}
.security-company-option.selected b { color: var(--gold-light); }
.security-company-continue {
  width: 100%;
  min-height: 46px;
  margin-top: 10px;
  border: 1px solid color-mix(in srgb, var(--gold) 55%, var(--border));
  border-radius: 13px;
  background: linear-gradient(145deg, var(--gold), color-mix(in srgb, var(--gold) 72%, #7b5314));
  color: #251806;
  font-size: 9px;
  font-weight: 900;
}
.security-company-continue:disabled { opacity: .45; filter: grayscale(.45); }
.security-company-summary {
  overflow: hidden;
  margin-top: 11px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--surface);
}
.security-company-summary > p { margin: 0; padding: 14px; color: var(--muted); font-size: 9px; }
.security-company-saved-heading {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 13px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--green) 25%, var(--surface-raised)), var(--surface));
}
.security-company-saved-heading img {
  width: 68px;
  height: 68px;
  object-fit: contain;
  border-radius: 15px;
  filter: drop-shadow(0 7px 8px rgba(0,0,0,.34));
}
.security-company-saved-heading span { color: var(--gold-light); font-size: 8px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.security-company-saved-heading h4 { margin: 3px 0 2px; color: var(--cream); font: 700 18px/1.12 var(--font-display); }
.security-company-saved-heading small { color: var(--muted); font-size: 8px; }
.security-company-saved-card dl { margin: 0; }
.security-company-saved-card dl > div {
  display: grid;
  grid-template-columns: minmax(90px,.8fr) minmax(0,1.4fr);
  gap: 9px;
  padding: 9px 13px;
  border-top: 1px solid var(--border);
}
.security-company-saved-card dt { color: var(--muted); font-size: 8px; font-weight: 800; }
.security-company-saved-card dd { margin: 0; color: var(--cream); font-size: 9px; line-height: 1.45; overflow-wrap: anywhere; }
.security-company-saved-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 8px;
  padding: 12px 13px 13px;
  border-top: 1px solid var(--border);
}
.security-company-saved-actions button,
.security-company-saved-actions a {
  min-height: 42px;
  display: grid;
  place-items: center;
  padding: 8px 10px;
  border: 1px solid var(--border-strong);
  border-radius: 11px;
  background: var(--surface-raised);
  color: var(--cream);
  font-size: 8px;
  font-weight: 900;
  text-align: center;
  text-decoration: none;
}
.security-company-saved-actions button:first-child { border-color: rgba(244,131,119,.55); background: linear-gradient(145deg,#a7352f,#7d211d); color:#fff; }
.security-company-saved-actions a { border-color: rgba(67,191,116,.5); background: linear-gradient(145deg,#2d8d58,#1e6c42); color:#fff; }
.security-company-editor { margin-top: 11px; }
.security-other-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 9px;
  padding: 11px;
  border: 1px dashed var(--border-strong);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-soft) 72%, transparent);
}
.security-other-fields[hidden] { display: none; }
.security-logo-upload input { padding: 8px; font-size: 8px; }
.security-logo-preview-wrap { display: grid; place-items: center; grid-column: 1 / -1; min-height: 70px; }
.security-logo-preview-wrap img { width: 82px; height: 82px; object-fit: contain; border-radius: 16px; filter: drop-shadow(0 7px 8px rgba(0,0,0,.3)); }
.security-private-warning {
  display: grid;
  gap: 4px;
  padding: 11px 12px;
  border: 1px solid rgba(224,91,78,.38);
  border-radius: 13px;
  background: rgba(121,31,27,.18);
  text-transform: none;
  letter-spacing: 0;
}
.security-private-warning strong { color: #ffd0cb; font-size: 8px; line-height: 1.45; }
.security-private-warning span { color: var(--muted); font-size: 8px; line-height: 1.45; }
@media (min-width: 620px) {
  .security-company-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .security-company-option { grid-template-columns: 1fr; grid-template-rows: 82px auto auto; justify-items: center; text-align: center; }
  .security-company-option img { grid-row: auto; width: 82px; height: 82px; }
}
@media (max-width: 370px) {
  .security-company-grid { grid-template-columns: 1fr; }
  .security-company-saved-actions,
  .security-other-fields { grid-template-columns: 1fr; }
  .security-logo-preview-wrap { grid-column: auto; }
}


/* =====================================================================
   VERSION 52.2 — RESPONSIVE DESKTOP & ADMIN WORKSPACE
   Mobile remains the baseline. These rules apply only to wider screens.
   ===================================================================== */
.admin-desktop-sidebar { display: none; }
.admin-editing-main { min-width: 0; }

@media (min-width: 900px) {
  body { padding: 14px 16px; }

  .app {
    width: min(1600px, calc(100vw - 32px));
    max-width: 1600px;
    min-height: calc(100dvh - 28px);
    border: 1px solid var(--border);
    border-radius: 30px;
    box-shadow: 0 24px 70px rgba(0,0,0,.42);
  }

  .hero {
    padding: 34px clamp(34px, 6vw, 94px) 40px;
  }
  .hero h1 { font-size: clamp(2.8rem, 4.1vw, 4.35rem); }
  .hero .tagline { font-size: 12px; }
  .clock { width: min(100%, 540px); }

  #screen-home main {
    padding: 16px clamp(26px, 3.2vw, 52px) 132px;
  }
  #screen-home .menu-section {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
  }
  #screen-home .grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
  }
  #screen-home .tile.featured { grid-column: span 2; }
  #screen-home .tile-wide { grid-column: span 2; }
  #screen-home .tile.visual-tile,
  #screen-home .tile.featured.visual-tile { min-height: 190px; }
  #screen-home .tile-wide.visual-tile { min-height: 142px; }
  #screen-home .section-heading h2 { font-size: 26px; }

  .screen {
    min-height: calc(100dvh - 108px);
    padding: 30px clamp(26px, 3.2vw, 52px) 132px;
  }
  .screen-header {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
  }

  .tabbar {
    width: min(760px, calc(100vw - 40px));
    max-width: 760px;
  }
  body.admin-route-active .tabbar { display: none; }
  body.admin-route-active .admin-screen { padding-bottom: 46px; }

  /* Admin workspace */
  .admin-screen { padding-inline: clamp(26px, 3.2vw, 52px); }
  .admin-page-header,
  .admin-setup-card,
  .admin-dashboard {
    width: 100%;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
  }
  .admin-login-card {
    width: min(720px, 100%);
    margin-left: auto;
    margin-right: auto;
    padding: 38px 42px 34px;
  }
  .admin-login-card > p { max-width: 560px; }
  .admin-dashboard { padding: 24px 28px 30px; }
  .admin-welcome { padding: 4px 4px 18px; }
  .admin-welcome h3 { font-size: 24px; }

  .admin-section-nav {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
    width: min(680px, 100%);
    gap: 8px;
  }
  .admin-section-nav button { min-height: 50px; font-size: 11px; }

  .admin-stats,
  .admin-stats.admin-stats-ten,
  .admin-stats.admin-stats-nine,
  .admin-stats.admin-stats-seven,
  .admin-stats.admin-stats-six,
  .admin-stats.admin-stats-five {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
  }
  .admin-stats > div { padding: 17px 12px; }
  .admin-stats span { font-size: 9px; }
  .admin-stats strong { font-size: 29px; }

  .admin-classified-storage-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .admin-edit-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
  }
  .admin-edit-grid button { min-height: 52px; font-size: 10px; }

  #adminEditingSection {
    display: grid;
    grid-template-columns: 246px minmax(0, 1fr);
    gap: 22px;
    align-items: start;
  }
  #adminEditingSection[hidden] { display: none !important; }

  .admin-desktop-sidebar {
    position: sticky;
    top: 16px;
    display: block;
    max-height: calc(100dvh - 120px);
    overflow: auto;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 19px;
    background:
      radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--gold) 10%, transparent), transparent 48%),
      color-mix(in srgb, var(--surface) 94%, transparent);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 14px 30px rgba(0,0,0,.18);
    scrollbar-width: thin;
  }
  .admin-desktop-sidebar-heading {
    display: grid;
    gap: 4px;
    margin: 1px 2px 13px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border);
  }
  .admin-desktop-sidebar-heading strong {
    color: var(--cream);
    font-family: var(--font-display);
    font-size: 18px;
  }
  .admin-desktop-sidebar-heading small {
    color: var(--muted);
    font-size: 9px;
    line-height: 1.45;
  }
  .admin-desktop-sidebar nav { display: grid; gap: 6px; }
  .admin-desktop-sidebar button {
    min-height: 42px;
    padding: 8px 11px;
    border: 1px solid transparent;
    border-radius: 11px;
    color: var(--muted);
    background: color-mix(in srgb, var(--surface-raised) 72%, transparent);
    font-size: 10px;
    font-weight: 850;
    text-align: left;
  }
  .admin-desktop-sidebar button:hover {
    color: var(--cream);
    border-color: var(--border-strong);
  }
  .admin-desktop-sidebar button.active {
    color: var(--ink);
    border-color: var(--gold-light);
    background: linear-gradient(135deg, var(--gold-light), var(--gold));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--gold) 16%, transparent);
  }

  .admin-editing-main { min-width: 0; }
  .admin-editing-header { margin: 0 0 13px; }
  .admin-editing-header > button { display: none; }
  .admin-editing-header h3 { font-size: 25px; }

  .admin-toolbar {
    position: sticky;
    top: 12px;
    z-index: 24;
    margin: 0 0 15px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background: color-mix(in srgb, var(--bg-soft) 94%, transparent);
    box-shadow: 0 12px 28px rgba(0,0,0,.22);
    backdrop-filter: blur(16px);
  }
  .admin-search { min-height: 50px; }
  .admin-add-btn { min-height: 50px; padding-inline: 20px; }

  .admin-record-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .admin-record-card {
    min-height: 132px;
    padding: 16px;
    gap: 12px;
  }
  .admin-record-main strong { font-size: 14px; white-space: normal; }
  .admin-record-main small { font-size: 10px; }
  .admin-record-number { font-size: 9px; }
  .admin-record-actions button { min-height: 38px; padding-inline: 11px; font-size: 9px; }
  .admin-loading,
  .admin-empty,
  .admin-record-list > .admin-message { grid-column: 1 / -1; }

  .admin-modal {
    align-items: center;
    padding: 24px;
  }
  .admin-modal-panel {
    width: min(980px, calc(100vw - 48px));
    max-height: calc(100dvh - 48px);
    padding: 26px 28px 28px;
    border-radius: 24px;
    transform: translateY(18px) scale(.985);
  }
  .admin-modal.open .admin-modal-panel { transform: none; }
  .admin-modal-panel .sheet-handle { display: none; }
  .admin-modal-panel h3 { font-size: 28px; }
  .admin-record-form #adminRecordFields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }
  .admin-record-form label { font-size: 10px; }
  .admin-form-actions {
    width: min(520px, 100%);
    margin: 8px 0 0 auto;
  }
}

@media (min-width: 1400px) {
  .admin-record-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* VERSION 52.2.1 — newsletter reader cleanup: instructional overlay removed. */

/* v54 reusable rally rate setup */
.admin-rate-warning{display:grid;gap:5px;padding:13px 15px;border:1px solid color-mix(in srgb,#d4a72c 68%,var(--border));border-radius:14px;background:color-mix(in srgb,#d4a72c 13%,var(--surface));}
.admin-rate-warning strong{color:var(--gold-light);font-size:.9rem;}.admin-rate-warning span{color:var(--text);font-size:.8rem;line-height:1.5;}
.admin-rally-rate-picker{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end;padding:14px;border:1px solid var(--border);border-radius:16px;background:color-mix(in srgb,var(--surface-2) 90%,transparent);}
.admin-rally-rate-picker .admin-secondary-btn{min-height:46px;white-space:nowrap;}
.admin-rally-rate-rows{display:grid;gap:10px;}
.admin-rally-rate-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,220px) auto;gap:12px;align-items:end;padding:14px;border:1px solid var(--border);border-radius:16px;background:color-mix(in srgb,var(--surface-2) 93%,transparent);}
.admin-rally-rate-row>div{display:grid;gap:4px;align-self:center}.admin-rally-rate-row strong{color:var(--text);font-size:.9rem}.admin-rally-rate-row small,.admin-rally-rate-row span{color:var(--muted);font-size:.75rem;line-height:1.4}.admin-rally-rate-row label{margin:0}.admin-rate-remove{min-height:44px;padding:0 14px;border:1px solid color-mix(in srgb,#b95f54 62%,var(--border));border-radius:12px;background:color-mix(in srgb,#b95f54 14%,transparent);color:var(--text);font-weight:800;}
.intention-rate-display span{display:grid;gap:3px}.intention-rate-display span small{color:var(--muted);font-size:.68rem;line-height:1.35;text-transform:none;font-weight:600}.intention-rate-display strong{font-size:.76rem;text-align:right;}
.intention-generic-rate-options{grid-template-columns:repeat(2,minmax(0,1fr));}
.intention-rate-option{grid-column:1/-1;display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;}
.intention-rate-option>span,.intention-rate-choice-option>span{display:grid;gap:3px}.intention-rate-option small,.intention-rate-choice-option small{color:var(--muted);font-size:.7rem;line-height:1.35}.intention-rate-quantity{width:86px!important;min-width:72px;}
.intention-rate-choice{grid-column:1/-1;display:grid;gap:8px;margin:0;padding:12px;border:1px solid var(--border);border-radius:14px;}
.intention-rate-choice legend{padding:0 7px;color:var(--gold-light);font-weight:900;font-size:.82rem}.intention-rate-choice legend small{color:var(--muted);font-weight:700;}
.intention-rate-choice-option{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px;border:1px solid color-mix(in srgb,var(--border) 76%,transparent);border-radius:12px;background:color-mix(in srgb,var(--surface-2) 88%,transparent);}
.intention-rate-choice-option input[type="radio"],.intention-rate-option input[type="checkbox"]{width:22px!important;height:22px!important;}
@media(max-width:700px){.admin-rally-rate-picker,.admin-rally-rate-row{grid-template-columns:1fr}.admin-rate-remove{width:100%}.intention-generic-rate-options{grid-template-columns:1fr}.intention-rate-option,.intention-rate-choice-option{grid-template-columns:auto minmax(0,1fr)}.intention-rate-quantity{grid-column:2;width:100%!important;}}

/* v55.2.0 Phase 3: multi-portfolio and member profile fields */
.admin-multi-select {
  margin: 0;
  padding: 14px;
  border: 1px solid var(--line, rgba(214, 170, 45, .34));
  border-radius: 16px;
  min-width: 0;
}
.admin-multi-select legend {
  padding: 0 6px;
  font-weight: 800;
}
.admin-multi-select legend small {
  display: block;
  margin-top: 2px;
  color: var(--muted, #c9c1ae);
  font-size: .78rem;
  font-weight: 600;
}
.admin-multi-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 8px;
}
.member-profile-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 8px auto 2px;
}
.member-profile-badges[hidden] { display: none; }
.member-profile-badges span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 11px;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 999px;
  background: rgba(0,0,0,.18);
  color: inherit;
  font-size: .82rem;
  font-weight: 800;
}
@media (max-width: 640px) {
  .admin-multi-check-grid { grid-template-columns: 1fr; }
}

/* v55.4.0 Phase 4: rally attendance and milestone automation */
.admin-milestone-panel{grid-column:1/-1;display:grid;gap:13px;padding:14px;border:1px solid color-mix(in srgb,var(--gold) 50%,transparent);border-radius:17px;background:linear-gradient(145deg,color-mix(in srgb,var(--panel-strong) 94%,var(--gold) 6%),var(--panel));}
.admin-milestone-panel.is-empty{opacity:.78}
.admin-milestone-panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.admin-milestone-panel-heading>div:first-child span{display:block;color:var(--gold);font-size:.68rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.admin-milestone-panel-heading h4{margin:3px 0 0;color:var(--cream);font-family:var(--font-display);font-size:1.2rem}
.admin-milestone-status{min-width:210px;padding:9px 11px;border:1px solid var(--gold-border);border-radius:12px;background:var(--panel-strong);text-align:right}
.admin-milestone-status strong,.admin-milestone-status small{display:block}.admin-milestone-status strong{color:var(--cream)}.admin-milestone-status small{margin-top:3px;color:var(--muted);font-size:.72rem;line-height:1.35}
.admin-milestone-forecast{display:grid;gap:9px}.admin-milestone-forecast>div:first-child strong,.admin-milestone-forecast>div:first-child small{display:block}.admin-milestone-forecast>div:first-child small{margin-top:2px;color:var(--muted);font-size:.72rem}
.admin-milestone-forecast-list{display:grid;gap:7px}.admin-milestone-forecast-list>p{margin:0;padding:10px;border-radius:11px;background:color-mix(in srgb,var(--panel-strong) 88%,transparent);color:var(--muted);font-size:.78rem}
.admin-milestone-forecast-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border:1px solid color-mix(in srgb,var(--gold-border) 80%,transparent);border-radius:12px;background:var(--panel-strong)}
.admin-milestone-forecast-row>span:first-child{display:grid;gap:2px}.admin-milestone-forecast-row small{color:var(--muted);font-size:.7rem}.admin-milestone-forecast-row em{color:var(--muted);font-size:.72rem;font-style:normal}
.admin-milestone-badges{display:flex;gap:5px;flex-wrap:wrap}.admin-milestone-badges span{padding:4px 7px;border:1px solid color-mix(in srgb,var(--gold) 48%,transparent);border-radius:999px;background:color-mix(in srgb,var(--gold) 13%,transparent);color:var(--cream);font-size:.66rem;font-weight:900}
.admin-milestone-actions{display:flex;gap:8px;flex-wrap:wrap}.admin-milestone-actions button{flex:1 1 190px;border:1px solid var(--gold-border);border-radius:999px;background:transparent;color:var(--cream);padding:9px 12px;font-weight:900}.admin-milestone-actions button.primary{background:var(--gold);color:var(--ink)}.admin-milestone-actions button:disabled{opacity:.48;cursor:not-allowed}
.admin-milestone-panel>p{margin:0;color:var(--muted);font-size:.72rem;line-height:1.45}
.admin-register-member-controls{display:grid;justify-items:end;gap:7px}.admin-attendance-toggle{display:flex;align-items:center;gap:7px;padding:6px 9px;border:1px solid var(--gold-border);border-radius:999px;background:var(--panel-strong);font-size:.74rem;font-weight:900;cursor:pointer}.admin-attendance-toggle.is-attended{background:color-mix(in srgb,var(--green) 22%,var(--panel-strong));border-color:color-mix(in srgb,var(--green) 55%,var(--gold-border))}.admin-attendance-toggle input{width:17px;height:17px;accent-color:var(--gold)}
.admin-milestone-none,.admin-milestone-warning{display:block;margin-top:4px;font-size:.7rem}.admin-milestone-none{color:var(--muted)}.admin-milestone-warning{color:#ffbfaa}
@media(max-width:620px){.admin-milestone-panel-heading,.admin-milestone-forecast-row{align-items:flex-start;flex-direction:column}.admin-milestone-status{min-width:0;width:100%;text-align:left}.admin-register-member-controls{justify-items:start}.admin-milestone-actions{display:grid;grid-template-columns:1fr}.admin-milestone-actions button{width:100%}}


/* v55.5.0 Phase 6: editable website-enquiry responses */
.admin-enquiry-response-status {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(214, 173, 79, .45);
  border-radius: 16px;
  background: rgba(214, 173, 79, .08);
}
.admin-enquiry-response-status div { display: grid; gap: 3px; }
.admin-enquiry-response-status span { font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; opacity: .78; }
.admin-enquiry-response-status strong { overflow-wrap: anywhere; }
.admin-enquiry-response-status small { grid-column: 1 / -1; }
.admin-enquiry-response-status.status-sent { border-color: rgba(88, 184, 116, .55); background: rgba(88, 184, 116, .1); }
.admin-enquiry-response-status.status-failed { border-color: rgba(219, 95, 82, .6); background: rgba(219, 95, 82, .1); }
.admin-enquiry-response-actions { display: grid; grid-template-columns: 1fr 1.2fr; gap: 10px; }
.admin-enquiry-history { display: grid; gap: 8px; }
.admin-enquiry-history details { border: 1px solid rgba(214, 173, 79, .28); border-radius: 14px; overflow: hidden; }
.admin-enquiry-history summary { cursor: pointer; display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; padding: 12px 14px; background: rgba(255,255,255,.035); }
.admin-enquiry-history summary span { text-align: right; font-size: .82rem; opacity: .78; }
.admin-enquiry-history summary small { grid-column: 1 / -1; overflow-wrap: anywhere; }
.admin-enquiry-history details > div { padding: 12px 14px; }
.admin-enquiry-history pre { margin: 10px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: .9rem; line-height: 1.5; }
@media (max-width: 620px) {
  .admin-enquiry-response-status, .admin-enquiry-response-actions { grid-template-columns: 1fr; }
  .admin-enquiry-response-status small { grid-column: auto; }
}


/* ===== v55.6.0 Phase 7: collision-safe daily celebrations ===== */
.celebration-groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 12px;
  margin-top: 14px;
}
.celebration-group {
  min-width: 0;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-raised) 88%, transparent);
}
.celebration-group-birthday {
  border-color: color-mix(in srgb, var(--gold) 42%, var(--border));
}
.celebration-group-anniversary {
  border-color: color-mix(in srgb, var(--rust-light) 42%, var(--border));
}
.celebration-group-heading {
  display: flex;
  align-items: center;
  gap: 10px;
}
.celebration-group-icon {
  display: grid;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--gold) 38%, var(--border));
  border-radius: 13px;
  background: color-mix(in srgb, var(--gold) 12%, var(--surface));
  font-size: 1.35rem;
}
.celebration-group-heading div { min-width: 0; }
.celebration-group-heading span:not(.celebration-group-icon) {
  display: block;
  color: var(--muted);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.celebration-group-heading strong {
  display: block;
  margin-top: 2px;
  color: var(--cream);
  font-size: 1rem;
}
.celebration-name-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.celebration-name-pill {
  max-width: 100%;
  padding: 7px 10px;
  border: 1px solid color-mix(in srgb, var(--gold) 34%, var(--border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 86%, transparent);
  color: var(--cream);
  overflow-wrap: anywhere;
}
.celebration-name-pill strong {
  display: block;
  font-size: .82rem;
  line-height: 1.25;
}
.celebration-group > p {
  margin: 11px 0 0;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.45;
}
@media (max-width: 520px) {
  .celebration-groups { grid-template-columns: 1fr; }
  .celebration-group { padding: 13px; }
  .celebration-name-list { display: grid; grid-template-columns: 1fr; }
  .celebration-name-pill { border-radius: 12px; }
}


/* ========================================================================== 
   v55.8.2 — Visual refinement, dashboard view and navigation cleanup
   ========================================================================== */
.home-version,
.settings-version-footer{
  display:grid;
  justify-items:center;
  gap:6px;
  color:color-mix(in srgb,var(--cream) 52%,transparent);
  text-align:center;
}
.home-version small,
.settings-version-footer small{
  color:color-mix(in srgb,var(--gold-light) 72%,var(--muted));
  font-size:clamp(11px,.82rem,14px);
  font-weight:700;
  letter-spacing:.035em;
}

/* Keep both home header controls perfectly level and the same visual size. */
.hero .theme-toggle,
.hero .home-alerts-button{
  top:16px !important;
  width:46px !important;
  height:46px !important;
  border-radius:15px !important;
  margin:0 !important;
}
.hero .theme-toggle{right:16px !important;}
.hero .home-alerts-button{left:16px !important;}

/* Larger, legible rally-intention ticker. */
.intention-ticker{
  min-height:52px;
  margin-top:14px;
  padding:14px 18px;
  display:flex;
  align-items:center;
  border-top:1px solid color-mix(in srgb,var(--gold) 22%,transparent);
  border-bottom:1px solid color-mix(in srgb,var(--gold) 18%,transparent);
}
.intention-ticker-track strong{
  font-size:clamp(14px,1.15vw,17px) !important;
  line-height:1.45 !important;
  font-weight:850;
  letter-spacing:.01em;
}

/* Admin statistics view switch. */
.admin-stats-heading-row{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:14px;
}
.admin-stats-heading-row .admin-section-heading{margin-bottom:0;}
.admin-stats-view-toggle{
  display:inline-grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:5px;
  padding:5px;
  min-width:min(330px,100%);
  border:1px solid color-mix(in srgb,var(--gold) 30%,var(--border));
  border-radius:16px;
  background:color-mix(in srgb,var(--surface) 88%,transparent);
}
.admin-stats-view-toggle button{
  min-height:44px;
  padding:8px 13px;
  border:1px solid transparent;
  border-radius:12px;
  color:var(--muted);
  background:transparent;
  font-weight:850;
}
.admin-stats-view-toggle button.active{
  color:#171006;
  border-color:color-mix(in srgb,var(--gold-light) 72%,transparent);
  background:linear-gradient(145deg,var(--gold-light),var(--gold));
  box-shadow:0 8px 22px color-mix(in srgb,var(--gold) 20%,transparent);
}
.admin-visual-dashboard[hidden],#adminStatsCardsView[hidden]{display:none!important;}
.admin-visual-dashboard{display:grid;gap:16px;}
.admin-viz-metrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.admin-viz-metric{
  position:relative;
  min-height:132px;
  padding:18px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--gold) 28%,var(--border));
  border-radius:22px;
  background:linear-gradient(150deg,color-mix(in srgb,var(--surface-raised) 95%,white 5%),var(--surface));
  box-shadow:0 18px 38px rgba(0,0,0,.17);
}
.admin-viz-metric::after{
  content:"";
  position:absolute;
  width:110px;
  height:110px;
  right:-42px;
  bottom:-48px;
  border:18px solid color-mix(in srgb,var(--viz-tone,var(--gold)) 18%,transparent);
  border-radius:50%;
}
.admin-viz-metric.tone-members{--viz-tone:var(--gold);}
.admin-viz-metric.tone-content{--viz-tone:#4fc08d;}
.admin-viz-metric.tone-rallies{--viz-tone:#ea8737;}
.admin-viz-metric.tone-queue{--viz-tone:#9875d1;}
.admin-viz-metric>span{display:block;color:var(--muted);font-size:.72rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase;}
.admin-viz-metric>strong{display:block;margin:8px 0 5px;color:var(--cream);font:700 clamp(2rem,3.2vw,3.2rem)/1 var(--font-display);}
.admin-viz-metric>small{position:relative;z-index:1;color:color-mix(in srgb,var(--cream) 74%,transparent);font-size:.78rem;line-height:1.35;}
.admin-viz-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.admin-viz-card{
  min-width:0;
  padding:20px;
  border:1px solid color-mix(in srgb,var(--gold) 25%,var(--border));
  border-radius:22px;
  background:linear-gradient(155deg,color-mix(in srgb,var(--surface-raised) 96%,white 4%),var(--surface));
  box-shadow:0 18px 38px rgba(0,0,0,.15);
}
.admin-viz-card>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:17px;}
.admin-viz-card>header span{display:block;color:var(--gold);font-size:.67rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase;}
.admin-viz-card>header h4{margin:4px 0 0;color:var(--cream);font-family:var(--font-display);font-size:1.32rem;}
.admin-viz-card>header>strong{color:var(--gold-light);font:700 2rem/1 var(--font-display);}
.admin-viz-donut-layout{display:grid;grid-template-columns:minmax(180px,.8fr) minmax(0,1.2fr);gap:20px;align-items:center;}
.admin-viz-donut{
  width:min(230px,100%);
  aspect-ratio:1;
  margin:auto;
  display:grid;
  place-items:center;
  border-radius:50%;
  box-shadow:0 18px 40px rgba(0,0,0,.25),inset 0 0 0 1px rgba(255,255,255,.1);
}
.admin-viz-donut::before{
  content:"";
  grid-area:1/1;
  width:62%;
  aspect-ratio:1;
  border-radius:50%;
  background:linear-gradient(145deg,var(--surface-raised),var(--surface));
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gold) 18%,transparent),0 8px 22px rgba(0,0,0,.18);
}
.admin-viz-donut>span{grid-area:1/1;position:relative;z-index:1;display:grid;text-align:center;}
.admin-viz-donut strong{color:var(--cream);font:700 2.4rem/1 var(--font-display);}
.admin-viz-donut small{margin-top:3px;color:var(--muted);font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;}
.admin-viz-legend{display:grid;gap:10px;}
.admin-viz-legend>div{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:9px;align-items:center;padding:9px 10px;border-radius:12px;background:color-mix(in srgb,var(--surface) 78%,transparent);}
.admin-viz-legend i{width:10px;height:10px;border-radius:50%;background:var(--legend-color);box-shadow:0 0 0 4px color-mix(in srgb,var(--legend-color) 18%,transparent);}
.admin-viz-legend span{color:color-mix(in srgb,var(--cream) 78%,transparent);font-size:.78rem;}
.admin-viz-legend strong{color:var(--cream);}
.admin-viz-bars{display:grid;gap:12px;}
.admin-viz-bar-row>div:first-child{display:flex;justify-content:space-between;gap:10px;margin-bottom:6px;color:color-mix(in srgb,var(--cream) 78%,transparent);font-size:.8rem;}
.admin-viz-bar-row>div:first-child strong{color:var(--cream);}
.admin-viz-bar-track{height:12px;overflow:hidden;border-radius:999px;background:color-mix(in srgb,var(--surface) 68%,black 32%);box-shadow:inset 0 1px 4px rgba(0,0,0,.28);}
.admin-viz-bar-track span{display:block;height:100%;min-width:7px;border-radius:inherit;background:linear-gradient(90deg,var(--gold),#efc75b);box-shadow:0 0 18px color-mix(in srgb,var(--gold) 34%,transparent);}
.admin-viz-bar-row:nth-child(3n+2) .admin-viz-bar-track span{background:linear-gradient(90deg,#368f68,#65d29d);}
.admin-viz-bar-row:nth-child(3n+3) .admin-viz-bar-track span{background:linear-gradient(90deg,#b75a30,#f09a54);}
.admin-viz-rings{display:grid;gap:14px;}
.admin-viz-ring-item{display:grid;grid-template-columns:76px minmax(0,1fr);gap:14px;align-items:center;padding:10px;border-radius:16px;background:color-mix(in srgb,var(--surface) 75%,transparent);}
.admin-viz-ring{--ring-color:var(--gold);width:70px;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--ring-color) var(--viz-progress),color-mix(in srgb,var(--surface) 55%,white 7%) 0);}
.admin-viz-ring::before{content:"";grid-area:1/1;width:76%;aspect-ratio:1;border-radius:50%;background:var(--surface-raised);}
.admin-viz-ring>span{grid-area:1/1;position:relative;z-index:1;}
.admin-viz-ring strong{font-family:var(--font-display);font-size:1.05rem;}
.admin-viz-ring.tone-green{--ring-color:#4fc08d;}.admin-viz-ring.tone-purple{--ring-color:#9875d1;}
.admin-viz-ring-item>div:last-child{display:grid;gap:3px;}.admin-viz-ring-item>div:last-child>strong{color:var(--cream);}.admin-viz-ring-item small{color:var(--muted);line-height:1.35;}
.admin-viz-activity{display:grid;gap:9px;}
.admin-viz-activity-row{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:11px;align-items:center;padding:11px 12px;border:1px solid color-mix(in srgb,var(--border) 80%,transparent);border-radius:14px;background:color-mix(in srgb,var(--surface) 76%,transparent);}
.admin-viz-activity-icon{width:10px;height:10px;border-radius:50%;background:#4fc08d;box-shadow:0 0 0 5px rgba(79,192,141,.12);}
.admin-viz-activity-row.has-items .admin-viz-activity-icon{background:#e98b35;box-shadow:0 0 0 5px rgba(233,139,53,.13);}
.admin-viz-activity-row strong{display:block;color:var(--cream);font-size:.83rem;}.admin-viz-activity-row small{display:block;margin-top:2px;color:var(--muted);font-size:.72rem;}.admin-viz-activity-row b{min-width:32px;text-align:center;color:var(--gold-light);font:700 1.15rem/1 var(--font-display);}
.admin-viz-empty{color:var(--muted);}

/* Bottom bar is now the five primary destinations; Settings remains in the header. */
.tabbar button span:last-child{white-space:nowrap;}

/* Solid, high-contrast park markers matching the legend. */
.park-map-marker>span{
  opacity:1 !important;
  background:#176b48 !important;
  border-color:#fff !important;
  box-shadow:0 4px 12px rgba(0,0,0,.55),0 0 0 2px rgba(23,107,72,.32) !important;
}
.park-map-marker.is-rally>span{
  background:#df7a16 !important;
  border-color:#fff4de !important;
  box-shadow:0 4px 14px rgba(0,0,0,.58),0 0 0 4px rgba(223,122,22,.28) !important;
}
.park-map-marker.is-rally>span::after{background:#fff7e8 !important;}
.park-map-cluster.has-rally{background:#df7a16 !important;color:#fff !important;border-color:#fff4de !important;box-shadow:0 4px 14px rgba(0,0,0,.58),0 0 0 4px rgba(223,122,22,.24) !important;}
.park-map-legend i.is-rally{background:#df7a16 !important;}

/* Show the committee members' heads and more of the supplied photograph on desktop. */
@media (min-width:900px){
  .committee-hero{min-height:clamp(420px,34vw,560px) !important;}
  .committee-hero-picture img,.committee-hero>img{object-position:center top !important;}
}

@media(max-width:760px){
  .hero .theme-toggle,.hero .home-alerts-button{top:13px !important;width:44px !important;height:44px !important;}
  .hero .theme-toggle{right:13px !important}.hero .home-alerts-button{left:13px !important}
  .intention-ticker{min-height:48px;padding:12px 14px;}
  .intention-ticker-track strong{font-size:14px !important;}
  .admin-stats-heading-row{align-items:stretch;flex-direction:column;gap:10px;}
  .admin-stats-view-toggle{width:100%;min-width:0;}
  .admin-viz-metrics{grid-template-columns:repeat(2,minmax(0,1fr));}
  .admin-viz-grid{grid-template-columns:1fr;}
  .admin-viz-donut-layout{grid-template-columns:1fr;}
}
@media(max-width:420px){
  .admin-viz-metrics{grid-template-columns:1fr;}
  .admin-viz-metric{min-height:112px;}
  .admin-viz-card{padding:16px;}
  .admin-viz-ring-item{grid-template-columns:66px minmax(0,1fr);}.admin-viz-ring{width:62px;}
}


/* v55.8.4 Website enquiry email formatting and attachments */
.admin-enquiry-attachment-picker {
  display: grid;
  gap: 10px;
}
.admin-enquiry-attachment-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--gold) 34%, var(--border));
  border-radius: 15px;
  background: color-mix(in srgb, var(--panel-strong) 88%, transparent);
  cursor: pointer;
}
.admin-enquiry-attachment-option input {
  width: 20px;
  height: 20px;
  margin-top: 2px;
  accent-color: var(--gold);
}
.admin-enquiry-attachment-option span,
.admin-enquiry-attachment-option strong,
.admin-enquiry-attachment-option small { display: block; min-width: 0; }
.admin-enquiry-attachment-option strong { color: var(--cream); }
.admin-enquiry-attachment-option small { margin-top: 4px; color: var(--muted); line-height: 1.45; }
.admin-enquiry-attachment-option:has(input:disabled) { opacity: .66; cursor: wait; }

/* ========================================================================== */
/* VERSION 55.8.4 — Admin record layout and ticker reliability                */
/* ========================================================================== */

/* All non-form content marked full must span the complete editor grid. */
.admin-record-form #adminRecordFields > .full {
  grid-column: 1 / -1 !important;
  min-width: 0;
}

/* Keep Admin record text horizontal and give actions their own row. */
.admin-record-list {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)) !important;
  align-items: stretch;
}
.admin-record-card {
  grid-template-columns: minmax(0, 1fr) !important;
  align-content: start;
  min-width: 0;
  min-height: 0 !important;
  height: auto;
}
.admin-record-card:has(.admin-notice-preview) {
  grid-template-columns: 72px minmax(0, 1fr) !important;
  align-items: start;
}
.admin-record-card:has(.admin-notice-preview) .admin-record-actions,
.admin-record-card .admin-record-actions {
  grid-column: 1 / -1 !important;
  width: 100%;
  margin-top: auto;
  padding-top: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
}
.admin-record-card .admin-record-main,
.admin-record-card .admin-record-number,
.admin-record-card .admin-record-main strong,
.admin-record-card .admin-record-main small,
.admin-record-card .admin-notice-flags,
.admin-record-card .admin-count-pills {
  min-width: 0;
  max-width: 100%;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  writing-mode: horizontal-tb !important;
}
.admin-record-card .admin-record-number {
  display: block;
  line-height: 1.35;
}
.admin-record-card .admin-record-actions button {
  min-width: max-content;
  max-width: 100%;
  white-space: normal;
}
.admin-record-card .admin-notice-preview {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 14px;
}

/* The ticker starts at the left edge immediately instead of entering halfway across. */
.intention-ticker-track {
  width: 100%;
  min-width: 0;
  overflow: hidden;
}
.intention-ticker-track strong {
  padding-left: 0 !important;
  transform: translateX(0);
  animation: ccsaTickerFromLeft 18s linear infinite !important;
}
@keyframes ccsaTickerFromLeft {
  0% { transform: translateX(0); }
  100% { transform: translateX(calc(-100% - 48px)); }
}
@media (prefers-reduced-motion: reduce) {
  .intention-ticker-track strong {
    transform: none !important;
    animation: none !important;
    white-space: normal !important;
  }
}
@media (max-width: 560px) {
  .admin-record-card:has(.admin-notice-preview) {
    grid-template-columns: 58px minmax(0, 1fr) !important;
  }
  .admin-record-card .admin-notice-preview {
    width: 58px;
    height: 58px;
  }
}


/* ======================================================================
   v55.9.1 — Member Finance Centre and Treasurer publication controls
   ====================================================================== */
.finance-home-icon img{width:76%!important;height:76%!important;object-fit:contain!important;}
.finance-screen{padding-bottom:128px;}
.finance-page-header{margin-bottom:16px;}
.finance-hero{display:grid;grid-template-columns:150px 1fr;gap:24px;align-items:center;margin:0 18px 18px;padding:24px;border:1px solid rgba(218,174,35,.42);border-radius:26px;background:linear-gradient(145deg,rgba(18,67,40,.98),rgba(5,36,23,.98));box-shadow:0 20px 52px rgba(0,0,0,.22);}
.finance-hero-icon{display:grid;place-items:center;min-height:136px;border-radius:22px;background:rgba(255,255,255,.045);border:1px solid rgba(218,174,35,.25);}
.finance-hero-icon img{width:124px;height:124px;object-fit:contain;}
.finance-hero span,.finance-card-heading span,.finance-admin-heading span,.finance-admin-editor-heading span{display:block;color:var(--gold);font:900 .72rem/1.2 system-ui;text-transform:uppercase;letter-spacing:.12em;}
.finance-hero h3{margin:6px 0 8px;color:#fff;font:800 clamp(1.65rem,3vw,2.45rem)/1.08 Georgia,serif;}
.finance-hero p{margin:0;max-width:900px;color:rgba(255,255,255,.78);font-size:1rem;line-height:1.55;}
.finance-controls{display:grid;grid-template-columns:minmax(220px,.75fr) minmax(360px,2fr) auto;gap:12px;align-items:end;margin:0 18px 12px;padding:16px;border:1px solid rgba(218,174,35,.28);border-radius:20px;background:rgba(12,53,31,.78);}
.finance-controls label{display:grid;gap:6px;color:#fff;font-weight:850;}
.finance-controls label span{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gold);}
.finance-controls select,.finance-controls button{min-height:48px;border:1px solid rgba(218,174,35,.36);border-radius:14px;background:#143f29;color:#fff;padding:0 14px;font:800 1rem/1 system-ui;}
.finance-controls button{cursor:pointer;white-space:nowrap;}
.finance-report-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
.finance-report-tabs button{min-height:48px;border:1px solid rgba(218,174,35,.3);border-radius:14px;background:rgba(255,255,255,.035);color:#fff;font-weight:850;padding:9px 12px;}
.finance-report-tabs button.active{background:var(--gold);color:#102719;border-color:var(--gold);box-shadow:0 8px 20px rgba(218,174,35,.18);}
.finance-source-note{margin:0 18px 14px;color:rgba(255,255,255,.62);font-size:.84rem;text-align:right;}
.finance-content{display:grid;gap:18px;padding:0 18px;}
.finance-loading,.finance-error,.finance-empty{display:grid;place-items:center;gap:10px;min-height:180px;padding:28px;border:1px solid rgba(218,174,35,.28);border-radius:22px;background:rgba(12,52,31,.7);text-align:center;color:rgba(255,255,255,.78);}
.finance-loading span{width:28px;height:28px;border:3px solid rgba(255,255,255,.2);border-top-color:var(--gold);border-radius:50%;animation:spin .8s linear infinite;}
.finance-error strong,.finance-empty strong{font:800 1.45rem/1.15 Georgia,serif;color:#fff;}
.finance-error p,.finance-empty p{margin:0;max-width:680px;}
.finance-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.finance-summary-card{position:relative;overflow:hidden;min-height:142px;padding:19px;border:1px solid rgba(218,174,35,.38);border-radius:20px;background:linear-gradient(145deg,rgba(21,70,42,.98),rgba(7,43,26,.98));}
.finance-summary-card:after{content:"";position:absolute;right:-26px;bottom:-38px;width:120px;height:120px;border-radius:50%;border:22px solid rgba(218,174,35,.055);}
.finance-summary-card span{display:block;color:rgba(255,255,255,.66);font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;font-weight:850;}
.finance-summary-card strong{display:block;margin-top:13px;color:#fff;font:800 clamp(1.35rem,2.5vw,2.1rem)/1.05 Georgia,serif;}
.finance-summary-card strong.negative,.finance-bar-label strong.negative,.finance-comparison-table .negative,.finance-detail-group strong.negative{color:#ff9d91;}
.finance-summary-card small{display:block;margin-top:9px;color:rgba(255,255,255,.55);line-height:1.35;}
.finance-chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start;}
.finance-chart-card,.finance-detail-card,.finance-full-data{border:1px solid rgba(218,174,35,.32);border-radius:22px;background:rgba(8,43,26,.88);overflow:hidden;}
.finance-chart-card{padding:18px;}
.finance-card-heading{margin-bottom:12px;}
.finance-card-heading h4{margin:4px 0 0;color:#fff;font:800 1.35rem/1.15 Georgia,serif;}
.finance-line-chart svg{display:block;width:100%;height:auto;overflow:visible;}
.finance-line-chart svg text{fill:rgba(255,255,255,.65);font:700 11px system-ui;}
.finance-chart-legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:7px;color:rgba(255,255,255,.72);font-size:.82rem;font-weight:750;}
.finance-chart-legend span{display:flex;align-items:center;gap:7px;}
.finance-chart-legend i{width:12px;height:4px;border-radius:999px;background:var(--legend-colour);}
.finance-bars{display:grid;gap:11px;}
.finance-bar-row{display:grid;gap:6px;}
.finance-bar-label{display:flex;justify-content:space-between;gap:12px;color:rgba(255,255,255,.78);font-size:.86rem;}
.finance-bar-label span{min-width:0;overflow-wrap:anywhere;}
.finance-bar-label strong{color:#fff;white-space:nowrap;}
.finance-bar-track{height:10px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;}
.finance-bar-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8acb78,var(--gold));}
.finance-bar-track span.negative{background:linear-gradient(90deg,#9f4036,#ef8c7f);}
.finance-detail-card{padding:18px;}
.finance-period-control{display:grid;grid-template-columns:auto minmax(180px,320px);gap:14px;align-items:center;margin:0 0 15px;color:#fff;font-weight:850;}
.finance-period-control span{color:rgba(255,255,255,.7);}
.finance-period-control select{min-height:46px;border:1px solid rgba(218,174,35,.34);border-radius:13px;background:#143f29;color:#fff;padding:0 12px;font:800 1rem system-ui;}
.finance-detail-group{margin-top:10px;border:1px solid rgba(218,174,35,.22);border-radius:16px;background:rgba(255,255,255,.025);overflow:hidden;}
.finance-detail-group summary{cursor:pointer;padding:13px 15px;color:#fff;font-weight:900;background:rgba(218,174,35,.08);}
.finance-detail-group>div{display:grid;}
.finance-detail-group p{display:flex;justify-content:space-between;gap:18px;margin:0;padding:10px 15px;border-top:1px solid rgba(255,255,255,.055);color:rgba(255,255,255,.75);}
.finance-detail-group p span{min-width:0;overflow-wrap:anywhere;}
.finance-detail-group p strong{color:#fff;white-space:nowrap;}
.finance-table-scroll{width:100%;overflow:auto;border-radius:14px;border:1px solid rgba(255,255,255,.07);}
.finance-comparison-table,.finance-full-data table{width:100%;border-collapse:collapse;background:rgba(0,0,0,.08);color:#fff;}
.finance-comparison-table th,.finance-comparison-table td,.finance-full-data th,.finance-full-data td{padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.07);text-align:right;white-space:nowrap;}
.finance-comparison-table th:first-child,.finance-comparison-table td:first-child,.finance-full-data td:first-child{text-align:left;white-space:normal;min-width:220px;}
.finance-comparison-table thead th{position:sticky;top:0;background:#123d28;color:var(--gold);z-index:1;}
.finance-comparison-table .finance-group-row th{background:rgba(218,174,35,.1);color:var(--gold);text-align:left;text-transform:uppercase;letter-spacing:.07em;}
.finance-full-data{padding:0;}
.finance-full-data summary{cursor:pointer;padding:16px 18px;color:#fff;font:850 1rem system-ui;}
.finance-full-data .finance-table-scroll{border:0;border-top:1px solid rgba(255,255,255,.08);border-radius:0;max-height:560px;}
.finance-full-data table{font-size:.78rem;}
.finance-full-data td{min-width:104px;}
.finance-full-data .finance-source-header td{font-weight:850;background:rgba(218,174,35,.07);}
.finance-full-data>p{margin:12px 18px 16px;color:rgba(255,255,255,.56);font-size:.78rem;}

.finance-admin-workspace{margin-top:20px;padding:20px;border:1px solid rgba(218,174,35,.34);border-radius:22px;background:rgba(8,44,27,.78);}
.finance-admin-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:16px;}
.finance-admin-heading h4{margin:5px 0 7px;color:#fff;font:800 1.65rem/1.1 Georgia,serif;}
.finance-admin-heading p{margin:0;max-width:780px;color:rgba(255,255,255,.68);line-height:1.5;}
.finance-admin-heading-actions{display:flex;gap:9px;flex-wrap:wrap;}
.finance-admin-heading-actions button,.finance-admin-editor-heading button,.finance-admin-card-actions button,.finance-admin-tab-picker button,.finance-admin-form-actions button{min-height:44px;border:1px solid rgba(218,174,35,.36);border-radius:13px;padding:0 14px;background:#123c27;color:#fff;font-weight:850;cursor:pointer;}
.finance-admin-heading-actions .admin-primary-btn,.finance-admin-form-actions .admin-primary-btn{background:var(--gold);color:#102719;}
.finance-admin-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.finance-admin-report-card{display:flex;flex-direction:column;justify-content:space-between;gap:15px;min-width:0;padding:16px;border:1px solid rgba(218,174,35,.27);border-radius:18px;background:rgba(255,255,255,.03);}
.finance-admin-report-card.published{box-shadow:inset 4px 0 #67b77a;}
.finance-admin-report-card.hidden-report{opacity:.78;box-shadow:inset 4px 0 #8d7552;}
.finance-admin-report-card span{display:block;color:var(--gold);font-size:.7rem;font-weight:900;text-transform:uppercase;letter-spacing:.09em;}
.finance-admin-report-card h5{margin:5px 0;color:#fff;font:800 1.28rem/1.15 Georgia,serif;}
.finance-admin-report-card p,.finance-admin-report-card small,.finance-admin-report-card em{display:block;margin:0;color:rgba(255,255,255,.68);overflow-wrap:anywhere;}
.finance-admin-report-card em{margin-top:8px;color:#ff9d91;font-style:normal;font-size:.8rem;}
.finance-admin-report-card.configuration-warning{border-color:#d97863;box-shadow:inset 4px 0 0 #d97863;}
.finance-admin-card-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;}
.finance-admin-card-actions button.danger{color:#ff9d91;border-color:rgba(255,120,105,.36);}
.finance-admin-editor{margin-top:18px;padding:18px;border:1px solid rgba(218,174,35,.32);border-radius:20px;background:rgba(0,0,0,.12);}
.finance-admin-editor-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px;}
.finance-admin-editor-heading h5{margin:5px 0 0;color:#fff;font:800 1.45rem/1.1 Georgia,serif;}
.finance-admin-editor form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.finance-admin-editor label{display:grid;gap:6px;color:#fff;font-weight:850;min-width:0;}
.finance-admin-editor label>span{font-size:.78rem;color:rgba(255,255,255,.7);}
.finance-admin-editor input,.finance-admin-editor select{width:100%;min-width:0;min-height:46px;border:1px solid rgba(218,174,35,.3);border-radius:13px;background:#143f29;color:#fff;padding:0 12px;font:750 1rem system-ui;}
.finance-admin-editor .full{grid-column:1/-1;}
.finance-admin-tab-picker{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;}
.finance-admin-checks{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.finance-admin-form-actions{display:flex;justify-content:flex-end;gap:10px;}
.finance-admin-status{margin-top:13px;padding:12px 14px;border-radius:13px;background:rgba(255,255,255,.05);color:rgba(255,255,255,.78);}
.finance-admin-status.success{background:rgba(57,145,76,.16);color:#caffd5;}
.finance-admin-status.error{background:rgba(174,65,49,.18);color:#ffd0c8;}

@media(max-width:980px){
  .finance-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .finance-chart-grid{grid-template-columns:1fr;}
  .finance-admin-list{grid-template-columns:repeat(2,minmax(0,1fr));}
  .finance-controls{grid-template-columns:1fr;}
  .finance-source-note{text-align:left;}
}
@media(max-width:680px){
  .finance-hero{grid-template-columns:90px 1fr;margin-left:12px;margin-right:12px;padding:17px;gap:14px;}
  .finance-hero-icon{min-height:88px;}
  .finance-hero-icon img{width:82px;height:82px;}
  .finance-hero h3{font-size:1.42rem;}
  .finance-hero p{font-size:.9rem;}
  .finance-controls,.finance-content{margin-left:0;margin-right:0;padding-left:12px;padding-right:12px;}
  .finance-report-tabs{grid-template-columns:1fr;}
  .finance-summary-grid{grid-template-columns:1fr 1fr;gap:9px;}
  .finance-summary-card{min-height:122px;padding:15px;}
  .finance-summary-card strong{font-size:1.25rem;}
  .finance-period-control{grid-template-columns:1fr;gap:7px;}
  .finance-detail-group p{align-items:flex-start;}
  .finance-admin-heading{display:grid;}
  .finance-admin-list{grid-template-columns:1fr;}
  .finance-admin-editor form{grid-template-columns:1fr;}
  .finance-admin-editor .full{grid-column:auto;}
  .finance-admin-tab-picker{grid-template-columns:1fr;}
  .finance-admin-form-actions{display:grid;}
}
@media(max-width:410px){
  .finance-summary-grid{grid-template-columns:1fr;}
  .finance-hero{grid-template-columns:1fr;text-align:center;}
  .finance-hero p{max-width:34rem;}
}

/* ========================================================================== 
   VERSION 55.11.0 — final app refinements
   ========================================================================== */

/* Intention ticker enters from the right edge and exits fully to the left. */
.intention-ticker-track{
  position:relative;
  width:100%;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
}
.intention-ticker-track strong{
  display:inline-block;
  width:max-content;
  max-width:none;
  padding-left:0 !important;
  will-change:transform;
  animation:ccsaTickerRightToLeft 20s linear infinite !important;
}
@keyframes ccsaTickerRightToLeft{
  0%{transform:translateX(var(--ticker-start, 100vw));}
  100%{transform:translateX(calc(-100% - 48px));}
}
@media(prefers-reduced-motion:reduce){
  .intention-ticker-track strong{animation:none !important;transform:none !important;white-space:normal !important;}
}

/* First-use details and private home-address helper. */
.settings-form-grid label.full{grid-column:1/-1;}
.settings-form-grid label small{font-size:.78rem;line-height:1.45;color:var(--muted);font-weight:600;}

/* App setup links in Admin. */
.admin-app-links-card{
  display:grid;
  grid-template-columns:minmax(220px,.65fr) minmax(0,1.35fr);
  gap:20px;
  align-items:start;
  margin:0 0 18px;
  padding:18px;
  border:1px solid var(--border);
  border-radius:20px;
  background:var(--surface);
  box-shadow:var(--shadow-soft);
}
.admin-app-links-card h4{margin:3px 0 7px;font-family:var(--font-display);font-size:1.45rem;}
.admin-app-links-card p{margin:0;color:var(--muted);line-height:1.55;}
.admin-app-links-card form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end;}
.admin-app-links-card label{display:grid;gap:6px;color:var(--cream);font-weight:850;font-size:.8rem;}
.admin-app-links-card input{width:100%;min-height:48px;border:1px solid var(--border);border-radius:13px;background:var(--surface-raised);color:var(--cream);padding:10px 12px;font:inherit;}
.admin-app-links-card .admin-message{grid-column:1/-1;}

/* Committee portfolio workspaces are opened only from their task cards. */
.finance-admin-workspace[hidden],
.chairman-task-workspace[hidden]{display:none !important;}

/* Merchandise cart is a normal page footer, never a floating overlay. */
.merch-cart-footer{
  position:static;
  width:100%;
  margin:18px 0 0;
  padding:0 0 8px;
  z-index:auto;
}
.merch-cart-footer .merch-cart-launch{
  position:static !important;
  width:100% !important;
  margin:0 !important;
  box-shadow:none !important;
}

/* Member-to-park distance label. */
.park-home-distance{
  display:grid;
  gap:4px;
  margin:0 0 14px;
  padding:13px 14px;
  border:1px solid color-mix(in srgb,var(--gold) 42%,var(--border));
  border-radius:15px;
  background:color-mix(in srgb,var(--surface-raised) 88%,var(--gold) 12%);
}
.park-home-distance span{font-size:.68rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-light);}
.park-home-distance strong{font-family:var(--font-display);font-size:1.15rem;}
.park-home-distance small{color:var(--muted);line-height:1.4;}

@media(max-width:820px){
  .admin-app-links-card{grid-template-columns:1fr;}
  .admin-app-links-card form{grid-template-columns:1fr;}
}

/* v55.12.12 — Simple social link at the bottom of the member home page. */
.home-social-links{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:26px 12px 4px;
}
.home-social-link{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:#1877f2;
  border:2px solid color-mix(in srgb,#fff 78%,transparent);
  box-shadow:0 12px 28px rgba(0,0,0,.28);
  text-decoration:none;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
.home-social-link svg{width:29px;height:29px;display:block;}
.home-social-link:hover{transform:translateY(-2px);box-shadow:0 15px 32px rgba(0,0,0,.34);filter:brightness(1.06);}
.home-social-link:focus-visible{outline:4px solid var(--gold-light,#f6d864);outline-offset:4px;}
.home-social-links + .home-version{padding-top:10px;}


/* =====================================================================
   v55.12.15 — Roadside + Heritage usability rebuild
   Replaces the original broad colour overlays with two controlled,
   high-contrast skins. Icon artwork remains transparent and unboxed.
   ===================================================================== */

/* ---------------------------------------------------------------------
   Shared icon repair for both themes
   --------------------------------------------------------------------- */
html:is([data-theme="roadside-50s"],[data-theme="heritage-club"])
:where(.visual-icon-wrap,.premium-icon-host,.premium-section-icon,.status-icon) {
  overflow:visible !important;
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  box-shadow:none !important;
  outline:0 !important;
}
html:is([data-theme="roadside-50s"],[data-theme="heritage-club"])
:where(.visual-icon-wrap,.premium-icon-host,.premium-section-icon,.status-icon)::before,
html:is([data-theme="roadside-50s"],[data-theme="heritage-club"])
:where(.visual-icon-wrap,.premium-icon-host,.premium-section-icon,.status-icon)::after {
  display:none !important;
}
html:is([data-theme="roadside-50s"],[data-theme="heritage-club"])
:where(.visual-icon-wrap img,.premium-registry-image,.premium-section-icon img,.status-icon img) {
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  mix-blend-mode:normal !important;
  filter:drop-shadow(0 8px 10px rgba(0,0,0,.20)) !important;
}
html:is([data-theme="roadside-50s"],[data-theme="heritage-club"])
.tile.visual-tile:hover .visual-icon-wrap img {
  filter:drop-shadow(0 10px 12px rgba(0,0,0,.24)) !important;
}

/* ---------------------------------------------------------------------
   1950s Roadside — cream paper, enamel red, turquoise and chrome
   --------------------------------------------------------------------- */
[data-theme="roadside-50s"] {
  color-scheme:light;
  --bg:#efe0b9;
  --bg-soft:#f7ecd2;
  --surface:#fff7e4;
  --surface-raised:#fffdf7;
  --surface-soft:#ead5a4;
  --cream:#2b211b;
  --ink:#241b16;
  --muted:#5d5044;
  --border:rgba(113,71,48,.30);
  --border-strong:rgba(143,21,26,.58);
  --gold:#d19a20;
  --gold-light:#f5cf62;
  --rust:#a7191f;
  --rust-light:#c72b30;
  --green:#2f7d76;
  --blue:#2f7d8c;
  --plum:#7e566f;
  --amber:#c58c2d;
  --crest-bg:#fff9e8;
  --hero-text:#fff9e9;
  --hero-muted:#ffe9bd;
  --shadow:0 20px 52px rgba(66,39,26,.28);
  --card-shadow:0 10px 24px rgba(75,45,29,.16);
  --font-display:Georgia,"Times New Roman",serif;
  --font-body:"Trebuchet MS",Arial,sans-serif;
  --radius-xl:22px;
  --radius-lg:17px;
  --radius-md:13px;
}
html[data-theme="roadside-50s"],
html[data-theme="roadside-50s"] body {
  background-color:#173a3d !important;
  background-image:linear-gradient(145deg,#285458,#102c2f) !important;
}
html[data-theme="roadside-50s"] body { color:#2b211b !important; }
html[data-theme="roadside-50s"] .app {
  color:#2b211b !important;
  background:#f3e6c5 !important;
  border-color:#747d7b !important;
  box-shadow:0 0 0 2px #d7d8d3,0 0 0 4px #505a59,0 24px 62px rgba(0,0,0,.34) !important;
}
html[data-theme="roadside-50s"] main,
html[data-theme="roadside-50s"] .screen {
  color:#2b211b !important;
  background-color:#f3e6c5 !important;
  background-image:
    radial-gradient(circle at 16% 5%,rgba(167,25,31,.045) 0 1px,transparent 1.5px),
    linear-gradient(180deg,#faf0d5,#f3e6c5 62%,#ead7aa) !important;
  background-size:16px 16px,auto !important;
}
html[data-theme="roadside-50s"] .hero {
  color:#fff9e9 !important;
  background:#a7191f !important;
  background-image:linear-gradient(160deg,#c62d31,#9c171d 62%,#751014) !important;
  border-bottom:18px solid transparent !important;
  box-shadow:0 8px 0 #687170,0 12px 22px rgba(73,27,19,.23) !important;
}
html[data-theme="roadside-50s"] .hero::before {
  display:block !important;
  opacity:.22 !important;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.28) .7px,transparent .9px),
    linear-gradient(125deg,transparent 0 46%,rgba(255,244,213,.08) 47% 49%,transparent 50% 100%) !important;
  background-size:18px 18px,100% 100% !important;
}
html[data-theme="roadside-50s"] .hero::after {
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:-18px !important;
  height:18px !important;
  z-index:3 !important;
  background-color:#fff5d8 !important;
  background-image:conic-gradient(from 90deg,#a7191f 0 25%,#fff5d8 0 50%,#a7191f 0 75%,#fff5d8 0) !important;
  background-size:18px 18px !important;
}
html[data-theme="roadside-50s"] :where(.eyebrow,.tagline,.hero h1) { color:#fff9e9 !important; }
html[data-theme="roadside-50s"] .eyebrow { color:#ffe28b !important; }
html[data-theme="roadside-50s"] .tagline span { color:#8fe1da !important; }
html[data-theme="roadside-50s"] .hero h1,
html[data-theme="roadside-50s"] .section-heading h2,
html[data-theme="roadside-50s"] .screen-header h2 {
  font-family:Georgia,"Times New Roman",serif !important;
}
html[data-theme="roadside-50s"] .hero h1 {
  color:#fff9e9 !important;
  font-style:italic;
  text-shadow:0 3px 0 #651015,0 6px 12px rgba(0,0,0,.25) !important;
}
html[data-theme="roadside-50s"] .clock {
  color:#2b211b !important;
  background:#fff8e5 !important;
  border:2px solid #6b7573 !important;
  box-shadow:0 0 0 2px #d7d8d2,0 6px 14px rgba(74,35,23,.20) !important;
}
html[data-theme="roadside-50s"] .clock .date { color:#66564a !important; }
html[data-theme="roadside-50s"] .clock .time { color:#96161b !important; }
html[data-theme="roadside-50s"] .clock-marker { background:#2f7d76 !important; }
html[data-theme="roadside-50s"] :where(.theme-toggle,.home-alerts-button) {
  color:#fff9e9 !important;
  background:#97161b !important;
  border:2px solid #d8d9d4 !important;
  box-shadow:0 0 0 2px #56605f,0 5px 12px rgba(0,0,0,.28) !important;
}
html[data-theme="roadside-50s"] .section-kicker {
  color:#236963 !important;
  font-weight:900 !important;
}
html[data-theme="roadside-50s"] .section-heading h2 {
  color:#8f151a !important;
  font-style:italic;
  font-weight:900 !important;
}
html[data-theme="roadside-50s"] .section-rule {
  background:linear-gradient(90deg,transparent,#687271 17%,#d7d8d2 50%,#687271 83%,transparent) !important;
}

/* Roadside home tiles */
html[data-theme="roadside-50s"] .tile.visual-tile {
  color:#2b211b !important;
  background:#fff8e5 !important;
  background-image:linear-gradient(145deg,#fffdf7,#f4e3bd) !important;
  border:2px solid color-mix(in srgb,var(--accent,#a7191f) 66%,#6d5b4c) !important;
  box-shadow:0 0 0 2px #ffffff,0 0 0 4px #aeb4b0,0 8px 18px rgba(72,44,29,.17) !important;
}
html[data-theme="roadside-50s"] .tile.visual-tile::before { background:linear-gradient(135deg,rgba(255,255,255,.70),transparent 40%) !important; }
html[data-theme="roadside-50s"] .tile.visual-tile::after {
  inset:auto 8px 0 8px !important;
  height:9px !important;
  opacity:1 !important;
  border-radius:4px 4px 0 0 !important;
  background-color:#fff4d2 !important;
  background-image:conic-gradient(from 90deg,var(--accent,#a7191f) 0 25%,#fff4d2 0 50%,var(--accent,#a7191f) 0 75%,#fff4d2 0) !important;
  background-size:9px 9px !important;
}
html[data-theme="roadside-50s"] .tile.visual-tile :where(.label,.sub,.tile-overline) { text-shadow:none !important; }
html[data-theme="roadside-50s"] .tile.visual-tile .label { color:#841318 !important; font-weight:900 !important; text-transform:uppercase; }
html[data-theme="roadside-50s"] .tile.visual-tile .sub { color:#584b40 !important; font-weight:700 !important; }
html[data-theme="roadside-50s"] .tile.visual-tile .tile-overline { color:#236963 !important; font-weight:900 !important; }
html[data-theme="roadside-50s"] .tile.visual-tile :where(.mini-arrow,.tile-action) {
  color:#fff9e9 !important;
  background:#246f69 !important;
  border:2px solid #67716f !important;
  box-shadow:0 0 0 2px #eef0eb !important;
}
html[data-theme="roadside-50s"] :where(.tile.visual-tile.featured,.tile.visual-tile.admin-card) {
  color:#fff9e9 !important;
  background:#a7191f !important;
  background-image:linear-gradient(145deg,#c42b30,#8c1217) !important;
  border-color:#711015 !important;
}
html[data-theme="roadside-50s"] :where(.tile.visual-tile.featured,.tile.visual-tile.admin-card)
:where(.label,.sub,.tile-overline) {
  color:#fff9e9 !important;
  text-shadow:0 2px 0 rgba(86,13,17,.65) !important;
}

/* Roadside headers */
html[data-theme="roadside-50s"] .screen-header {
  color:#fff9e9 !important;
  background:#a7191f !important;
  background-image:linear-gradient(160deg,#c72d32,#98161c 64%,#731014) !important;
  border-bottom:18px solid transparent !important;
  box-shadow:0 7px 0 #687170,0 10px 20px rgba(68,30,20,.20) !important;
}
html[data-theme="roadside-50s"] .screen-header::before {
  display:block !important;
  left:0 !important;
  right:0 !important;
  bottom:-18px !important;
  height:18px !important;
  opacity:1 !important;
  background-color:#fff4d2 !important;
  background-image:conic-gradient(from 90deg,#a7191f 0 25%,#fff4d2 0 50%,#a7191f 0 75%,#fff4d2 0) !important;
  background-size:18px 18px !important;
}
html[data-theme="roadside-50s"] .screen-header h2 { color:#fff9e9 !important; font-style:italic; text-shadow:0 2px 0 #651015 !important; }
html[data-theme="roadside-50s"] .screen-kicker { color:#ffe28b !important; }
html[data-theme="roadside-50s"] .back-btn {
  color:#fff9e9 !important;
  background:#246f69 !important;
  border:2px solid #d7d9d4 !important;
  box-shadow:0 0 0 2px #56605f,0 4px 10px rgba(0,0,0,.26) !important;
}

/* Roadside light content surfaces */
html[data-theme="roadside-50s"] :where(
  .rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .calendar-viewer-header,.calendar-viewer-footer,.calendar-help,.newsletter-card,.newsletter-hero,.newsletter-reader-panel,
  .newsletter-email-panel,.committee-card,.committee-hero,.committee-payment,.milestone-summary,.milestone-progress-card,
  .milestone-lookup-card,.notice-card,.notice-hero,.notice-document,.notice-detail-panel,.notice-email-panel,.notice-view-menu,
  .admin-login-card,.admin-dashboard,.admin-stats>div,.admin-newsletter-sync,.admin-record-card,.admin-modal-panel,
  .settings-hero,.settings-card,.coming-soon,.photo-submit-card,.photo-admin-card,.notification-setup-panel,
  .weather-card,.weather-summary,.park-card,.park-detail-panel,.recipe-card,.recipe-hero,.resource-card,.resource-hero,
  .about-club-item,.games-intro,.game-card,.game-leaderboard,.game-panel,.classifieds-card,.classified-detail-panel,
  .finance-card,.finance-admin-report-card,.finance-report-panel,.emergency-card,.emergency-panel,.park-rating-card,
  .guest-admin-card,.intention-card,.theme-sheet .panel,.facebook-composer-card
) {
  color:#2b211b !important;
  background:#fff8e5 !important;
  background-image:linear-gradient(145deg,rgba(255,255,255,.72),rgba(244,227,189,.82)) !important;
  border-color:rgba(113,71,48,.34) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 9px 22px rgba(72,44,29,.14) !important;
}
html[data-theme="roadside-50s"] :where(
  .rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .newsletter-card,.newsletter-hero,.committee-card,.committee-hero,.milestone-summary,.milestone-progress-card,
  .notice-card,.notice-hero,.notice-document,.admin-login-card,.admin-dashboard,.admin-record-card,.settings-hero,.settings-card,
  .photo-submit-card,.photo-admin-card,.weather-card,.park-card,.recipe-card,.resource-card,.about-club-item,
  .game-card,.game-panel,.classifieds-card,.finance-card,.finance-admin-report-card,.emergency-card,.park-rating-card,
  .theme-sheet .panel,.facebook-composer-card
) :where(h1,h2,h3,h4,h5,h6,strong,label,legend,.label,.rally-venue,.finance-value) {
  color:#2b211b !important;
}
html[data-theme="roadside-50s"] :where(
  .rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .newsletter-card,.newsletter-hero,.committee-card,.committee-hero,.milestone-summary,.milestone-progress-card,
  .notice-card,.notice-hero,.notice-document,.admin-login-card,.admin-dashboard,.admin-record-card,.settings-hero,.settings-card,
  .photo-submit-card,.photo-admin-card,.weather-card,.park-card,.recipe-card,.resource-card,.about-club-item,
  .game-card,.game-panel,.classifieds-card,.finance-card,.finance-admin-report-card,.emergency-card,.park-rating-card,
  .theme-sheet .panel,.facebook-composer-card
) :where(p,small,.sub,.settings-note,.settings-about,.muted,.hint) {
  color:#5d5044 !important;
}
html[data-theme="roadside-50s"] :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  textarea,select,.rally-filter,.notice-search,.newsletter-search,.admin-search,.milestone-input-wrap
) {
  color:#2b211b !important;
  background:#fffdf7 !important;
  border-color:#927b65 !important;
  box-shadow:inset 0 1px 2px rgba(84,54,34,.08) !important;
}
html[data-theme="roadside-50s"] :where(input,textarea)::placeholder { color:#75675b !important; opacity:1 !important; }
html[data-theme="roadside-50s"] select option { color:#2b211b !important; background:#fff8e5 !important; }

/* Roadside actions */
html[data-theme="roadside-50s"] :where(
  .primary-button,.rally-action-primary,.park-book-button,.game-new-button,.park-rating-submit,
  .settings-actions .primary,.settings-update-button,.settings-profile-submit:not(:disabled),
  .faq-scope-switch button.active,.admin-tabs button.active,.newsletter-year-filter.active,
  .calendar-view-toggle button.active,.notification-setup-modal-actions .primary
) {
  color:#fff9e9 !important;
  background:#9a171c !important;
  background-image:linear-gradient(180deg,#bc292e,#861217) !important;
  border-color:#5f0c11 !important;
  text-shadow:none !important;
}
html[data-theme="roadside-50s"] :where(
  .rally-filter,.notice-filter-row button,.newsletter-year-filter,.calendar-view-toggle button,.admin-tabs button,
  .notice-view-button,.calendar-action,.committee-action,.milestone-reset,.newsletter-card-actions a,
  .newsletter-card-actions button,.notice-document-actions a,.notice-document-actions button,
  .settings-segment button,.settings-actions button,.settings-install-button,.settings-profile-load,
  .settings-profile-actions button,.settings-link-list a,.settings-notification-centre-link,
  .notification-test-confirm button,.notification-device-help button,.settings-theme-options button,
  .admin-record-actions button,.finance-admin-card-actions button
) {
  color:#2b211b !important;
  background:#fffdf7 !important;
  border-color:#8d7764 !important;
}
html[data-theme="roadside-50s"] :where(button.danger,.admin-danger-action) {
  color:#fff9e9 !important;
  background:#8d171b !important;
  border-color:#5d0d11 !important;
}

/* Roadside tables */
html[data-theme="roadside-50s"] :where(table,td,th) { color:#2b211b !important; border-color:#b69d7d !important; }
html[data-theme="roadside-50s"] thead th {
  color:#fff9e9 !important;
  background:#8f151a !important;
}
html[data-theme="roadside-50s"] tbody tr:nth-child(even) { background:rgba(47,125,118,.07) !important; }

/* Roadside navigation */
html[data-theme="roadside-50s"] .tabbar {
  color:#fff9e9 !important;
  background:#8f151a !important;
  background-image:linear-gradient(180deg,#ad2227,#761015) !important;
  border-top:3px solid #d3d5d0 !important;
  box-shadow:0 -3px 0 #5d6765,0 -8px 18px rgba(0,0,0,.24) !important;
}
html[data-theme="roadside-50s"] .tabbar button { color:#ffeac2 !important; }
html[data-theme="roadside-50s"] .tabbar button.active {
  color:#fff !important;
  background:#246f69 !important;
  border:1px solid #d6d8d2 !important;
}
html[data-theme="roadside-50s"] .home-social-link {
  color:#fff !important;
  background:#1877f2 !important;
  border-color:#fff !important;
}
html[data-theme="roadside-50s"] :where(.home-version,.settings-version-footer) { color:#5d5044 !important; }

/* ---------------------------------------------------------------------
   Heritage Club — dark club shell with parchment reading surfaces
   --------------------------------------------------------------------- */
[data-theme="heritage-club"] {
  color-scheme:light;
  --bg:#071b13;
  --bg-soft:#0c281c;
  --surface:#102f22;
  --surface-raised:#173c2a;
  --surface-soft:#1e4832;
  --cream:#f7efdd;
  --ink:#17231b;
  --muted:#c8bda5;
  --border:rgba(185,151,79,.28);
  --border-strong:rgba(221,196,127,.62);
  --gold:#b9974f;
  --gold-light:#ddc47f;
  --rust:#5a171a;
  --rust-light:#77252a;
  --green:#2e6949;
  --blue:#536f75;
  --plum:#725c70;
  --amber:#a97d36;
  --crest-bg:#f6eedc;
  --hero-text:#f8efdb;
  --hero-muted:#d2c6ad;
  --shadow:0 24px 64px rgba(0,0,0,.45);
  --card-shadow:0 12px 28px rgba(49,36,20,.18);
  --font-display:Georgia,"Times New Roman",serif;
  --font-body:"Public Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --radius-xl:18px;
  --radius-lg:13px;
  --radius-md:10px;
}
html[data-theme="heritage-club"],
html[data-theme="heritage-club"] body {
  background:#06160f !important;
  color:#f7efdd !important;
}
html[data-theme="heritage-club"] body {
  background-image:
    radial-gradient(circle at 50% -10%,rgba(185,151,79,.13),transparent 30rem),
    linear-gradient(180deg,#0b2519,#06160f) !important;
}
html[data-theme="heritage-club"] .app {
  color:#f7efdd !important;
  background:#071b13 !important;
  border-color:rgba(185,151,79,.45) !important;
  box-shadow:0 24px 64px rgba(0,0,0,.48) !important;
}
html[data-theme="heritage-club"] .hero {
  color:#f8efdb !important;
  background:#071b13 !important;
  background-image:
    radial-gradient(circle at 50% -10%,rgba(185,151,79,.14),transparent 25rem),
    linear-gradient(180deg,#0c2a1d,#071b13) !important;
  border-bottom:1px solid #b9974f !important;
}
html[data-theme="heritage-club"] .hero::before {
  display:block !important;
  opacity:.25 !important;
  background-image:
    radial-gradient(circle,rgba(221,196,127,.18) .55px,transparent .7px),
    linear-gradient(115deg,transparent 0 48%,rgba(255,255,255,.025) 49% 50%,transparent 51% 100%) !important;
  background-size:20px 20px,100% 100% !important;
}
html[data-theme="heritage-club"] :where(.eyebrow,.hero h1,.tagline) { color:#f8efdb !important; }
html[data-theme="heritage-club"] .eyebrow { color:#ddc47f !important; }
html[data-theme="heritage-club"] .tagline span { color:#ddc47f !important; }
html[data-theme="heritage-club"] .hero h1 { font-family:Georgia,"Times New Roman",serif !important; font-weight:500 !important; }
html[data-theme="heritage-club"] .clock {
  color:#f8efdb !important;
  background:#0d2d20 !important;
  border-color:#b9974f !important;
}
html[data-theme="heritage-club"] .clock .date { color:#c8bda5 !important; }
html[data-theme="heritage-club"] .clock .time { color:#ddc47f !important; }
html[data-theme="heritage-club"] .clock-marker { background:#b9974f !important; }
html[data-theme="heritage-club"] :where(.theme-toggle,.home-alerts-button) {
  color:#ddc47f !important;
  background:#0b251a !important;
  border:1px solid #b9974f !important;
  box-shadow:0 6px 14px rgba(0,0,0,.30) !important;
}
html[data-theme="heritage-club"] #screen-home main,
html[data-theme="heritage-club"] #screen-home .home-content,
html[data-theme="heritage-club"] #screen-home .home-sections {
  color:#f7efdd !important;
  background:#071b13 !important;
  background-image:linear-gradient(180deg,#0a2419,#071b13) !important;
}
html[data-theme="heritage-club"] #screen-home .section-kicker { color:#ddc47f !important; }
html[data-theme="heritage-club"] #screen-home .section-heading h2 {
  color:#f7efdd !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:500 !important;
}
html[data-theme="heritage-club"] #screen-home .section-rule {
  background:linear-gradient(90deg,transparent,#b9974f 20%,#b9974f 80%,transparent) !important;
}

/* Heritage home tiles remain dark: cream text only on dark green. */
html[data-theme="heritage-club"] .tile.visual-tile {
  color:#f7efdd !important;
  background:#102f22 !important;
  background-image:linear-gradient(145deg,#163c2a,#0b251a) !important;
  border:1px solid rgba(185,151,79,.48) !important;
  border-radius:11px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 9px 22px rgba(0,0,0,.24) !important;
}
html[data-theme="heritage-club"] .tile.visual-tile::before {
  background:linear-gradient(135deg,rgba(221,196,127,.07),transparent 42%) !important;
}
html[data-theme="heritage-club"] .tile.visual-tile::after {
  inset:auto 24px 0 24px !important;
  height:1px !important;
  opacity:.75 !important;
  background:linear-gradient(90deg,transparent,#b9974f,transparent) !important;
}
html[data-theme="heritage-club"] .tile.visual-tile .label {
  color:#f7efdd !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:600 !important;
  text-shadow:none !important;
}
html[data-theme="heritage-club"] .tile.visual-tile .sub { color:#c8bda5 !important; text-shadow:none !important; }
html[data-theme="heritage-club"] .tile.visual-tile .tile-overline { color:#ddc47f !important; text-shadow:none !important; }
html[data-theme="heritage-club"] .tile.visual-tile :where(.mini-arrow,.tile-action) {
  color:#ddc47f !important;
  background:#071b13 !important;
  border:1px solid #b9974f !important;
  box-shadow:none !important;
}
html[data-theme="heritage-club"] :where(.tile.visual-tile.featured,.tile.visual-tile.admin-card) {
  background:#5a171a !important;
  background-image:linear-gradient(145deg,#702126,#481114) !important;
  border-color:#b9974f !important;
}
html[data-theme="heritage-club"] :where(.tile.visual-tile.featured,.tile.visual-tile.admin-card)
:where(.label,.sub,.tile-overline) {
  color:#f8efdb !important;
}

/* Heritage inner pages: parchment body with dark ink */
html[data-theme="heritage-club"] .screen:not(#screen-home),
html[data-theme="heritage-club"] .screen:not(#screen-home) main {
  color:#17231b !important;
  background:#f3ead5 !important;
  background-image:
    radial-gradient(circle at 14% 4%,rgba(91,68,31,.045) 0 1px,transparent 1.4px),
    linear-gradient(180deg,#faf4e7,#f3ead5 60%,#eadcc0) !important;
  background-size:17px 17px,auto !important;
}
html[data-theme="heritage-club"] .screen-header {
  color:#f8efdb !important;
  background:#071b13 !important;
  background-image:linear-gradient(160deg,#0e3021,#071b13) !important;
  border-bottom:1px solid #b9974f !important;
  box-shadow:0 8px 18px rgba(0,0,0,.20) !important;
}
html[data-theme="heritage-club"] .screen-header::before {
  display:block !important;
  opacity:.20 !important;
  background-image:
    radial-gradient(circle,rgba(221,196,127,.22) .55px,transparent .75px),
    linear-gradient(115deg,transparent 0 48%,rgba(255,255,255,.024) 49% 50%,transparent 51% 100%) !important;
  background-size:20px 20px,100% 100% !important;
}
html[data-theme="heritage-club"] .screen-header h2 {
  color:#f8efdb !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:500 !important;
}
html[data-theme="heritage-club"] .screen-kicker { color:#ddc47f !important; }
html[data-theme="heritage-club"] .back-btn {
  color:#ddc47f !important;
  background:#071b13 !important;
  border:1px solid #b9974f !important;
  box-shadow:0 6px 13px rgba(0,0,0,.28) !important;
}
html[data-theme="heritage-club"] .screen:not(#screen-home) .section-kicker { color:#76551f !important; }
html[data-theme="heritage-club"] .screen:not(#screen-home) .section-heading h2 {
  color:#17231b !important;
  font-family:Georgia,"Times New Roman",serif !important;
}
html[data-theme="heritage-club"] .screen:not(#screen-home) .section-rule {
  background:linear-gradient(90deg,transparent,#9b7738 20%,#9b7738 80%,transparent) !important;
}

/* Heritage parchment content surfaces */
html[data-theme="heritage-club"] :where(
  .rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .calendar-viewer-header,.calendar-viewer-footer,.calendar-help,.newsletter-card,.newsletter-hero,.newsletter-reader-panel,
  .newsletter-email-panel,.committee-card,.committee-hero,.committee-payment,.milestone-summary,.milestone-progress-card,
  .milestone-lookup-card,.notice-card,.notice-hero,.notice-document,.notice-detail-panel,.notice-email-panel,.notice-view-menu,
  .admin-login-card,.admin-dashboard,.admin-stats>div,.admin-newsletter-sync,.admin-record-card,.admin-modal-panel,
  .coming-soon,.photo-submit-card,.photo-admin-card,.notification-setup-panel,
  .weather-card,.weather-summary,.park-card,.park-detail-panel,.recipe-card,.recipe-hero,.resource-card,.resource-hero,
  .about-club-item,.games-intro,.game-card,.game-leaderboard,.game-panel,.classifieds-card,.classified-detail-panel,
  .finance-card,.finance-admin-report-card,.finance-report-panel,.emergency-card,.emergency-panel,.park-rating-card,
  .guest-admin-card,.intention-card,.theme-sheet .panel,.facebook-composer-card
) {
  color:#17231b !important;
  background:#f6eedc !important;
  background-image:linear-gradient(145deg,rgba(255,255,255,.62),rgba(238,224,196,.86)) !important;
  border:1px solid rgba(126,96,43,.48) !important;
  border-radius:11px !important;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.30),0 9px 22px rgba(62,44,22,.13) !important;
}
html[data-theme="heritage-club"] :where(
  .rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .newsletter-card,.newsletter-hero,.committee-card,.committee-hero,.milestone-summary,.milestone-progress-card,
  .notice-card,.notice-hero,.notice-document,.admin-login-card,.admin-dashboard,.admin-record-card,
  .photo-submit-card,.photo-admin-card,.weather-card,.park-card,.recipe-card,.resource-card,.about-club-item,
  .game-card,.game-panel,.classifieds-card,.finance-card,.finance-admin-report-card,.emergency-card,.park-rating-card,
  .theme-sheet .panel,.facebook-composer-card
) :where(h1,h2,h3,h4,h5,h6,strong,label,legend,.label,.rally-venue,.finance-value) {
  color:#17231b !important;
}
html[data-theme="heritage-club"] :where(
  .rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .newsletter-card,.newsletter-hero,.committee-card,.committee-hero,.milestone-summary,.milestone-progress-card,
  .notice-card,.notice-hero,.notice-document,.admin-login-card,.admin-dashboard,.admin-record-card,
  .photo-submit-card,.photo-admin-card,.weather-card,.park-card,.recipe-card,.resource-card,.about-club-item,
  .game-card,.game-panel,.classifieds-card,.finance-card,.finance-admin-report-card,.emergency-card,.park-rating-card,
  .theme-sheet .panel,.facebook-composer-card
) :where(p,small,.sub,.settings-note,.settings-about,.muted,.hint) {
  color:#5d574a !important;
}
html[data-theme="heritage-club"] :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  textarea,select,.rally-filter,.notice-search,.newsletter-search,.admin-search,.milestone-input-wrap
) {
  color:#17231b !important;
  background:#fffaf0 !important;
  border-color:#8c7449 !important;
  box-shadow:inset 0 1px 2px rgba(72,51,25,.08) !important;
}
html[data-theme="heritage-club"] :where(input,textarea)::placeholder { color:#746e62 !important; opacity:1 !important; }
html[data-theme="heritage-club"] select option { color:#17231b !important; background:#f6eedc !important; }

/* Heritage settings stays a dark club panel */
html[data-theme="heritage-club"] #screen-settings .settings-card,
html[data-theme="heritage-club"] #screen-settings .settings-hero {
  color:#f7efdd !important;
  background:#0d2d20 !important;
  background-image:linear-gradient(145deg,#123a29,#0a2419) !important;
  border-color:rgba(185,151,79,.52) !important;
}
html[data-theme="heritage-club"] #screen-settings
:where(h1,h2,h3,h4,h5,h6,strong,label,legend,.label) { color:#f7efdd !important; }
html[data-theme="heritage-club"] #screen-settings
:where(p,small,.settings-note,.settings-about,.muted,.hint) { color:#c8bda5 !important; }
html[data-theme="heritage-club"] #screen-settings .settings-heading>span { color:#ddc47f !important; }
html[data-theme="heritage-club"] #screen-settings :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  textarea,select,.settings-segment button,.settings-actions button,.settings-link-list a,
  .settings-notification-centre-link,.settings-theme-options button
) {
  color:#f7efdd !important;
  background:#102f22 !important;
  border-color:rgba(185,151,79,.48) !important;
}
html[data-theme="heritage-club"] #screen-settings :where(input,textarea)::placeholder { color:#b7ac94 !important; }
html[data-theme="heritage-club"] #screen-settings select option { color:#17231b !important; background:#f6eedc !important; }
html[data-theme="heritage-club"] #screen-settings .settings-theme-options button :where(strong) { color:#f7efdd !important; }
html[data-theme="heritage-club"] #screen-settings .settings-theme-options button :where(small) { color:#c8bda5 !important; }

/* Heritage actions */
html[data-theme="heritage-club"] :where(
  .primary-button,.rally-action-primary,.park-book-button,.game-new-button,.park-rating-submit,
  .settings-actions .primary,.settings-update-button,.settings-profile-submit:not(:disabled),
  .faq-scope-switch button.active,.admin-tabs button.active,.newsletter-year-filter.active,
  .calendar-view-toggle button.active,.notification-setup-modal-actions .primary
) {
  color:#fff5df !important;
  background:#5a171a !important;
  background-image:linear-gradient(180deg,#732328,#4b1114) !important;
  border-color:#b9974f !important;
}
html[data-theme="heritage-club"] :where(
  .rally-filter,.notice-filter-row button,.newsletter-year-filter,.calendar-view-toggle button,.admin-tabs button,
  .notice-view-button,.calendar-action,.committee-action,.milestone-reset,.newsletter-card-actions a,
  .newsletter-card-actions button,.notice-document-actions a,.notice-document-actions button,
  .settings-install-button,.settings-profile-load,.settings-profile-actions button,
  .notification-test-confirm button,.notification-device-help button,
  .admin-record-actions button,.finance-admin-card-actions button
) {
  color:#17231b !important;
  background:#fffaf0 !important;
  border-color:#8c7449 !important;
}
html[data-theme="heritage-club"] :where(button.danger,.admin-danger-action) {
  color:#fff5df !important;
  background:#5a171a !important;
  border-color:#8e5e36 !important;
}

/* Heritage tables */
html[data-theme="heritage-club"] :where(table,td,th) { color:#17231b !important; border-color:#a88b56 !important; }
html[data-theme="heritage-club"] thead th {
  color:#f8efdb !important;
  background:#0d2d20 !important;
}
html[data-theme="heritage-club"] tbody tr:nth-child(even) { background:rgba(46,105,73,.07) !important; }

/* Heritage bottom navigation */
html[data-theme="heritage-club"] .tabbar {
  color:#c8bda5 !important;
  background:#06170f !important;
  background-image:linear-gradient(180deg,#0b251a,#04110b) !important;
  border-top:1px solid #b9974f !important;
  box-shadow:0 -6px 18px rgba(0,0,0,.32) !important;
}
html[data-theme="heritage-club"] .tabbar button { color:#c8bda5 !important; }
html[data-theme="heritage-club"] .tabbar button.active {
  color:#ddc47f !important;
  background:#102f22 !important;
  border:1px solid rgba(185,151,79,.45) !important;
}
html[data-theme="heritage-club"] .home-social-link {
  color:#fff !important;
  background:#1877f2 !important;
  border-color:#fff !important;
}
html[data-theme="heritage-club"] #screen-home :where(.home-version,.settings-version-footer) { color:#a99b7c !important; }

/* Focus and reduced motion */
html:is([data-theme="roadside-50s"],[data-theme="heritage-club"]) :focus-visible {
  outline:3px solid #f1c94e !important;
  outline-offset:3px !important;
}
@media (max-width:620px) {
  html[data-theme="roadside-50s"] .tile.visual-tile { border-radius:15px !important; }
  html[data-theme="heritage-club"] .tile.visual-tile { border-radius:10px !important; }
}
@media (prefers-reduced-motion:reduce) {
  html:is([data-theme="roadside-50s"],[data-theme="heritage-club"]) * {
    transition:none !important;
    animation:none !important;
  }
}

/* =====================================================================
   v55.12.16 — Four professional component-audited skins
   Alpine Explorer · Moonlight Classic · Midnight Rally · Safari Lodge
   CSS-only implementation: no generated artwork or altered source images.
   ===================================================================== */

/* Theme palettes. The --skin-* variables deliberately separate page,
   panel, header, control and action contrast so text never relies on a
   single global colour across unlike surfaces. */
[data-theme="alpine-explorer"] {
  color-scheme:light;
  --bg:#e8ece4;
  --bg-soft:#f2f1e9;
  --surface:#fffaf0;
  --surface-raised:#ffffff;
  --surface-soft:#e6eadf;
  --cream:#173629;
  --ink:#10251c;
  --muted:#506158;
  --border:rgba(29,72,53,.24);
  --border-strong:rgba(29,72,53,.55);
  --gold:#b48732;
  --gold-light:#e0bf77;
  --rust:#a65437;
  --rust-light:#c67452;
  --green:#1e533b;
  --blue:#4f7880;
  --plum:#6f6572;
  --amber:#b88734;
  --crest-bg:#fffaf0;
  --hero-solid:#173f2c;
  --control-solid:#fffdf8;
  --nav-solid:#153a29;
  --modal-solid:#fffaf0;
  --hero-text:#fffdf5;
  --hero-muted:#dbe8df;
  --skin-page:#edf0e8;
  --skin-page-alt:#e4e8df;
  --skin-panel:#fffaf0;
  --skin-panel-raised:#ffffff;
  --skin-panel-text:#173629;
  --skin-panel-muted:#536159;
  --skin-panel-border:#c7cdbf;
  --skin-header:#173f2c;
  --skin-header-alt:#0f3021;
  --skin-header-text:#fffdf5;
  --skin-header-muted:#dbe8df;
  --skin-accent:#1e533b;
  --skin-accent-hover:#153f2d;
  --skin-accent-text:#ffffff;
  --skin-secondary:#fffdf8;
  --skin-secondary-text:#173629;
  --skin-secondary-border:#71847a;
  --skin-danger:#9e382f;
  --skin-danger-text:#ffffff;
  --skin-nav:#123524;
  --skin-nav-text:#dce8df;
  --skin-nav-active:#fffaf0;
  --skin-nav-active-text:#173629;
  --skin-focus:#d7a83e;
  --skin-shadow:0 14px 34px rgba(24,55,41,.14);
  --font-display:Georgia,"Times New Roman",serif;
  --font-body:Inter,Segoe UI,Arial,sans-serif;
}

[data-theme="moonlight-classic"] {
  color-scheme:dark;
  --bg:#070707;
  --bg-soft:#0d0d0d;
  --surface:#151515;
  --surface-raised:#1e1e1e;
  --surface-soft:#262626;
  --cream:#f2efe8;
  --ink:#0b0b0b;
  --muted:#bcb8b0;
  --border:rgba(242,239,232,.22);
  --border-strong:rgba(242,239,232,.55);
  --gold:#d7d1c5;
  --gold-light:#f2efe8;
  --rust:#89837b;
  --rust-light:#aaa49b;
  --green:#9d9f98;
  --blue:#9b9da0;
  --plum:#a09aa1;
  --amber:#c1baad;
  --crest-bg:#f2efe8;
  --hero-solid:#080808;
  --control-solid:#181818;
  --nav-solid:#050505;
  --modal-solid:#111111;
  --hero-text:#f6f3ec;
  --hero-muted:#c8c3ba;
  --skin-page:#080808;
  --skin-page-alt:#0d0d0d;
  --skin-panel:#151515;
  --skin-panel-raised:#1c1c1c;
  --skin-panel-text:#f2efe8;
  --skin-panel-muted:#bbb7af;
  --skin-panel-border:#454545;
  --skin-header:#050505;
  --skin-header-alt:#111111;
  --skin-header-text:#f6f3ec;
  --skin-header-muted:#c8c3ba;
  --skin-accent:#eeeae2;
  --skin-accent-hover:#ffffff;
  --skin-accent-text:#111111;
  --skin-secondary:#171717;
  --skin-secondary-text:#f2efe8;
  --skin-secondary-border:#77736c;
  --skin-danger:#8b2d2d;
  --skin-danger-text:#ffffff;
  --skin-nav:#050505;
  --skin-nav-text:#bcb8b0;
  --skin-nav-active:#f2efe8;
  --skin-nav-active-text:#0b0b0b;
  --skin-focus:#ffffff;
  --skin-shadow:0 16px 40px rgba(0,0,0,.5);
  --font-display:Georgia,"Times New Roman",serif;
  --font-body:Inter,Segoe UI,Arial,sans-serif;
}

[data-theme="midnight-rally"] {
  color-scheme:dark;
  --bg:#050505;
  --bg-soft:#0a0a0a;
  --surface:#121212;
  --surface-raised:#1b1b1b;
  --surface-soft:#232323;
  --cream:#f5f5f2;
  --ink:#080808;
  --muted:#bebebe;
  --border:rgba(255,255,255,.20);
  --border-strong:rgba(225,22,31,.66);
  --gold:#e1161f;
  --gold-light:#ff3b42;
  --rust:#c80f18;
  --rust-light:#ef2830;
  --green:#717775;
  --blue:#68727b;
  --plum:#80656f;
  --amber:#c33f26;
  --crest-bg:#f5f5f2;
  --hero-solid:#050505;
  --control-solid:#171717;
  --nav-solid:#050505;
  --modal-solid:#101010;
  --hero-text:#ffffff;
  --hero-muted:#c9c9c9;
  --skin-page:#050505;
  --skin-page-alt:#0a0a0a;
  --skin-panel:#121212;
  --skin-panel-raised:#1a1a1a;
  --skin-panel-text:#f5f5f2;
  --skin-panel-muted:#bdbdbd;
  --skin-panel-border:#3a3a3a;
  --skin-header:#050505;
  --skin-header-alt:#111111;
  --skin-header-text:#ffffff;
  --skin-header-muted:#c9c9c9;
  --skin-accent:#d7141d;
  --skin-accent-hover:#ef2029;
  --skin-accent-text:#ffffff;
  --skin-secondary:#131313;
  --skin-secondary-text:#f5f5f2;
  --skin-secondary-border:#d7141d;
  --skin-danger:#d7141d;
  --skin-danger-text:#ffffff;
  --skin-nav:#050505;
  --skin-nav-text:#c2c2c2;
  --skin-nav-active:#d7141d;
  --skin-nav-active-text:#ffffff;
  --skin-focus:#ff3941;
  --skin-shadow:0 18px 44px rgba(0,0,0,.58);
  --font-display:"Arial Narrow","Roboto Condensed",Impact,sans-serif;
  --font-body:Inter,Segoe UI,Arial,sans-serif;
}

[data-theme="safari-lodge"] {
  color-scheme:light;
  --bg:#eadfca;
  --bg-soft:#f3eadb;
  --surface:#fff7e8;
  --surface-raised:#fffdf7;
  --surface-soft:#e8d8bb;
  --cream:#173727;
  --ink:#10251a;
  --muted:#5b5a4c;
  --border:rgba(69,69,43,.25);
  --border-strong:rgba(177,76,39,.58);
  --gold:#c78939;
  --gold-light:#e0b76f;
  --rust:#b64d28;
  --rust-light:#d2683f;
  --green:#174e35;
  --blue:#47736a;
  --plum:#755e69;
  --amber:#c18433;
  --crest-bg:#fff7e8;
  --hero-solid:#174e35;
  --control-solid:#fffaf0;
  --nav-solid:#174e35;
  --modal-solid:#fff7e8;
  --hero-text:#fff9ed;
  --hero-muted:#e1e9dd;
  --skin-page:#f3ead9;
  --skin-page-alt:#eadcc3;
  --skin-panel:#fff7e8;
  --skin-panel-raised:#fffdf7;
  --skin-panel-text:#173727;
  --skin-panel-muted:#5b5a4c;
  --skin-panel-border:#d0b992;
  --skin-header:#174e35;
  --skin-header-alt:#103b28;
  --skin-header-text:#fff9ed;
  --skin-header-muted:#e1e9dd;
  --skin-accent:#b64d28;
  --skin-accent-hover:#963d20;
  --skin-accent-text:#ffffff;
  --skin-secondary:#fffaf0;
  --skin-secondary-text:#173727;
  --skin-secondary-border:#6e735d;
  --skin-danger:#9c342c;
  --skin-danger-text:#ffffff;
  --skin-nav:#174e35;
  --skin-nav-text:#e5eee6;
  --skin-nav-active:#fff7e8;
  --skin-nav-active-text:#173727;
  --skin-focus:#d38e36;
  --skin-shadow:0 14px 34px rgba(65,47,27,.16);
  --font-display:Georgia,"Times New Roman",serif;
  --font-body:Inter,Segoe UI,Arial,sans-serif;
}

/* Shared professional skin foundation. */
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]),
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) body {
  color:var(--skin-panel-text) !important;
  background-color:var(--skin-page) !important;
  background-image:linear-gradient(180deg,var(--skin-page),var(--skin-page-alt)) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .app,
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) main,
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .screen {
  color:var(--skin-panel-text) !important;
  background-color:var(--skin-page) !important;
  background-image:linear-gradient(180deg,var(--skin-page),var(--skin-page-alt)) !important;
}

/* Headers always use light text on deliberately dark surfaces. */
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(.hero,.screen-header) {
  color:var(--skin-header-text) !important;
  background-color:var(--skin-header) !important;
  background-image:linear-gradient(155deg,var(--skin-header),var(--skin-header-alt)) !important;
  border-color:color-mix(in srgb,var(--skin-focus) 48%,transparent) !important;
  box-shadow:0 10px 28px rgba(0,0,0,.18) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(.hero,.screen-header)
:where(h1,h2,h3,h4,h5,h6,strong,label,legend,.label,.eyebrow,.tagline,.screen-kicker) {
  color:var(--skin-header-text) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(.hero,.screen-header)
:where(p,small,.sub,.muted,.hint) { color:var(--skin-header-muted) !important; }
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .screen-header::after {
  background-color:var(--crest-bg) !important;
  border:2px solid color-mix(in srgb,var(--skin-focus) 70%,transparent) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(.theme-toggle,.home-alerts-button,.back-btn) {
  color:var(--skin-header-text) !important;
  background:color-mix(in srgb,var(--skin-header-alt) 90%,white 10%) !important;
  border:1px solid color-mix(in srgb,var(--skin-header-text) 36%,transparent) !important;
  box-shadow:0 6px 15px rgba(0,0,0,.22) !important;
}

/* Comprehensive panel audit. These are controlled content surfaces and always
   use --skin-panel-text, never inherited header text. */
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  .tile.visual-tile,.rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .calendar-viewer-header,.calendar-viewer-footer,.calendar-help,.newsletter-card,.newsletter-hero,.newsletter-reader-panel,
  .newsletter-email-panel,.committee-card,.committee-hero,.committee-payment,.milestone-summary,.milestone-progress-card,
  .milestone-lookup-card,.notice-card,.notice-hero,.notice-document,.notice-detail-panel,.notice-email-panel,.notice-view-menu,
  .admin-login-card,.admin-dashboard,.admin-stats>div,.admin-newsletter-sync,.admin-record-card,.admin-modal-panel,
  .admin-viz-card,.admin-setup-card,.admin-app-links-card,.chairman-task-document-card,.committee-task-drive-panel,
  .settings-hero,.settings-card,.settings-notification-card,.coming-soon,.photo-submit-card,.photo-admin-card,
  .photo-submit-panel,.notification-setup-panel,.weather-card,.weather-summary,.park-card,.park-detail-panel,
  .park-map-detail-panel,.park-map-directory-card,.park-rating-card,.park-rating-hero,.park-rating-scores-card,
  .recipe-card,.recipe-hero,.recipe-detail-panel,.recipe-page-panel,.recipe-submit-panel,.resource-card,.resource-hero,
  .resource-email-panel,.about-club-item,.games-intro,.games-hero,.game-card,.game-leaderboard,.game-panel,.game-modal-card,
  .classifieds-card,.classifieds-detail-panel,.classifieds-form-panel,.classifieds-hero,.finance-card,.finance-hero,
  .finance-admin-report-card,.finance-report-panel,.emergency-card,.emergency-panel,.emergency-hero,.faq-contact-card,.faq-hero,
  .gallery-hero,.gallery-submit-card,.gallery-album-panel,.gallery-viewer-panel,.intention-hero,.intention-card,
  .intention-total-card,.intention-thank-you-panel,.member-alerts-hero,.member-result-hero,.merch-hero,.merch-cart-panel,
  .merch-checkout-panel,.merch-modal-panel,.confirm-card,.crush-finish-card,.sudoku-win-card,.wj-win-card,
  .theme-sheet .panel,.facebook-composer-card
) {
  color:var(--skin-panel-text) !important;
  background-color:var(--skin-panel) !important;
  background-image:linear-gradient(145deg,var(--skin-panel-raised),var(--skin-panel)) !important;
  border-color:var(--skin-panel-border) !important;
  box-shadow:var(--skin-shadow) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  .tile.visual-tile,.rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .newsletter-card,.newsletter-hero,.newsletter-reader-panel,.committee-card,.committee-hero,.milestone-summary,
  .milestone-progress-card,.notice-card,.notice-hero,.notice-document,.admin-login-card,.admin-dashboard,.admin-record-card,
  .admin-viz-card,.admin-setup-card,.settings-hero,.settings-card,.photo-submit-card,.photo-admin-card,.weather-card,
  .park-card,.park-detail-panel,.park-map-detail-panel,.park-map-directory-card,.park-rating-card,.park-rating-hero,
  .recipe-card,.recipe-hero,.resource-card,.resource-hero,.about-club-item,.games-intro,.games-hero,.game-card,.game-panel,
  .classifieds-card,.classifieds-detail-panel,.classifieds-form-panel,.classifieds-hero,.finance-card,.finance-hero,
  .finance-admin-report-card,.finance-report-panel,.emergency-card,.emergency-panel,.emergency-hero,.faq-contact-card,.faq-hero,
  .gallery-hero,.gallery-submit-card,.gallery-album-panel,.gallery-viewer-panel,.intention-hero,.intention-card,
  .intention-total-card,.member-alerts-hero,.member-result-hero,.merch-hero,.merch-cart-panel,.merch-checkout-panel,
  .merch-modal-panel,.theme-sheet .panel,.facebook-composer-card
) :where(h1,h2,h3,h4,h5,h6,strong,label,legend,.label,.rally-venue,.finance-value) {
  color:var(--skin-panel-text) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  .tile.visual-tile,.rally-card,.rally-spotlight,.rally-detail-panel,.calendar-choice,.calendar-hero,.calendar-viewer,
  .newsletter-card,.newsletter-hero,.newsletter-reader-panel,.committee-card,.committee-hero,.milestone-summary,
  .milestone-progress-card,.notice-card,.notice-hero,.notice-document,.admin-login-card,.admin-dashboard,.admin-record-card,
  .admin-viz-card,.admin-setup-card,.settings-hero,.settings-card,.photo-submit-card,.photo-admin-card,.weather-card,
  .park-card,.park-detail-panel,.park-map-detail-panel,.park-map-directory-card,.park-rating-card,.park-rating-hero,
  .recipe-card,.recipe-hero,.resource-card,.resource-hero,.about-club-item,.games-intro,.games-hero,.game-card,.game-panel,
  .classifieds-card,.classifieds-detail-panel,.classifieds-form-panel,.classifieds-hero,.finance-card,.finance-hero,
  .finance-admin-report-card,.finance-report-panel,.emergency-card,.emergency-panel,.emergency-hero,.faq-contact-card,.faq-hero,
  .gallery-hero,.gallery-submit-card,.gallery-album-panel,.gallery-viewer-panel,.intention-hero,.intention-card,
  .intention-total-card,.member-alerts-hero,.member-result-hero,.merch-hero,.merch-cart-panel,.merch-checkout-panel,
  .merch-modal-panel,.theme-sheet .panel,.facebook-composer-card
) :where(p,small,.sub,.muted,.hint,.settings-note,.settings-about) {
  color:var(--skin-panel-muted) !important;
}

/* Form and filter audit. */
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),textarea,select,
  .rally-filter,.notice-search,.newsletter-search,.admin-search,.classifieds-search,.merch-search,.recipe-search,
  .resource-search,.gallery-search,.park-map-search,.milestone-input-wrap
) {
  color:var(--skin-panel-text) !important;
  background-color:var(--skin-panel-raised) !important;
  background-image:none !important;
  border-color:var(--skin-secondary-border) !important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.08) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(input,textarea)::placeholder {
  color:var(--skin-panel-muted) !important;
  opacity:1 !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) select option {
  color:var(--skin-panel-text) !important;
  background:var(--skin-panel-raised) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(input[type="checkbox"],input[type="radio"]) {
  accent-color:var(--skin-accent) !important;
}

/* Primary and secondary action states. */
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  .primary-button,.primary,.rally-action-primary,.park-book-button,.game-new-button,.park-rating-submit,
  .settings-actions .primary,.settings-update-button,.settings-profile-submit:not(:disabled),
  .faq-scope-switch button.active,.admin-tabs button.active,.newsletter-year-filter.active,
  .calendar-view-toggle button.active,.notification-setup-modal-actions .primary,.campy-submit-button,
  .merch-add-button,.finance-report-tabs button.active
) {
  color:var(--skin-accent-text) !important;
  background-color:var(--skin-accent) !important;
  background-image:linear-gradient(180deg,var(--skin-accent-hover),var(--skin-accent)) !important;
  border-color:color-mix(in srgb,var(--skin-accent) 66%,var(--skin-focus)) !important;
  box-shadow:0 8px 18px color-mix(in srgb,var(--skin-accent) 25%,transparent) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  .secondary,.rally-filter,.notice-filter-row button,.newsletter-year-filter,.calendar-view-toggle button,.admin-tabs button,
  .notice-view-button,.calendar-action,.committee-action,.milestone-reset,.newsletter-card-actions a,
  .newsletter-card-actions button,.notice-document-actions a,.notice-document-actions button,.settings-install-button,
  .settings-profile-load,.settings-profile-actions button,.settings-link-list a,.settings-notification-centre-link,
  .notification-test-confirm button,.notification-device-help button,.admin-record-actions button,
  .finance-admin-card-actions button,.classifieds-filter-row button,.resource-filter-row button,.recipe-course-filters button,
  .merch-filters button,.admin-request-filter-buttons button,.admin-stats-view-toggle button
) {
  color:var(--skin-secondary-text) !important;
  background-color:var(--skin-secondary) !important;
  background-image:none !important;
  border-color:var(--skin-secondary-border) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  button.danger,.admin-danger-action,.danger
) {
  color:var(--skin-danger-text) !important;
  background:var(--skin-danger) !important;
  border-color:color-mix(in srgb,var(--skin-danger) 72%,white) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(button,a,[role="button"]):disabled {
  opacity:.58 !important;
  filter:saturate(.35) !important;
  cursor:not-allowed !important;
}

/* Tables and data workspaces. */
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(table,td,th) {
  color:var(--skin-panel-text) !important;
  border-color:var(--skin-panel-border) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) thead th {
  color:var(--skin-header-text) !important;
  background:var(--skin-header) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) tbody tr:nth-child(even) {
  background:color-mix(in srgb,var(--skin-accent) 7%,transparent) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) tbody tr:hover {
  background:color-mix(in srgb,var(--skin-focus) 13%,transparent) !important;
}

/* Navigation and status surfaces. */
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .tabbar {
  color:var(--skin-nav-text) !important;
  background:var(--skin-nav) !important;
  border-top:1px solid color-mix(in srgb,var(--skin-focus) 54%,transparent) !important;
  box-shadow:0 -7px 20px rgba(0,0,0,.22) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .tabbar button {
  color:var(--skin-nav-text) !important;
  background:transparent !important;
  border-color:transparent !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .tabbar button.active {
  color:var(--skin-nav-active-text) !important;
  background:var(--skin-nav-active) !important;
  border:1px solid color-mix(in srgb,var(--skin-focus) 56%,transparent) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  .status-pill,.detail-status,.calendar-status,.admin-milestone-status,.admin-status-light,.admin-message,
  .settings-message,.settings-push-status,.settings-request-status,.facebook-post-status,.finance-admin-status,
  .member-alerts-status,.park-map-status-row,.emergency-location-status,.merch-add-status,.game-score-status
) {
  color:var(--skin-panel-text) !important;
  background:color-mix(in srgb,var(--skin-panel-raised) 88%,var(--skin-accent) 12%) !important;
  border-color:color-mix(in srgb,var(--skin-accent) 38%,var(--skin-panel-border)) !important;
}

/* Transparent icon audit. Source photos are untouched; only icon hosts lose
   synthetic panels and pasted-on boxes. */
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  .visual-icon-wrap,.premium-icon-host,.premium-section-icon,.status-icon,.calendar-hero-icon,.calendar-help-icon,
  .faq-hero-icon,.finance-hero-icon,.finance-home-icon,.park-map-home-icon,.settings-tile-icon,.settings-hero-icon,
  .newsletter-hero-icon,.newsletter-email-icon,.merch-hero-icon,.emergency-header-icon,.gallery-submit-card-icon,
  .photo-file-picker-icon,.game-card-icon,.spotlight-icon,.detail-row-icon,.committee-payment-icon,.notice-view-icon,
  .admin-newsletter-sync-icon,.gallery-setup-icon,.newsletter-setup-icon
) {
  overflow:visible !important;
  color:inherit !important;
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  box-shadow:none !important;
  outline:0 !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  .visual-icon-wrap,.premium-icon-host,.premium-section-icon,.status-icon,.calendar-hero-icon,.calendar-help-icon,
  .faq-hero-icon,.finance-hero-icon,.finance-home-icon,.park-map-home-icon,.settings-tile-icon,.settings-hero-icon,
  .newsletter-hero-icon,.newsletter-email-icon,.merch-hero-icon,.emergency-header-icon,.gallery-submit-card-icon,
  .photo-file-picker-icon,.game-card-icon,.spotlight-icon,.detail-row-icon,.committee-payment-icon,.notice-view-icon,
  .admin-newsletter-sync-icon,.gallery-setup-icon,.newsletter-setup-icon
)::before,
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  .visual-icon-wrap,.premium-icon-host,.premium-section-icon,.status-icon,.calendar-hero-icon,.calendar-help-icon,
  .faq-hero-icon,.finance-hero-icon,.finance-home-icon,.park-map-home-icon,.settings-tile-icon,.settings-hero-icon,
  .newsletter-hero-icon,.newsletter-email-icon,.merch-hero-icon,.emergency-header-icon,.gallery-submit-card-icon,
  .photo-file-picker-icon,.game-card-icon,.spotlight-icon,.detail-row-icon,.committee-payment-icon,.notice-view-icon,
  .admin-newsletter-sync-icon,.gallery-setup-icon,.newsletter-setup-icon
)::after { display:none !important; }
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(
  .visual-icon-wrap img,.premium-registry-image,.premium-section-icon img,.status-icon img,.calendar-hero-icon img,
  .faq-hero-icon img,.finance-hero-icon img,.finance-home-icon img,.park-map-home-icon img,.settings-tile-icon img,
  .settings-hero-icon img,.newsletter-hero-icon img,.newsletter-email-icon img,.merch-hero-icon img,
  .emergency-header-icon img,.gallery-submit-card-icon img,.photo-file-picker-icon img,.game-card-icon img
) {
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  object-fit:contain !important;
  mix-blend-mode:normal !important;
  filter:drop-shadow(0 7px 9px rgba(0,0,0,.18)) !important;
}

/* Settings chooser stays readable regardless of the active skin. */
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .settings-theme-options button {
  color:var(--skin-panel-text) !important;
  background:var(--skin-panel-raised) !important;
  border-color:var(--skin-panel-border) !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .settings-theme-options button :where(strong) { color:var(--skin-panel-text) !important; }
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .settings-theme-options button :where(small) { color:var(--skin-panel-muted) !important; }
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .settings-theme-options button.active {
  border-color:var(--skin-focus) !important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--skin-focus) 24%,transparent) !important;
}

html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :focus-visible {
  outline:3px solid var(--skin-focus) !important;
  outline-offset:3px !important;
}
html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .home-social-link {
  color:#fff !important;
  background:#1877f2 !important;
  border-color:#fff !important;
}

/* Theme-specific visual language. */
html[data-theme="alpine-explorer"] :where(.hero,.screen-header) {
  background-image:
    linear-gradient(135deg,rgba(255,255,255,.035) 25%,transparent 25%) 0 0/18px 18px,
    linear-gradient(155deg,#1c4b35,#102f22) !important;
}
html[data-theme="alpine-explorer"] :where(.tile.visual-tile,.rally-card,.park-card,.calendar-choice) { border-radius:18px !important; }
html[data-theme="alpine-explorer"] .section-kicker { color:#356d50 !important; }
html[data-theme="alpine-explorer"] .section-heading h2 { color:#173629 !important; }
html[data-theme="alpine-explorer"] .section-rule { background:linear-gradient(90deg,transparent,#7d9988,transparent) !important; }

html[data-theme="moonlight-classic"] :where(.hero,.screen-header) {
  background-image:
    radial-gradient(circle at 12% 24%,rgba(255,255,255,.34) 0 1px,transparent 1.4px),
    radial-gradient(circle at 74% 16%,rgba(255,255,255,.25) 0 1px,transparent 1.3px),
    linear-gradient(155deg,#111,#030303) !important;
  background-size:44px 44px,61px 61px,auto !important;
}
html[data-theme="moonlight-classic"] :where(.hero h1,.screen-header h2,.section-heading h2,.rally-title,.park-title) {
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:500 !important;
  letter-spacing:.01em !important;
}
html[data-theme="moonlight-classic"] :where(.tile.visual-tile,.rally-card,.park-card,.settings-card) {
  border-radius:9px !important;
  border-color:#444 !important;
}
html[data-theme="moonlight-classic"] .section-kicker { color:#c8c3ba !important; }
html[data-theme="moonlight-classic"] .section-rule { background:linear-gradient(90deg,transparent,#8e8a83,transparent) !important; }

html[data-theme="midnight-rally"] :where(.hero,.screen-header) {
  background-image:
    repeating-linear-gradient(105deg,transparent 0 17px,rgba(255,255,255,.025) 18px,transparent 19px 36px),
    linear-gradient(155deg,#111,#020202) !important;
}
html[data-theme="midnight-rally"] :where(.hero h1,.screen-header h2,.section-heading h2,.rally-title,.park-title) {
  font-family:"Arial Narrow","Roboto Condensed",Impact,sans-serif !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.025em !important;
}
html[data-theme="midnight-rally"] :where(.section-kicker,.tile-overline,.screen-kicker) {
  color:#ff3139 !important;
  font-weight:900 !important;
  letter-spacing:.12em !important;
}
html[data-theme="midnight-rally"] .section-rule { background:linear-gradient(90deg,transparent,#d7141d 16%,#d7141d 84%,transparent) !important; }
html[data-theme="midnight-rally"] :where(.tile.visual-tile,.rally-card,.park-card,.settings-card) {
  border-radius:8px !important;
  border-color:#3a3a3a !important;
}
html[data-theme="midnight-rally"] :where(.tile.visual-tile.featured,.rally-spotlight) { border-color:#d7141d !important; }

html[data-theme="safari-lodge"] :where(.hero,.screen-header) {
  background-image:
    repeating-linear-gradient(45deg,rgba(255,255,255,.035) 0 6px,transparent 6px 12px),
    linear-gradient(155deg,#1b563a,#103b28) !important;
}
html[data-theme="safari-lodge"] :where(.hero,.screen-header,.tabbar)::before {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:5px;
  pointer-events:none;
  background:repeating-linear-gradient(90deg,#f1d7a7 0 10px,#b64d28 10px 20px,#174e35 20px 30px,#d49848 30px 40px) !important;
  opacity:.9;
}
html[data-theme="safari-lodge"] :where(.hero h1,.screen-header h2,.section-heading h2,.rally-title,.park-title) {
  font-family:Georgia,"Times New Roman",serif !important;
}
html[data-theme="safari-lodge"] .section-kicker { color:#a64728 !important; }
html[data-theme="safari-lodge"] .section-heading h2 { color:#173727 !important; }
html[data-theme="safari-lodge"] .section-rule { background:linear-gradient(90deg,transparent,#b64d28 20%,#d19a54 50%,#174e35 80%,transparent) !important; }
html[data-theme="safari-lodge"] :where(.tile.visual-tile,.rally-card,.park-card,.settings-card) { border-radius:15px !important; }

@media (max-width:620px) {
  html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) .settings-theme-options { grid-template-columns:1fr !important; }
  html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) :where(.tile.visual-tile,.rally-card,.park-card) { min-width:0 !important; }
}
@media (prefers-reduced-motion:reduce) {
  html:is([data-theme="alpine-explorer"],[data-theme="moonlight-classic"],[data-theme="midnight-rally"],[data-theme="safari-lodge"]) * {
    animation:none !important;
    transition:none !important;
  }
}

/* =====================================================================
   v55.12.19 — Universal contrast safety layer
   Theme artwork remains intact. This layer gives finance/data surfaces
   explicit semantics and supports the runtime WCAG contrast guard.
   ===================================================================== */

/* Theme-independent page text used for notes placed directly on the page. */
:root,
[data-theme="bark"],
[data-theme="ccsa-green"],
[data-theme="leather"],
[data-theme="luxury"],
[data-theme="midlands"],
[data-theme="boutique"],
[data-theme="bark-classic"],
[data-theme="ccsa-green-classic"] {
  --audit-page-text:var(--cream);
  --audit-page-muted:var(--muted);
  --audit-data-bg:var(--surface-raised);
  --audit-data-bg-alt:var(--surface);
  --audit-data-text:var(--cream);
  --audit-data-muted:var(--muted);
  --audit-data-accent:var(--gold-light);
  --audit-field-bg:color-mix(in srgb,var(--surface-raised) 88%,white 12%);
  --audit-field-text:var(--cream);
  --audit-field-border:var(--border-strong);
}
[data-theme="roadside-50s"] {
  --audit-page-text:#2b211b;
  --audit-page-muted:#5d5044;
  --audit-data-bg:#244f46;
  --audit-data-bg-alt:#173e37;
  --audit-data-text:#fffaf0;
  --audit-data-muted:#e8ded0;
  --audit-data-accent:#f5cf62;
  --audit-field-bg:#fffdf7;
  --audit-field-text:#2b211b;
  --audit-field-border:#927b65;
}
[data-theme="heritage-club"] {
  --audit-page-text:#17231b;
  --audit-page-muted:#5d574a;
  --audit-data-bg:#123a29;
  --audit-data-bg-alt:#0a281c;
  --audit-data-text:#f7efdd;
  --audit-data-muted:#d4c8af;
  --audit-data-accent:#ddc47f;
  --audit-field-bg:#fffaf0;
  --audit-field-text:#17231b;
  --audit-field-border:#8c7449;
}
[data-theme="alpine-explorer"] {
  --audit-page-text:#173629;
  --audit-page-muted:#536159;
  --audit-data-bg:#1c4b35;
  --audit-data-bg-alt:#102f22;
  --audit-data-text:#fffdf5;
  --audit-data-muted:#dbe8df;
  --audit-data-accent:#e0bf77;
  --audit-field-bg:#fffdf8;
  --audit-field-text:#173629;
  --audit-field-border:#71847a;
}
[data-theme="moonlight-classic"] {
  --audit-page-text:#f2efe8;
  --audit-page-muted:#bbb7af;
  --audit-data-bg:#1b1b1b;
  --audit-data-bg-alt:#0d0d0d;
  --audit-data-text:#f6f3ec;
  --audit-data-muted:#c8c3ba;
  --audit-data-accent:#f2efe8;
  --audit-field-bg:#f2efe8;
  --audit-field-text:#111111;
  --audit-field-border:#77736c;
}
[data-theme="midnight-rally"] {
  --audit-page-text:#f5f5f2;
  --audit-page-muted:#bdbdbd;
  --audit-data-bg:#171717;
  --audit-data-bg-alt:#090909;
  --audit-data-text:#ffffff;
  --audit-data-muted:#cccccc;
  --audit-data-accent:#ff3b42;
  --audit-field-bg:#f5f5f2;
  --audit-field-text:#101010;
  --audit-field-border:#d7141d;
}
[data-theme="safari-lodge"] {
  --audit-page-text:#173727;
  --audit-page-muted:#5b5a4c;
  --audit-data-bg:#1b563a;
  --audit-data-bg-alt:#103b28;
  --audit-data-text:#fff9ed;
  --audit-data-muted:#e1e9dd;
  --audit-data-accent:#e0b76f;
  --audit-field-bg:#fffaf0;
  --audit-field-text:#173727;
  --audit-field-border:#6e735d;
}

/* Finance and other dense data areas have deliberately dark reading surfaces,
   with light text, in every theme. Native controls remain light with dark text. */
html[data-theme] :where(
  .finance-hero,.finance-controls,.finance-loading,.finance-error,.finance-empty,
  .finance-summary-card,.finance-chart-card,.finance-detail-card,.finance-full-data,
  .finance-admin-workspace,.finance-admin-report-card,.finance-admin-editor
) {
  color:var(--audit-data-text) !important;
  background-color:var(--audit-data-bg) !important;
  background-image:linear-gradient(145deg,var(--audit-data-bg),var(--audit-data-bg-alt)) !important;
  border-color:color-mix(in srgb,var(--audit-data-accent) 40%,transparent) !important;
}
html[data-theme] :where(
  .finance-hero,.finance-controls,.finance-loading,.finance-error,.finance-empty,
  .finance-summary-card,.finance-chart-card,.finance-detail-card,.finance-full-data,
  .finance-admin-workspace,.finance-admin-report-card,.finance-admin-editor
) :where(h1,h2,h3,h4,h5,h6,strong,label,legend,.label,summary) {
  color:var(--audit-data-text) !important;
}
html[data-theme] :where(
  .finance-hero,.finance-controls,.finance-loading,.finance-error,.finance-empty,
  .finance-summary-card,.finance-chart-card,.finance-detail-card,.finance-full-data,
  .finance-admin-workspace,.finance-admin-report-card,.finance-admin-editor
) :where(p,small,span,em,.sub,.muted,.hint) {
  color:var(--audit-data-muted) !important;
}
html[data-theme] :where(
  .finance-hero span,.finance-card-heading span,.finance-admin-heading span,.finance-admin-editor-heading span,
  .finance-controls label span,.finance-admin-report-card>div>span,.finance-comparison-table .finance-group-row th
) {
  color:var(--audit-data-accent) !important;
}
html[data-theme] :where(
  .finance-controls select,.finance-period-control select,.finance-admin-editor input,.finance-admin-editor select
) {
  color:var(--audit-field-text) !important;
  background:var(--audit-field-bg) !important;
  border-color:var(--audit-field-border) !important;
  -webkit-text-fill-color:var(--audit-field-text) !important;
}
html[data-theme] :where(
  .finance-controls select,.finance-period-control select,.finance-admin-editor select
) option {
  color:#171717 !important;
  background:#ffffff !important;
}
html[data-theme] .finance-report-tabs button:not(.active),
html[data-theme] .finance-controls>button,
html[data-theme] .finance-admin-heading-actions button:not(.admin-primary-btn),
html[data-theme] .finance-admin-editor-heading button,
html[data-theme] .finance-admin-card-actions button,
html[data-theme] .finance-admin-tab-picker button {
  color:var(--audit-data-text) !important;
  background:color-mix(in srgb,var(--audit-data-bg) 76%,white 8%) !important;
  border-color:color-mix(in srgb,var(--audit-data-accent) 42%,transparent) !important;
}
html[data-theme] .finance-report-tabs button.active,
html[data-theme] .finance-admin-heading-actions .admin-primary-btn,
html[data-theme] .finance-admin-form-actions .admin-primary-btn {
  color:#16130d !important;
  background:var(--audit-data-accent) !important;
  border-color:var(--audit-data-accent) !important;
}
html[data-theme] .finance-source-note {
  color:var(--audit-page-muted) !important;
}
html[data-theme] :where(.finance-comparison-table,.finance-full-data table) {
  color:var(--audit-data-text) !important;
  background:color-mix(in srgb,var(--audit-data-bg-alt) 88%,black 12%) !important;
}
html[data-theme] :where(.finance-comparison-table th,.finance-comparison-table td,.finance-full-data th,.finance-full-data td) {
  color:var(--audit-data-text) !important;
  border-color:color-mix(in srgb,var(--audit-data-text) 14%,transparent) !important;
}
html[data-theme] :where(.finance-comparison-table thead th,.finance-full-data thead th) {
  color:#17130d !important;
  background:var(--audit-data-accent) !important;
}
html[data-theme] .finance-comparison-table .finance-group-row th {
  color:var(--audit-data-accent) !important;
  background:color-mix(in srgb,var(--audit-data-accent) 12%,var(--audit-data-bg)) !important;
}
html[data-theme] .finance-full-data .finance-source-header td {
  color:var(--audit-data-text) !important;
  background:color-mix(in srgb,var(--audit-data-accent) 12%,var(--audit-data-bg)) !important;
}
html[data-theme] .finance-detail-group {
  color:var(--audit-data-text) !important;
  background:color-mix(in srgb,var(--audit-data-bg-alt) 78%,white 4%) !important;
}
html[data-theme] .finance-detail-group :where(summary,p,span,strong) {
  color:var(--audit-data-text) !important;
}
html[data-theme] .finance-detail-group p {
  border-color:color-mix(in srgb,var(--audit-data-text) 13%,transparent) !important;
}

/* Runtime contrast corrections are applied only when measured contrast is
   below WCAG AA. They are removed and recalculated whenever the theme,
   active screen, dialog or dynamically rendered data changes. */
html[data-theme] [data-contrast-guard] {
  color:var(--ccsa-contrast-guard-color) !important;
  -webkit-text-fill-color:var(--ccsa-contrast-guard-color) !important;
}
html[data-theme] input[data-contrast-guard]::placeholder,
html[data-theme] textarea[data-contrast-guard]::placeholder {
  color:var(--ccsa-contrast-placeholder-color) !important;
  -webkit-text-fill-color:var(--ccsa-contrast-placeholder-color) !important;
  opacity:.72 !important;
}
html[data-theme] :where(button,input,select,textarea):disabled {
  opacity:.74 !important;
}

/* =====================================================================
   v55.12.19 — Universal inner-page header alignment
   Every top-level screen now uses the same shell gutter and header grid.
   This overrides historic page-specific negative margins and narrow
   paddings that caused headings to start at different horizontal points.
   ===================================================================== */
.screen {
  --ccsa-page-gutter: 18px;
  padding-left: var(--ccsa-page-gutter) !important;
  padding-right: var(--ccsa-page-gutter) !important;
}

.screen > .screen-header {
  --ccsa-header-back-size: 52px;
  --ccsa-header-gap: 17px;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 22px !important;
  display: grid !important;
  grid-template-columns: var(--ccsa-header-back-size) minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: var(--ccsa-header-gap) !important;
  text-align: left !important;
}

.screen > .screen-header > .back-btn {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: var(--ccsa-header-back-size) !important;
  height: var(--ccsa-header-back-size) !important;
  margin: 0 !important;
  justify-self: start !important;
  align-self: center !important;
}

.screen > .screen-header > div {
  grid-column: 2 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  justify-self: stretch !important;
  align-self: center !important;
  text-align: left !important;
}

.screen > .screen-header .screen-kicker,
.screen > .screen-header h2 {
  text-align: left !important;
}

.screen > .screen-header h2 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* The newsletter screen previously supplied its own outer gutter because
   its parent had no padding. The universal screen gutter now owns it. */
.newsletters-screen > :not(.screen-header) {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

@media (max-width: 430px) {
  .screen > .screen-header {
    --ccsa-header-back-size: 46px;
    --ccsa-header-gap: 12px;
  }
}

@media (min-width: 900px) {
  .screen {
    --ccsa-page-gutter: clamp(26px, 3.2vw, 52px);
    padding-top: 30px !important;
  }

  .screen > .screen-header {
    width: min(1440px, 100%) !important;
    max-width: 1440px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 22px !important;
  }
}

/* =====================================================================
   v55.12.19 — WCAG 2.2 AA universal contrast cascade repair
   The runtime contrast guard must outrank every theme-specific !important
   rule, including settings actions and dynamically rendered data controls.
   ===================================================================== */
html[data-theme] body .app [data-contrast-guard][data-contrast-guard] {
  color:var(--ccsa-contrast-guard-color) !important;
  -webkit-text-fill-color:var(--ccsa-contrast-guard-color) !important;
}
html[data-theme] body .app input[data-contrast-guard][data-contrast-guard]::placeholder,
html[data-theme] body .app textarea[data-contrast-guard][data-contrast-guard]::placeholder {
  color:var(--ccsa-contrast-placeholder-color) !important;
  -webkit-text-fill-color:var(--ccsa-contrast-placeholder-color) !important;
  opacity:.78 !important;
}

/* Stable, explicit contrast for the settings primary actions. These buttons
   were the confirmed cascade failure in CCSA Green — Original. */
html[data-theme] body .app :is(
  #settingsSaveDetails,#settingsEnablePush,#settingsPushTestYes,
  #settingsCheckUpdates,.settings-update-button
) {
  color:#15120b !important;
  -webkit-text-fill-color:#15120b !important;
  background:#efc532 !important;
  background-image:linear-gradient(135deg,#f8d85a,#dca814) !important;
  border-color:#fff0a5 !important;
}
html[data-theme] body .app :is(
  #settingsSaveDetails,#settingsEnablePush,#settingsPushTestYes,
  #settingsCheckUpdates,.settings-update-button
) :where(span,strong,small,b,i) {
  color:inherit !important;
  -webkit-text-fill-color:currentColor !important;
}

/* =====================================================================
   v55.12.21 — Emergency assistance message preview
   ===================================================================== */
.emergency-message-preview {
  display: grid;
  gap: 9px;
  margin-top: 2px;
  padding: 13px;
  border: 1px solid var(--border-strong);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface-soft) 72%, var(--surface));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.emergency-message-preview-heading {
  display: grid;
  gap: 3px;
}
.emergency-message-preview-heading strong {
  color: var(--cream);
  font-size: 11px;
}
.emergency-message-preview-heading span {
  color: var(--muted);
  font-size: 8px;
  line-height: 1.45;
}
#emergencyMessagePreview {
  width: 100%;
  min-height: 132px;
  max-height: 320px;
  margin: 0;
  padding: 13px 14px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  user-select: text;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  color: var(--cream);
  font: 600 10px/1.65 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  -webkit-overflow-scrolling: touch;
}
#emergencyMessagePreview:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
}
