/* One shared calendar: paired months on desktop, a single month on mobile. */
.agenda { --section-anchor-top: 96px; background: var(--paper); scroll-margin-top: calc(var(--section-anchor-top) - var(--section-space)); }
.election-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; max-width: 72rem; margin-inline: auto; }
.election-toolbar { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.election-months { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.25rem, 3vw, 2rem); }
.election-month { min-width: 0; padding: clamp(0.65rem, 2vw, 1.5rem); border: 2px solid var(--ink); border-top: 8px solid var(--red); background: var(--white); box-shadow: 5px 5px 0 var(--ink); }
.election-month-nav { display: flex; flex-shrink: 0; align-items: center; gap: 0.5rem; }
.election-month-title { margin: 0 0 1.25rem; text-align: center; font-size: clamp(1.25rem, 2vw, 1.65rem); letter-spacing: -0.035em; }
.election-month-nav button { width: 44px; min-height: 44px; padding: 0; background: var(--white); color: var(--ink); border: 2px solid var(--ink); font-size: 1.4rem; }
.election-month-nav button:disabled { opacity: 0.28; cursor: default; }
.election-month-nav button:not(:disabled):hover { background: var(--yellow); }
.election-month-grid { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 3px; }
.election-month-grid th { padding-bottom: 0.5rem; color: #655d59; font-size: 0.875rem; font-weight: 650; }
.election-month-grid abbr { text-decoration: none; }
.election-month-grid td { padding: 0; text-align: center; }
.election-day { display: grid; place-items: center; width: 100%; min-height: 44px; padding: 0.25rem 0; border: 1px solid transparent; font-size: 1rem; line-height: 1; font-weight: 550; color: #69615c; background: transparent; border-radius: 4px; }
.election-day.has-event { color: var(--red-dark); background: #fff0ed; font-weight: 850; border-bottom: 3px solid var(--red); }
.election-day.has-event:hover { background: #ffe0d8; }
.election-day.has-event[aria-pressed="true"] { color: var(--white); background: var(--red-dark); border-color: var(--red-dark); box-shadow: 2px 2px 0 var(--ink); }
.election-day.is-today { outline: 1px dashed var(--ink); outline-offset: -3px; }
.election-day:focus-visible { position: relative; z-index: 1; outline: 3px solid var(--blue); outline-offset: 1px; }
.election-legend { margin: 0; font-size: 0.875rem; line-height: 1.5; }
.election-detail { display: grid; grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.8fr); gap: 2rem; min-width: 0; padding: clamp(1.25rem, 3vw, 2rem); border-left: 4px solid var(--red); background-color: #fffdf7; background-image: linear-gradient(rgba(23,19,20,.04) 1px, transparent 1px), linear-gradient(90deg,rgba(23,19,20,.04) 1px,transparent 1px); background-size: 28px 28px; }
.election-detail-heading, .election-detail-items { min-width: 0; overflow-wrap: anywhere; }
.election-detail-kicker { margin: 0 0 0.75rem; font-size: 0.875rem; font-weight: 800; letter-spacing: 0.08em; }
.election-detail-date { display: block; color: var(--red-dark); font-size: clamp(1.5rem, 2.6vw, 2.5rem); line-height: 1.15; letter-spacing: -0.04em; font-weight: 850; }
.election-detail-event + .election-detail-event { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.election-next-label { display: inline-block; padding: 0.2rem 0.5rem; background: var(--yellow); font-size: 0.875rem; font-weight: 750; }
.election-detail h3 { margin: 0.75rem 0 0; font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1.25; letter-spacing: -0.025em; }
.election-detail-range { font-size: 0.9rem; margin: 0.75rem 0 0; }
.election-all { max-width: 72rem; margin: 2rem auto 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.election-all > summary { min-height: 48px; padding: 1rem 0; font-size: 0.95rem; font-weight: 750; cursor: pointer; }
.election-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; list-style: none; padding: 0 0 1rem; margin: 0; }
.election-step { min-width: 0; padding: 1rem; background: var(--white); border: 1px solid var(--line); }
.election-date { margin: 0 0 0.5rem; color: var(--red-dark); font-size: 1rem; font-weight: 850; }
.election-step h3 { margin: 0 0 0.5rem; font-size: 0.95rem; line-height: 1.4; font-weight: 650; }
.election-state { font-size: 0.875rem; color: #625b57; }
.election-step.is-next, .election-step.is-current { background: #fff0b9; border-color: var(--ink); }
.calendar-footer { max-width: 72rem; margin: 1.5rem auto 0; }
.program-status { padding: 1rem; border: 1px solid var(--line); font-size: 1rem; }
.program-status p { margin: 0; }
.program-status button { margin-top: 0.75rem; }
@media (max-width: 899px) {
  .election-layout, .election-all, .calendar-footer { max-width: 36rem; }
  .election-months { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .election-month { padding: 0.65rem; }
  .election-month-title { margin-bottom: 0.75rem; }
  .election-detail { grid-template-columns: minmax(0, 1fr); gap: 1rem; padding: 1.1rem; scroll-margin-top: 112px; scroll-margin-bottom: 88px; }
  .election-detail-date { font-size: 1.5rem; }
  .election-detail h3 { font-size: 1.2rem; }
  .election-steps { grid-template-columns: 1fr; }
}
@media (max-width: 540px) { .agenda { --section-anchor-top: 112px; } }
.election-day.has-program { box-shadow:inset 0 -4px 0 var(--blue); }
.election-day.has-program[aria-pressed="true"] { box-shadow:inset 0 -4px 0 #98b4ff,2px 2px 0 var(--ink); }
.election-detail-event.is-program { border-left:3px solid var(--blue); padding-left:1rem; }
.program-detail-time,.program-detail-location { font-size:1rem; font-weight:700; line-height:1.5; }
.program-detail-description { font-size:1rem; line-height:1.6; white-space:pre-line; overflow-wrap:anywhere; }
.program-calendar-legend { display:flex; flex-wrap:wrap; gap:1rem; margin:0; font-size:.875rem; }
.program-calendar-legend span { border-bottom:3px solid var(--red); padding-bottom:.2rem; }
.program-calendar-legend span:last-child { border-color:var(--blue); }
