.admin-page { background: var(--ivory); }
.admin-header { min-height: 5rem; display: flex; align-items: center; border-bottom: 1px solid var(--line); background: rgba(255,253,252,.92); }
.admin-header .container { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.admin-shell { display: grid; gap: 1.25rem; }
.admin-intro { max-width: 48rem; margin-bottom: 1rem; }
.admin-intro h1 { font-family: var(--serif); font-size: var(--step-3); font-weight: 400; }
.admin-card { padding: clamp(1.2rem, 3vw, 2rem); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--white); box-shadow: 0 .8rem 2.5rem rgba(48,50,44,.06); }
.admin-card__heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.admin-card__heading h2 { margin: 0; font-size: var(--step-2); }
.admin-card__heading > span { padding: .4rem .65rem; border-radius: 999px; background: var(--sage-light); color: var(--charcoal); font-size: .72rem; font-weight: 800; }
.admin-fetch-form { display: grid; grid-template-columns: 1fr auto auto; gap: 1rem; align-items: end; }
.admin-status { margin-top: 1rem; padding: 1rem; border-left: 4px solid var(--sage); background: var(--ivory); white-space: pre-wrap; }
.admin-status[data-state="error"] { border-left-color: var(--danger); background: #fff1ef; }
.admin-help { margin-top: -.35rem; color: var(--gray); max-width: 52rem; }
.admin-login { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; align-items: end; }
.submissions-list { display: grid; gap: .75rem; margin-top: 1rem; }
.admin-empty { margin: 0; padding: 1.15rem; border: 1px dashed var(--line); border-radius: var(--radius-sm); color: var(--gray); }
.submission-card { padding: 1.15rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--ivory); }
.submission-card__heading { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.submission-card h3 { margin: 0; font-size: 1rem; }
.submission-card time { color: var(--gray); font-size: .75rem; }
.submission-card dl { display: grid; grid-template-columns: minmax(7rem, 10rem) 1fr; gap: .35rem 1rem; margin: .9rem 0 0; }
.submission-card dt { color: var(--gray); font-size: .72rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.submission-card dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-top: 1rem; }
.metrics div { padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius-sm); }
.metrics span { display: block; color: var(--gray); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.metrics strong { display: block; margin-top: .25rem; overflow-wrap: anywhere; }
.admin-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1rem; }
.admin-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; align-items: start; }
.admin-meta-form { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin-bottom: 1rem; }
.admin-meta-form .field:first-child { grid-column: 1 / -1; }
.json-output, .diagnostics pre { max-height: 32rem; overflow: auto; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: #171914; color: #edf1e7; font: .82rem/1.55 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.admin-progress{margin:1rem 0;padding:.85rem 1rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--ivory)}.admin-progress>div{display:flex;justify-content:space-between;gap:1rem}.admin-progress progress{width:100%;height:.7rem;margin-top:.65rem;border:0;border-radius:999px;overflow:hidden;accent-color:var(--gold)}.admin-progress progress::-webkit-progress-value{background:linear-gradient(90deg,var(--sage),var(--gold))}.admin-progress span{font-variant-numeric:tabular-nums;font-weight:800}
.diagnostics summary { min-height: 48px; display: flex; align-items: center; font-weight: 800; cursor: pointer; }
@media (max-width: 55rem) { .admin-fetch-form, .admin-grid, .admin-login { grid-template-columns: 1fr; }.metrics { grid-template-columns: 1fr 1fr; } }
@media (max-width: 32rem) { .admin-header .button { width: auto; }.admin-header .brand small { display: none; }.metrics, .admin-meta-form { grid-template-columns: 1fr; }.admin-meta-form .field:first-child { grid-column: auto; } }

.hub-admin { display: grid; gap: 1.25rem; }
.admin-section-nav { position: sticky; z-index: 5; top: 0; display: flex; gap: .45rem; overflow-x: auto; padding: .7rem; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,253,252,.96); box-shadow: 0 .35rem 1.2rem rgba(48,50,44,.08); scrollbar-width: thin; }
.admin-section-nav a { flex: 0 0 auto; min-height: 42px; display: inline-flex; align-items: center; padding: .55rem .85rem; border-radius: .45rem; color: var(--forest); text-decoration: none; font-size: .85rem; font-weight: 800; }
.admin-section-nav a:hover { background: var(--sage-light); }
.admin-metrics { display: grid; grid-template-columns: repeat(6,1fr); gap: .65rem; }
.admin-metrics div { min-height: 6.2rem; display: flex; flex-direction: column; justify-content: space-between; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--ivory); }
.admin-metrics span { color: var(--gray); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.admin-metrics strong { color: var(--forest); font-family: var(--serif); font-size: 2rem; }
.admin-editor { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--ivory); }
.admin-editor .admin-span-2 { grid-column: 1/-1; }
.admin-editor > .button { align-self: end; justify-self: start; }
.admin-editor > .admin-status { margin: 0; padding: .75rem; }
.admin-record-list { display: grid; gap: .7rem; margin-top: 1rem; }
.admin-record { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius-sm); }
.admin-record h3 { margin: 0; font-size: 1.05rem; }
.admin-record p { margin: .35rem 0 0; color: var(--gray); white-space: pre-wrap; }
.admin-record small { display: block; margin-top: .45rem; color: var(--gray); }
.admin-record__actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: .4rem; }
.admin-record__actions button,.admin-record__actions select { min-height: 38px; padding: .4rem .6rem; border: 1px solid var(--line); border-radius: .4rem; background: var(--white); }
.admin-search { display: grid; grid-template-columns: 1fr auto; gap: .7rem; align-items: end; }
.system-health{display:grid;grid-template-columns:.45fr .8fr 1.5fr;gap:.7rem;margin:1rem 0}.system-health>div{display:grid;gap:.35rem;padding:1rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--ivory)}.system-health span{color:var(--gray);font-size:.72rem;font-weight:800;text-transform:uppercase}.system-health strong{color:var(--forest);font-size:1rem;overflow-wrap:anywhere}.admin-card__heading--sub{margin-top:1.5rem;padding-top:1.2rem;border-top:1px solid var(--line)}.admin-card__heading--sub h3{margin:.1rem 0;font-size:1.25rem}
@media(max-width:68rem){.admin-metrics{grid-template-columns:repeat(3,1fr)}}
@media(max-width:44rem){.admin-metrics{grid-template-columns:1fr 1fr}.admin-editor{grid-template-columns:1fr}.admin-editor .admin-span-2{grid-column:auto}.admin-record{grid-template-columns:1fr}.admin-record__actions{justify-content:flex-start}.admin-search,.system-health{grid-template-columns:1fr}.admin-section-nav{margin-inline:-.5rem}}
.admin-filter-row{display:grid;grid-template-columns:14rem minmax(0,1fr);gap:.75rem;margin:1rem 0}.operations-list .admin-record[data-priority="urgent"]{border-left:5px solid #a83f35}.operations-list .admin-record[data-priority="high"]{border-left:5px solid #c28a2c}.admin-record[data-delivery="failed"]{border-left:5px solid #a83f35}.admin-record[data-delivery="delivered"]{border-left:5px solid #4f7d5d}.staff-profile-editor{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--ivory);overflow:hidden}.staff-profile-editor>summary{min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1rem;cursor:pointer}.staff-profile-editor>summary span{color:var(--gray);font-size:.8rem}.staff-profile-editor>.admin-editor{border:0;border-top:1px solid var(--line);border-radius:0}.admin-record__actions select{max-width:12rem}.admin-record__actions button{font-weight:700}@media(max-width:44rem){.admin-filter-row{grid-template-columns:1fr}.operations-list .admin-record__actions{display:grid;grid-template-columns:1fr 1fr}.operations-list .admin-record__actions select,.operations-list .admin-record__actions button{width:100%;max-width:none;min-height:44px}}
.member-contact-links{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.75rem}.member-contact-links a{display:inline-flex;align-items:center;min-height:38px;padding:.4rem .7rem;border:1px solid var(--forest);border-radius:.45rem;color:var(--forest);font-weight:750;text-decoration:none}.member-private-details{margin-top:.75rem;padding:.7rem;border:1px solid var(--line);border-radius:.5rem;background:var(--ivory)}.member-private-details summary{cursor:pointer;color:var(--forest);font-weight:800}.member-detail-grid{display:grid;grid-template-columns:10rem 1fr;gap:.45rem .8rem;margin:.8rem 0 0}.member-detail-grid dt{color:var(--gray);font-weight:750}.member-detail-grid dd{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}@media(max-width:44rem){.member-detail-grid{grid-template-columns:1fr}.member-detail-grid dd{margin-bottom:.45rem}.member-contact-links a{flex:1;justify-content:center}}

/* ===== 2026.2 redesign — calm staff workspace in the unified Oasis language ===== */
.admin-page { background: linear-gradient(180deg, #f7f2e6, var(--ivory) 22rem); }
.admin-header { background: var(--forest); border-bottom: 0; }
.admin-header .brand strong { color: #1b251c; }
.admin-header .brand small { color: #4c5b4d; }
.admin-header .button--secondary { color: var(--cream); border-color: rgba(253,249,239,.4); }
.admin-header .button--secondary:hover { border-color: var(--gold); background: rgba(253,249,239,.08); color: var(--cream); }
.admin-intro h1 { letter-spacing: -.018em; }
.admin-card { border-color: rgba(23,32,25,.11); box-shadow: 0 .7rem 2rem rgba(21,43,32,.06); }
.admin-card__heading > span { background: var(--forest); color: var(--cream); }
.admin-card__heading > span:empty { display: none; }
.admin-section-nav { border-color: rgba(23,32,25,.12); background: rgba(253,249,239,.97); }
.admin-section-nav a { border-radius: 999px; }
.admin-section-nav a:hover { background: var(--forest); color: var(--cream); }
.admin-metrics div, .metrics div, .system-health > div { background: #fbf7ec; border-color: rgba(23,32,25,.12); border-radius: var(--radius-sm); }
.admin-metrics strong { color: #1d3a2a; }
.admin-status { border-left-color: var(--gold); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: #f7f2e4; }
.admin-status[data-state="error"] { background: #fdf0ec; }
.submission-card, .admin-editor, .admin-progress, .staff-profile-editor, .member-private-details { background: #fbf7ec; }
.admin-record { background: var(--white); border-color: rgba(23,32,25,.11); border-radius: var(--radius-sm); }
.member-contact-links a:hover { background: var(--forest); color: var(--cream); }

/* ===== Paged lists, richer directory search, and the RSVP viewer ===== */
.admin-list-total { margin: 0 0 .6rem; color: var(--gray); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.admin-show-more { width: 100%; margin-top: .35rem; }

.admin-search--rich { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; align-items: end; }
.admin-search--rich .admin-search__q { grid-column: 1 / -1; }
.admin-search--rich select, .admin-search--rich input { width: 100%; min-height: 46px; }
.admin-search__actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .6rem; }

.rsvp-dialog { width: min(760px, calc(100% - 2rem)); max-height: 86vh; padding: clamp(1.2rem, 3vw, 2rem); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--white); color: var(--charcoal); box-shadow: 0 2rem 5rem rgba(21,43,32,.28); }
.rsvp-dialog::backdrop { background: rgba(14,26,19,.62); backdrop-filter: blur(3px); }
.rsvp-dialog__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: .5rem; }
.rsvp-dialog__head h2 { margin: .1rem 0; font-size: var(--step-2); }
.rsvp-dialog__meta { margin: 0; color: var(--gray); font-size: .88rem; }
.rsvp-dialog__summary { margin: .35rem 0 1rem; padding: .6rem .85rem; border-left: 4px solid var(--gold); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: #f7f2e4; font-weight: 750; font-size: .9rem; }
.rsvp-dialog__body { max-height: 56vh; overflow: auto; }
.rsvp-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.rsvp-table th { position: sticky; top: 0; padding: .6rem .5rem; border-bottom: 2px solid var(--line); background: var(--white); text-align: left; font-size: .74rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--gray); }
.rsvp-table td { padding: .65rem .5rem; border-bottom: 1px solid var(--line); vertical-align: top; overflow-wrap: anywhere; }
.rsvp-table tr[data-status="cancelled"] td { color: var(--gray); text-decoration: line-through; }
.rsvp-table tr[data-status="waitlisted"] td:nth-child(3) { color: #8a6215; font-weight: 750; }
@media (max-width: 60rem) { .admin-search--rich { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 38rem) { .admin-search--rich { grid-template-columns: 1fr; } .rsvp-table { font-size: .84rem; } }

/* ===== 2026.11 — streamlined staff workspace + dashboard charts =====
   Chart colours are the validated Oasis data-viz palette:
   light  green #0f7a4d / gold #b8860b  (all six checks pass on #fffdf8)
   dark   green #229162 / gold #bb8c2c  (all pass on #1c2720; CVD warn is
   covered by direct labels + the table view every chart ships with). */
.admin-page {
  --viz-surface: #fffdf8;
  --viz-series:  #0f7a4d;
  --viz-accent:  #b8860b;
  --viz-axis:    rgba(23,32,25,.18);
  --viz-ink:     #2c352d;
  --viz-muted:   #6b7369;
}

/* --- Section nav becomes a real tab bar --- */
.admin-section-nav { gap: .3rem; padding: .5rem; border-radius: 999px; }
.admin-section-nav a { position: relative; border-radius: 999px; color: #46514a; font-weight: 750; transition: background .15s, color .15s; }
.admin-section-nav a:hover { background: rgba(15,122,77,.10); color: var(--forest); }
.admin-section-nav a.is-active { background: var(--forest); color: var(--cream); }
.admin-section-nav a.is-active:hover { background: var(--forest); color: var(--cream); }

/* --- Metric tiles --- */
.admin-metrics { gap: .7rem; }
.admin-metrics div { position: relative; min-height: 5.6rem; padding: 1rem 1.1rem; border-color: rgba(23,32,25,.10); border-radius: 14px; background: linear-gradient(165deg, #fbf7ec, #fffdf8); overflow: hidden; }
.admin-metrics div::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--viz-series); opacity: .55; }
.admin-metrics span { color: var(--viz-muted); letter-spacing: .07em; }
.admin-metrics strong { margin-top: .3rem; font-size: 2.1rem; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }

/* --- Chart cards --- */
.dash-charts { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; margin-top: 1.1rem; }
.chart-card { display: flex; flex-direction: column; margin: 0; padding: 1.1rem 1.2rem 1rem; border: 1px solid rgba(23,32,25,.10); border-radius: 14px; background: var(--viz-surface); }
.chart-card--wide { grid-column: 1 / -1; }
.chart-card figcaption { margin-bottom: .85rem; }
.chart-card h3 { margin: 0; font-family: var(--serif); font-size: 1.15rem; font-weight: 500; color: var(--viz-ink); }
.chart-card figcaption p { margin: .15rem 0 0; color: var(--viz-muted); font-size: .82rem; }
.chart-slot { min-height: 8.5rem; }
.chart-slot--rows { min-height: 0; }
.chart-svg { display: block; width: 100%; height: auto; overflow: visible; }

/* Marks: thin, rounded data-ends, recessive axis, quiet labels */
.chart-axis { stroke: var(--viz-axis); stroke-width: 1; }
.chart-bar { fill: var(--viz-series); }
.chart-bar.is-zero { fill: var(--viz-axis); }
.chart-bar:hover { fill: var(--viz-accent); }
.chart-area { fill: var(--viz-series); opacity: .13; }
.chart-line { fill: none; stroke: var(--viz-series); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.chart-dot { fill: var(--viz-series); stroke: var(--viz-surface); stroke-width: 2; }
.chart-hit { fill: transparent; }
.chart-hit:hover { fill: rgba(15,122,77,.07); }
.chart-value { fill: var(--viz-ink); font-size: 12px; font-weight: 800; text-anchor: middle; font-variant-numeric: tabular-nums; }
.chart-tick { fill: var(--viz-muted); font-size: 11px; font-weight: 650; text-anchor: middle; }
.chart-empty { margin: 0; padding: 1.5rem 1rem; border: 1px dashed rgba(23,32,25,.18); border-radius: 10px; color: var(--viz-muted); font-size: .86rem; line-height: 1.55; text-align: center; }
.chart-footnote { margin: .7rem 0 0; color: var(--viz-muted); font-size: .78rem; }

/* Row chart (age groups) */
.row-chart { display: grid; gap: .5rem; }
.row-chart__row { display: grid; grid-template-columns: 5.5rem minmax(0,1fr) 2.2rem; align-items: center; gap: .7rem; }
.row-chart__label { color: var(--viz-ink); font-size: .84rem; font-weight: 700; }
.row-chart__track { height: 14px; border-radius: 999px; background: rgba(23,32,25,.07); overflow: hidden; }
.row-chart__fill { height: 100%; border-radius: 999px; background: var(--viz-series); }
.row-chart__value { color: var(--viz-ink); font-size: .86rem; font-variant-numeric: tabular-nums; text-align: right; }

/* Table view — the accessible equivalent every chart ships with */
.chart-table { margin-top: .8rem; }
.chart-table > summary { min-height: 34px; display: flex; align-items: center; color: var(--viz-muted); font-size: .78rem; font-weight: 750; cursor: pointer; }
.chart-table > summary:hover { color: var(--forest); }
.mini-table { width: 100%; margin-top: .5rem; border-collapse: collapse; font-size: .8rem; }
.mini-table th { padding: .35rem .4rem; border-bottom: 1px solid rgba(23,32,25,.14); text-align: left; color: var(--viz-muted); font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.mini-table td { padding: .35rem .4rem; border-bottom: 1px solid rgba(23,32,25,.07); font-variant-numeric: tabular-nums; }

/* --- Dark mode: its own steps, validated against the dark surface --- */
body.dark-mode .admin-page,
.admin-page.dark-mode,
body.dark-mode {
  --viz-surface: #1c2720;
  --viz-series:  #229162;
  --viz-accent:  #bb8c2c;
  --viz-axis:    rgba(248,244,234,.20);
  --viz-ink:     #f0ede4;
  --viz-muted:   #a8b3a6;
}
body.dark-mode .admin-metrics div { background: linear-gradient(165deg, #1f2b23, #18211b); border-color: rgba(248,244,234,.12); }
body.dark-mode .chart-card { border-color: rgba(248,244,234,.14); background: var(--viz-surface); }
body.dark-mode .row-chart__track { background: rgba(248,244,234,.10); }
body.dark-mode .admin-section-nav a { color: #cfd8ce; }
body.dark-mode .admin-section-nav a:hover { background: rgba(34,145,98,.20); color: #eaf3ec; }

@media (max-width: 60rem) { .dash-charts { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .admin-section-nav a { transition: none; } }

/* Any class that sets an explicit `display` (e.g. .admin-grid { display: grid })
   silently beats the browser's `[hidden] { display: none }`, so toggling the
   hidden attribute stops working. This guarantees hidden always means hidden. */
[hidden] { display: none !important; }

/* 2026 task-first staff workspace */
.admin-page {
  background:
    radial-gradient(circle at 100% 0, rgba(190, 143, 52, .10), transparent 28rem),
    #f5f1e8;
}
.admin-header__actions,
.staff-identity {
  display: flex;
  align-items: center;
  gap: .75rem;
}
.staff-identity {
  min-height: 2.35rem;
  padding: .45rem .8rem;
  border-radius: 999px;
  background: rgba(17, 59, 43, .08);
  color: #173b2d;
  font-size: .82rem;
  font-weight: 750;
}
.admin-intro {
  max-width: 58rem;
  padding-block: clamp(1.5rem, 4vw, 3.5rem) 1.25rem;
}
.admin-intro h1 { max-width: 15ch; font-size: clamp(2.4rem, 6vw, 4.75rem); line-height: .98; }
.admin-login--account {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(23, 59, 45, .13);
  border-radius: 1rem;
  background: #fbfaf6;
}
.admin-login--account p { margin: .35rem 0 0; }
.admin-section-nav {
  position: sticky;
  top: .65rem;
  z-index: 20;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .35rem;
  padding: .4rem;
  border: 1px solid rgba(23, 59, 45, .12);
  border-radius: 1rem;
  background: rgba(250, 248, 242, .92);
  box-shadow: 0 12px 32px rgba(27, 44, 35, .08);
  backdrop-filter: blur(16px);
}
.admin-section-nav a {
  justify-content: center;
  min-height: 2.8rem;
  padding: .65rem .55rem;
  border-radius: .7rem;
  text-align: center;
  white-space: nowrap;
}
.admin-section-nav a.is-active {
  background: #153c2e;
  color: #fff;
}
.admin-card {
  border-color: rgba(23, 59, 45, .12);
  box-shadow: 0 12px 34px rgba(23, 44, 34, .06);
}

@media (max-width: 62rem) {
  .admin-section-nav {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    overflow-x: auto;
    justify-content: start;
  }
}
@media (max-width: 42rem) {
  .admin-header__actions .staff-identity { display: none; }
  .admin-login--account { grid-template-columns: 1fr; }
}