:root { --events-sidebar-width: clamp(240px, 19.35vw, 340px); --events-bars-height: calc(var(--title-bar-height) + var(--section-nav-height)); }
:where(.events-page, .events-page *) { box-sizing: border-box; }
:where(.events-page) h1, :where(.events-page) h2, :where(.events-page) h3, :where(.events-page) p { margin: 0; }
body.events-page { margin: 0; padding-top: var(--events-bars-height); background: var(--hour-background); color: #080808; font: 400 19px/1.45 var(--reference-serif); transition: background-color 120s linear; }
.events-page a { color: inherit; text-decoration: none; }
.events-page button, .events-page input, .events-page select { font: inherit; }
.events-page button { cursor: pointer; }
.events-page [hidden] { display: none !important; }
.events-page img { display: block; max-width: 100%; }
.events-page .section-navigation { transform: none; background: #fff; color: #000; }
.events-page .section-navigation a[aria-current="page"] span { border-bottom-color: var(--day-accent); }
.events-page a:focus-visible, .events-page button:focus-visible, .events-page input:focus-visible, .events-page select:focus-visible { outline: 2px solid var(--day-accent); outline-offset: 3px; }
.events-canvas { position: relative; min-height: calc(100svh - var(--events-bars-height)); background: var(--hour-background); transition: margin-left .32s ease, background-color 120s linear; }
.events-page.is-search-mode .events-canvas { margin-left: var(--events-sidebar-width); }
.events-page.is-restoring-event-position .events-canvas { transition: background-color 120s linear; overflow-anchor: none; }
.events-page .score-overlay { top: 0; right: 3.8%; bottom: 0; width: 15.2%; z-index: 1; }
.events-page .home-footer, .events-page .footer-red-bar { position: relative; z-index: 2; }
.events-page .home-footer { font-size: clamp(13px, 1.9vw, 14px); }
.events-page .home-footer p { margin-bottom: .6em; }
.events-feature { position: relative; display: block; width: 100%; height: clamp(420px, 52.5vw, 960px); overflow: hidden; background: #000; color: #fff !important; }
.events-feature > img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.events-feature-copy { position: absolute; z-index: 2; left: 5.5%; right: 5%; bottom: 5%; font-size: clamp(24px, 3.1vw, 40px); line-height: 1.42; text-shadow: 0 2px 12px #000; }
.events-feature:hover .feature-title, .events-feature:focus-visible .feature-title { text-decoration: underline; text-underline-offset: 5px; }
.normal-event-list { position: relative; z-index: 2; }
.archive-card { display: grid; grid-template-columns: 40% minmax(0, 1fr); min-height: clamp(260px, 26.8vw, 460px); background: var(--hour-background); border: 0; transition: background-color 120s linear; }
.archive-image { position: relative; display: block; min-width: 0; overflow: hidden; background: #000; }
.archive-image img { position: absolute; width: 100%; height: 100%; object-fit: cover; }
.archive-copy { min-width: 0; display: flex; flex-direction: column; padding: clamp(16px, 1.7vw, 30px); font-size: clamp(16px, 1.9vw, 22px); }
.archive-copy .event-date { display: block; line-height: 1.4; }
.archive-paragraphs { flex: 1; }
.archive-paragraphs p { margin-bottom: .5em; }
.archive-paragraphs p + p { margin-top: .75em; }
.normal-event-list .archive-paragraphs p + p { margin-top: 1.5em; }
.archive-bottom { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.archive-label { font: inherit; }
.archive-detail { align-self: flex-end; font-size: clamp(25px, 2.6vw, 36px); font-weight: 700; line-height: 1.08; white-space: nowrap; }
.archive-detail:hover, .archive-detail:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.search-folded { position: fixed; z-index: 902; top: var(--events-bars-height); left: 0; padding: 2px 9px 5px; border: 0; border-radius: 0; color: #fff; background: #000; font-size: 20px !important; line-height: 1.2; }
.search-folded:hover, .search-folded:focus-visible { background: #fff; color: #000; }
.event-filter-panel { position: fixed; z-index: 900; top: var(--events-bars-height); left: 0; width: var(--events-sidebar-width); height: calc(100dvh - var(--events-bars-height)); background: linear-gradient(180deg, #000 0%, #000 38%, #666 78%, #fff 100%); color: #fff; transform: translateX(-100%); visibility: hidden; transition: transform .32s ease, visibility .32s; }
.is-filter-open .event-filter-panel { transform: translateX(0); visibility: visible; }
.event-filter-form { height: 100%; overflow-y: auto; padding: 12px 28px 24px 12px; scrollbar-width: thin; scrollbar-color: #777 transparent; }
.keyword-field { display: flex; width: 100%; border: 1px solid #aaa; background: #fff; }
.keyword-field input { min-width: 0; width: 100%; padding: 3px 6px; border: 0; border-radius: 0; background: #fff; color: #000; font-size: 17px; }
.keyword-field input::placeholder { color: #777; opacity: 1; font-style: italic; }
.keyword-submit { flex: 0 0 30px; display: grid; place-items: center; padding: 3px; border: 0; border-radius: 0; background: #777; color: #fff; }
.keyword-submit:hover { background: #aaa; }
.keyword-submit svg { width: 22px; height: 22px; }
.filter-label { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; }
.filter-label h2 { font-size: 19px; font-weight: 400; }
.all-years { border: 0; padding: 2px; color: #aaa; background: none; font-size: 12px !important; }
.all-years:hover { color: #fff; text-decoration: underline; }
.year-wheel { display: flex; flex-direction: column; align-items: stretch; gap: 3px; margin: 4px 0 24px; }
.year-neighbour { padding: 1px 0; border: 0; background: none; color: #888; font-size: 18px !important; }
.year-neighbour:hover { color: #ddd; }
.year-neighbour:disabled { visibility: hidden; pointer-events: none; }
.year-current { position: relative; width: 100%; border: 0; padding: 0 8px; color: #fff; background: linear-gradient(90deg, transparent, #262626 17%, #262626 83%, transparent); font-size: 28px !important; font-weight: 700 !important; line-height: 1.28; }
.year-current span { display: inline-block; transform: scaleX(1.07); }
.year-entry { display: block; width: 68%; margin-inline: auto; padding: 0; border: 0; border-bottom: 1px solid #fff; border-radius: 0; background: transparent; color: #fff; font-size: 27px !important; font-weight: 700 !important; text-align: center; }
.season-choices { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 14px; }
.season-choices button { border: 1px solid #555; border-right: 0; border-radius: 0; background: rgba(0,0,0,.25); color: #888; padding: 2px 0; font-size: clamp(13px, 1.4vw, 18px); line-height: 1.2; }
.season-choices button:last-child { border-right: 1px solid #555; }
.season-choices button[aria-pressed="true"] { position: relative; z-index: 1; border: 1px solid #fff; margin-right: -1px; color: #fff; }
.month-choices { display: grid; grid-template-columns: auto minmax(0,1fr) auto minmax(0,1fr); align-items: stretch; gap: 1px; }
.month-choices label { padding: 3px 5px; background: #202020; font-size: 17px; }
.month-choices select { width: 100%; min-width: 0; padding: 2px; border: 0; border-radius: 0; color: #fff; background: #202020; font-size: 14px; color-scheme: dark; cursor: pointer; }
.filter-submit { display: block; margin-top: 12px; padding: 2px 0; width: 100%; border: 0; background: none; color: #fff; font-size: clamp(21px, 2.3vw, 28px) !important; font-weight: 700 !important; }
.filter-submit:hover, .filter-submit:focus-visible { text-decoration: underline; text-underline-offset: 5px; }
.filter-submit:disabled { opacity: .65; cursor: progress; }
.filter-error { margin-top: 12px !important; padding: 7px; background: #111; color: #fff; font-size: 14px; border: 1px solid #ccc; }
.filter-collapse { position: absolute; inset: 0 0 0 auto; width: 22px; padding: 0; border: 0; background: transparent; color: #bbb; }
.filter-collapse::before { content: ''; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); border-top: 12px solid transparent; border-bottom: 12px solid transparent; border-right: 9px solid currentColor; }
.filter-collapse:hover, .filter-collapse:focus-visible { color: #fff; background: rgba(255,255,255,.08); }
.event-results { padding: 0 2.3vw 5vw; min-height: 66vh; }
.results-topline { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 10px 20px; position: relative; z-index: 2; padding: 7px 0 5px; border-bottom: 2px solid #888; }
.results-heading { font-size: clamp(22px, 2vw, 28px); font-weight: 700; line-height: 1.25; }
.results-heading strong { font-size: 1.35em; padding-inline: .4em .2em; }
.result-order { display: flex; align-items: center; gap: 10px; font-size: 17px; cursor: pointer; }
.result-order input { width: 17px; height: 17px; accent-color: #111; margin: 0; }
.event-month-group { position: relative; z-index: 2; margin-block: 14px 36px; }
.event-month-group > h3 { font-size: clamp(23px, 2vw, 28px); line-height: 1.15; margin-bottom: 5px; }
.event-month-group .archive-card { min-height: clamp(240px, 19.5vw, 360px); margin-bottom: 18px; }
.results-empty { position: relative; z-index: 2; padding: 36px 0 60px; font-size: 21px; }
.events-noscript { padding: 15px; background: #fff; }
@media (max-width: 1050px) and (min-width: 801px) {
  .archive-copy { font-size: 17px; }
  .archive-paragraphs p + p { margin-top: .5em; }
  .archive-detail { font-size: 25px; }
  .month-choices { grid-template-columns: auto minmax(0,1fr); }
}
@media (max-width: 800px) {
  :root { --events-sidebar-width: 100%; --events-mobile-panel-height: min(52dvh, 370px); }
  .event-filter-panel { height: var(--events-mobile-panel-height); }
  .event-filter-form { max-width: 440px; margin-inline: auto; padding-right: 30px; }
  .events-canvas { transition: padding-top .25s ease, background-color 120s linear; }
  .events-page.is-search-mode .events-canvas { margin-left: 0; }
  .events-page.is-filter-open .events-canvas { padding-top: var(--events-mobile-panel-height); }
  .events-feature { height: clamp(410px, 75vw, 620px); }
  .events-feature > img { object-position: 58% center; }
  .events-feature-copy { font-size: clamp(23px, 4.2vw, 32px); line-height: 1.4; bottom: 5%; }
  .archive-card { min-height: 0; }
  .archive-copy { font-size: 16px; padding: 15px; }
  .archive-paragraphs p + p { margin-top: .75em; }
  .archive-detail { font-size: 25px; }
  .event-results { padding-inline: 4%; }
  .results-heading { font-size: 22px; }
  .result-order { font-size: 15px; }
  .event-month-group .archive-card { min-height: 260px; }
  .event-month-group > h3 { font-size: 24px; }
}
@media (max-width: 520px) {
  .archive-card { grid-template-columns: 1fr; }
  .archive-image { aspect-ratio: 1.77; }
  .archive-copy { min-height: 250px; }
  .events-feature-copy { font-size: 23px; }
  .results-heading strong { padding-inline: .2em; }
  .results-topline { padding-block: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .events-canvas, .event-filter-panel, body.events-page { transition: none; }
}