/* VideoVault: explore module (the explore page at /videos/ and /events/; loaded only when it renders).
   Structure only: fonts and colours are the theme's (--vv-font-*, --vv-ink, --vv-strong). The module and
   its results column are size containers (R33), so the layout follows the space it is given, not the window:
   sidebar from 860px, full event rows from 800px of results column, compact rows from 560px, stacked below. */
.vvault-front .vvault-xp{container:vv/inline-size;min-width:0}
.vvault-front .vvault-module.vvault-xp{padding:0;border:0;border-radius:0;background:transparent}
.vvault-front .vvault-xp__form{display:flex;flex-direction:column;gap:var(--vv-s6);margin:0}
.vvault-front .vvault-xp__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

/* ---- Header: title and line, search ---- */
.vvault-front .vvault-xp__head{display:grid;gap:var(--vv-s4);align-items:end}
.vvault-front .vvault-xp__title{margin:0;font-family:var(--vv-font-display);font-weight:var(--vv-title-weight);font-size:clamp(2rem,1.3rem + 2.6cqi,3.25rem);line-height:1.08;letter-spacing:-.015em}
.vvault-front .vvault-xp__intro{margin:var(--vv-s2) 0 0;font-size:clamp(1.0625rem,1rem + .4cqi,1.3125rem);line-height:1.45;color:var(--vv-muted)}
.vvault-front .vvault-xp__search{position:relative;display:flex;align-items:center;min-width:0}
.vvault-front .vvault-xp__search input{width:100%;min-height:3rem;margin:0;padding:0 var(--vv-s4) 0 3rem;border:1px solid var(--vv-card-line);border-radius:var(--vv-radius-sm);background:var(--vv-paper);color:inherit;font-family:var(--vv-font-ui);font-size:1rem}
.vvault-front .vvault-xp__search input:focus-visible{outline:3px solid var(--vv-ring,var(--vv-ink));outline-offset:1px}
.vvault-front .vvault-xp__searchbtn{position:absolute;left:var(--vv-s1);top:50%;translate:0 -50%;display:inline-grid;place-items:center;width:2.5rem;height:2.5rem;margin:0;padding:0;border:0;border-radius:var(--vv-radius-sm);background:transparent;color:inherit;cursor:pointer}
.vvault-front .vvault-xp__searchbtn:is(:hover,:focus-visible){background:var(--vv-soft);color:inherit}
.vvault-front .vvault-xp__searchbtn svg{width:1.375rem;height:1.375rem}
@container vv (min-width:860px){
	.vvault-front .vvault-xp__head{grid-template-columns:minmax(0,1fr) minmax(16rem,28rem);gap:var(--vv-s6)}
	.vvault-front .vvault-xp__search{margin-bottom:var(--vv-s5)}
}

/* ---- Body: filters beside (wide) or behind a button (narrow), then the results ---- */
.vvault-front .vvault-xp__body{display:grid;gap:var(--vv-s5);min-width:0}
.vvault-front .vvault-xp__main{container:vv/inline-size;min-width:0}
.vvault-front .vvault-xp__filters>summary{list-style:none}
.vvault-front .vvault-xp__filters>summary::-webkit-details-marker{display:none}
.vvault-front .vvault-xp__sheetbtn{display:inline-flex;align-items:center;gap:var(--vv-s2);min-height:var(--vv-control-h);padding:0 var(--vv-s4);border:1px solid var(--vv-edge);border-radius:var(--vv-radius-sm);background:var(--vv-paper);color:inherit;font-family:var(--vv-font-ui);font-size:1rem;font-weight:500;cursor:pointer}
.vvault-front .vvault-xp__sheetbtn:is(:hover,:focus-visible){background:var(--vv-soft);color:inherit}
.vvault-front .vvault-xp__sheetbtn svg{width:1.25rem;height:1.25rem}
.vvault-front .vvault-xp__badge{display:inline-grid;place-items:center;min-width:1.5rem;height:1.5rem;padding:0 var(--vv-s1);border-radius:var(--vv-radius-pill);background:var(--vv-strong);color:var(--vv-on-strong);font-size:.875rem;line-height:1}
.vvault-front .vvault-xp__panel{display:grid;gap:var(--vv-s4);margin-top:var(--vv-s3);padding:var(--vv-s4);border:1px solid var(--vv-card-line);border-radius:var(--vv-radius-sm);background:var(--vv-paper)}
.vvault-front .vvault-xp__panelhead{display:flex;align-items:center;justify-content:space-between;gap:var(--vv-s3)}
.vvault-front .vvault-xp__panelh{margin:0;font-family:var(--vv-font-display);font-size:1.3125rem;font-weight:600;line-height:1.2}
.vvault-front .vvault-xp__close{display:inline-grid;place-items:center;width:2.75rem;height:2.75rem;padding:0;border:0;border-radius:var(--vv-radius-sm);background:transparent;color:inherit;cursor:pointer}
.vvault-front .vvault-xp__close[hidden],.vvault-front .vvault-xp__filters:not([data-sheet]) .vvault-xp__close{display:none}
.vvault-front .vvault-xp__close:is(:hover,:focus-visible){background:var(--vv-soft);color:inherit}
.vvault-front .vvault-xp__close svg{width:1.375rem;height:1.375rem}
.vvault-front .vvault-xp__field{display:grid;gap:var(--vv-s2)}
.vvault-front .vvault-xp__field>label{font-family:var(--vv-font-display);font-size:1.0625rem;font-weight:600;line-height:1.3}
.vvault-front .vvault-xp__field .vvault-select{display:flex}
.vvault-front .vvault-xp .vvault-select select{min-height:var(--vv-control-h);font-size:1rem}
.vvault-front .vvault-xp__apply{width:100%}
/* With the script, drop-downs send the form themselves: the Apply and Sort buttons are only for no-JavaScript visitors. */
.vvault-front .vvault-xp--js .vvault-xp__sortgo,.vvault-front .vvault-xp--js .vvault-xp__filters:not([data-sheet]) .vvault-xp__apply{display:none}
/* Narrow, with the script: the panel is a sheet over the page. */
/* The button stays in place (no jump) but hides under the sheet; the sheet's shadow dims the page behind it. */
.vvault-front .vvault-xp__filters[data-sheet][open]>summary{visibility:hidden}
.vvault-front .vvault-xp__filters[data-sheet]>.vvault-xp__panel{position:fixed;left:0;right:0;bottom:0;z-index:99999;max-height:88vh;margin:0;padding:var(--vv-s4);overflow:auto;border:0;border-radius:var(--vv-radius) var(--vv-radius) 0 0;box-shadow:0 0 0 100vmax rgb(0 0 0 / .45);color:var(--vv-ink)}
html.vvault-xp-locked{overflow:hidden}
@container vv (min-width:860px){
	.vvault-front .vvault-xp__body{grid-template-columns:16.5rem minmax(0,1fr);gap:var(--vv-s6);align-items:start}
	.vvault-front .vvault-xp__filters>summary{display:none}
	.vvault-front .vvault-xp__panel{margin:0;padding:var(--vv-s5)}
}

/* ---- Chips, sort, count and the view switch ---- */
.vvault-front .vvault-xp__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--vv-s3) var(--vv-s5)}
.vvault-front .vvault-xp__chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--vv-s2) var(--vv-s4);min-width:0}
.vvault-front .vvault-xp__chiplist{display:flex;flex-wrap:wrap;gap:var(--vv-s2);margin:0;padding:0;list-style:none}
.vvault-front .vvault-xp__chiplist li{margin:0}
.vvault-front .vvault-xp__chip{display:inline-flex;align-items:center;gap:var(--vv-s3);min-height:var(--vv-control-h);padding:0 var(--vv-s4);border-radius:var(--vv-radius-sm);background:color-mix(in srgb,var(--vv-strong) 10%,var(--vv-paper));color:inherit;font-family:var(--vv-font-ui);font-size:1rem;text-decoration:none}
.vvault-front .vvault-xp__chip:is(:hover,:focus-visible){background:color-mix(in srgb,var(--vv-strong) 18%,var(--vv-paper));color:inherit;text-decoration:underline}
.vvault-front .vvault-xp__clear{font-family:var(--vv-font-ui);font-size:1rem;text-decoration:underline;text-underline-offset:.2em}
.vvault-front .vvault-xp__sort{display:flex;align-items:center;gap:var(--vv-s3);margin-left:auto}
.vvault-front .vvault-xp__sort label{font-family:var(--vv-font-ui);font-size:1rem;white-space:nowrap}
.vvault-front .vvault-xp__sort .vvault-select{min-width:12rem}
.vvault-front .vvault-xp__sortgo{min-height:var(--vv-control-h);padding:0 var(--vv-s4)}
.vvault-front .vvault-xp__toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--vv-s3) var(--vv-s4);margin-top:var(--vv-s5);padding-bottom:var(--vv-s4);border-bottom:1px solid var(--vv-card-line)}
.vvault-front .vvault-xp__count{margin:0;font-family:var(--vv-font-display);font-weight:var(--vv-title-weight);font-size:clamp(1.375rem,1.1rem + 1.2cqi,1.875rem);line-height:1.2}
.vvault-front .vvault-xp__views{display:inline-flex;flex-wrap:wrap;border:1px solid var(--vv-card-line);border-radius:var(--vv-radius-sm);overflow:hidden}
.vvault-front .vvault-xp__view{display:inline-flex;align-items:center;min-height:var(--vv-control-h);padding:0 var(--vv-s4);background:var(--vv-paper);color:inherit;font-family:var(--vv-font-ui);font-size:1rem;text-decoration:none;white-space:nowrap}
.vvault-front .vvault-xp__view+.vvault-xp__view{border-left:1px solid var(--vv-card-line)}
.vvault-front .vvault-xp__view:is(:hover,:focus-visible){background:var(--vv-soft);color:inherit;text-decoration:underline}
.vvault-front .vvault-xp__view[aria-current]{background:var(--vv-strong);color:var(--vv-on-strong);font-weight:500}
.vvault-front .vvault-xp__view[aria-current]:is(:hover,:focus-visible){background:color-mix(in srgb,var(--vv-strong) 86%,var(--vv-on-strong));color:var(--vv-on-strong)}
.vvault-front .vvault-xp__view:focus-visible{outline-offset:-3px}
.vvault-front .vvault-xp__arrow{margin-left:var(--vv-s2)}
.vvault-front .vvault-xp__x{opacity:1}
.vvault-front .vvault-xp__empty{padding:var(--vv-s6) 0}
.vvault-front .vvault-xp__empty h3{margin:0 0 var(--vv-s2);font-family:var(--vv-font-display);font-size:1.375rem}
.vvault-front .vvault-xp__empty p{margin:0 0 var(--vv-s2)}
.vvault-front .vvault-xp__empty a{text-decoration:underline}
@container vv (max-width:559px){
	.vvault-front .vvault-xp__sort{margin-left:0;width:100%}
	.vvault-front .vvault-xp__sort .vvault-select{flex:1 1 auto;min-width:0}
	.vvault-front .vvault-xp__views{width:100%}
	.vvault-front .vvault-xp__view{flex:1 1 0;justify-content:center;padding:0 var(--vv-s2)}
}

/* ---- By event: one row per event ---- */
.vvault-front .vvault-xp-events{margin:0;padding:0;list-style:none}
.vvault-front .vvault-xp-event{display:grid;gap:var(--vv-s4);margin:0;padding:var(--vv-s5) 0;border-bottom:1px solid var(--vv-card-line)}
.vvault-front .vvault-xp-event__media{min-width:0}
.vvault-front .vvault-xp-event__media>a{display:block;color:inherit;text-decoration:none}
.vvault-front .vvault-xp-event__frame{aspect-ratio:3/2}
.vvault-front .vvault-xp-event__media .vvault-credit{margin:var(--vv-s1) 0 0;font-family:var(--vv-font-ui);font-size:.875rem;line-height:1.35;color:var(--vv-muted)}
.vvault-front .vvault-xp-event__body{display:flex;flex-direction:column;gap:var(--vv-s3);min-width:0}
.vvault-front .vvault-xp-event__head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--vv-s4)}
.vvault-front .vvault-xp-event__titles{min-width:0}
.vvault-front .vvault-xp-event__date{margin:0 0 var(--vv-s1);font-family:var(--vv-font-ui);font-size:.875rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--vv-muted)}
.vvault-front .vvault-xp-event__name{margin:0;font-family:var(--vv-font-display);font-weight:var(--vv-title-weight);font-size:clamp(1.375rem,1.15rem + .9cqi,1.75rem);line-height:1.15}
.vvault-front .vvault-xp-event__name a{text-decoration:none}
.vvault-front .vvault-xp-event__name a:is(:hover,:focus-visible){text-decoration:underline}
.vvault-front .vvault-xp-event__sub{margin:var(--vv-s1) 0 0;font-size:1.125rem;line-height:1.35}
.vvault-front .vvault-xp-event__open{flex:none;display:inline-flex;align-items:center;min-height:2.75rem;font-family:var(--vv-font-ui);font-size:1rem;font-weight:500;color:var(--vv-strong);text-decoration:underline;text-underline-offset:.2em;white-space:nowrap}
.vvault-front .vvault-xp-event__open:is(:hover,:focus-visible){color:var(--vv-ink)}
.vvault-front .vvault-xp-event__lead{margin:0;max-width:var(--vv-measure,57ch);font-size:1.0625rem;line-height:1.55;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.vvault-front .vvault-xp-event__videos{display:grid;gap:var(--vv-s3);padding-top:var(--vv-s3);border-top:1px solid var(--vv-card-line)}
.vvault-front .vvault-xp-event__count{margin:0;font-family:var(--vv-font-ui);font-size:.9375rem;font-weight:500;color:var(--vv-muted)}
.vvault-front .vvault-xp-event__more{margin:0;font-family:var(--vv-font-ui);font-size:.9375rem}
.vvault-front .vvault-xp-event__more a{text-decoration:underline}
.vvault-front .vvault-xp-vids{display:grid;gap:var(--vv-s3);margin:0;padding:0;list-style:none}
.vvault-front .vvault-xp-vid{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:var(--vv-s1) var(--vv-s4);align-items:start;margin:0}
.vvault-front .vvault-xp-vid__media{grid-row:span 2;display:block;color:inherit}
.vvault-front .vvault-xp-vid__body{min-width:0}
.vvault-front .vvault-xp-vid__title{margin:0;font-family:var(--vv-font-display);font-size:1.0625rem;font-weight:600;line-height:1.3}
.vvault-front .vvault-xp-vid__title a{text-decoration:none}
.vvault-front .vvault-xp-vid__title a:is(:hover,:focus-visible){text-decoration:underline}
.vvault-front .vvault-xp-vid__sum{margin:var(--vv-s1) 0 0;font-size:.9375rem;line-height:1.45;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.vvault-front .vvault-xp-vid__date{grid-column:2;margin:0;font-family:var(--vv-font-ui);font-size:.875rem;line-height:1.35;color:var(--vv-muted)}
.vvault-front .vvault-xp-vid .vvault-th__len{font-size:.875rem}
.vvault-front .vvault-xp-vid .vvault-th__play{width:2rem;height:2rem}
/* Compact row (a results column of 560 to 799px): the picture beside the title and lead, the videos under both. */
@container vv (min-width:560px){
	.vvault-front .vvault-xp-event{grid-template-columns:minmax(0,34%) minmax(0,1fr);gap:var(--vv-s4) var(--vv-s5);grid-template-areas:"media body"}
	.vvault-front .vvault-xp-event__media{grid-area:media}
	.vvault-front .vvault-xp-event__body{grid-area:body}
	.vvault-front .vvault-xp-vid{grid-template-columns:8.5rem minmax(0,1fr)}
}
/* Full row (800px and more): the picture takes 40%, the text and the videos sit beside it. */
@container vv (min-width:800px){
	.vvault-front .vvault-xp-event{grid-template-columns:minmax(0,40%) minmax(0,1fr);gap:var(--vv-s6)}
	.vvault-front .vvault-xp-event__frame{aspect-ratio:4/3}
	.vvault-front .vvault-xp-vid{grid-template-columns:9rem minmax(0,1fr)}
}
/* A wide results column (no sidebar beside it, or a very wide page): the published date gets its own column, as on the board. */
@container vv (min-width:1000px){
	.vvault-front .vvault-xp-vid{grid-template-columns:9rem minmax(0,1fr) 7rem}
	.vvault-front .vvault-xp-vid__media{grid-row:auto}
	.vvault-front .vvault-xp-vid__date{grid-column:3}
	.vvault-front .vvault-xp-vid__date span{display:block}
}
/* The row's frame already shows this video's thumbnail (no tile of its own, so the picture is not shown twice). */
.vvault-front .vvault-xp-vid.vvault-xp-vid--nothumb{grid-template-columns:minmax(0,1fr)}
.vvault-front .vvault-xp-vid--nothumb .vvault-xp-vid__date{grid-column:1}
@container vv (min-width:1000px){
	.vvault-front .vvault-xp-vid.vvault-xp-vid--nothumb{grid-template-columns:minmax(0,1fr) 7rem}
	.vvault-front .vvault-xp-vid--nothumb .vvault-xp-vid__date{grid-column:2}
}

/* ---- Timeline: the events by decade ---- */
.vvault-front .vvault-xp-timeline{display:grid;gap:var(--vv-s6);margin-top:var(--vv-s5)}
.vvault-front .vvault-xp-decade__h{margin:0 0 var(--vv-s4);padding-bottom:var(--vv-s2);border-bottom:1px solid var(--vv-card-line);font-family:var(--vv-font-display);font-weight:var(--vv-title-weight);font-size:1.625rem;line-height:1.15}
.vvault-front .vvault-xp-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,14rem),1fr));gap:var(--vv-s5);margin:0;padding:0;list-style:none}
.vvault-front .vvault-xp-cards>li{margin:0;min-width:0}
.vvault-front .vvault-xp-card{display:flex;flex-direction:column;gap:var(--vv-s3);height:100%;color:inherit;text-decoration:none}
.vvault-front .vvault-xp-card__frame{aspect-ratio:3/2}
.vvault-front .vvault-xp-card__text{display:flex;flex-direction:column;gap:var(--vv-s1)}
.vvault-front .vvault-xp-card__name{font-family:var(--vv-font-display);font-weight:var(--vv-title-weight);font-size:1.25rem;line-height:1.2}
.vvault-front .vvault-xp-card__sub{font-size:1rem;line-height:1.35}
.vvault-front .vvault-xp-card__meta{font-family:var(--vv-font-ui);font-size:.9375rem;color:var(--vv-muted)}
.vvault-front .vvault-xp-card:is(:hover,:focus-visible) .vvault-xp-card__name{text-decoration:underline}

/* ---- Individual videos ---- */
.vvault-front .vvault-xp-videos{margin:0;padding:0;list-style:none}
.vvault-front .vvault-xp-video{display:grid;grid-template-columns:8rem minmax(0,1fr);grid-template-areas:"media body" "facts facts";gap:var(--vv-s3) var(--vv-s4);margin:0;padding:var(--vv-s5) 0;border-bottom:1px solid var(--vv-card-line)}
.vvault-front .vvault-xp-video__media{grid-area:media;display:block;color:inherit}
.vvault-front .vvault-xp-video__body{grid-area:body;display:flex;flex-direction:column;gap:var(--vv-s2);min-width:0}
.vvault-front .vvault-xp-video__title{margin:0;font-family:var(--vv-font-display);font-weight:var(--vv-title-weight);font-size:clamp(1.125rem,1rem + .6cqi,1.375rem);line-height:1.25}
.vvault-front .vvault-xp-video__title a{text-decoration:none}
.vvault-front .vvault-xp-video__title a:is(:hover,:focus-visible){text-decoration:underline}
.vvault-front .vvault-xp-video__meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--vv-s1) 0;margin:0;font-family:var(--vv-font-ui);font-size:.9375rem;color:var(--vv-muted)}
.vvault-front .vvault-xp__sep{display:inline-block;width:1px;height:1em;margin:0 var(--vv-s3);background:var(--vv-card-line)}
.vvault-front .vvault-xp-video__sum{margin:0;font-size:1rem;line-height:1.5;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.vvault-front .vvault-xp-video__event{align-self:flex-start;display:inline-flex;align-items:center;min-height:2rem;font-family:var(--vv-font-ui);font-size:1rem;color:var(--vv-strong);text-decoration:underline;text-underline-offset:.2em}
.vvault-front .vvault-xp-video__event:is(:hover,:focus-visible){color:var(--vv-ink)}
.vvault-front .vvault-xp-video__facts{grid-area:facts;display:flex;flex-wrap:wrap;gap:var(--vv-s2) var(--vv-s5);margin:0;font-family:var(--vv-font-ui)}
.vvault-front .vvault-xp-video__facts div{min-width:0}
.vvault-front .vvault-xp-video__facts dt{font-size:.875rem;color:var(--vv-muted)}
.vvault-front .vvault-xp-video__facts dd{margin:0;font-size:1rem;line-height:1.35}
@container vv (min-width:560px){
	.vvault-front .vvault-xp-video{grid-template-columns:minmax(0,15rem) minmax(0,1fr);grid-template-areas:"media body" "media facts";align-items:start}
}
@container vv (min-width:820px){
	.vvault-front .vvault-xp-video{grid-template-columns:minmax(0,17rem) minmax(0,1fr) minmax(9rem,12rem);grid-template-areas:"media body facts";gap:var(--vv-s5)}
	.vvault-front .vvault-xp-video__facts{flex-direction:column;flex-wrap:nowrap;gap:var(--vv-s3);padding-left:var(--vv-s4);border-left:1px solid var(--vv-card-line)}
}

/* ---- Page links ---- */
.vvault-front .vvault-xp__pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--vv-s3);margin-top:var(--vv-s4);padding-top:var(--vv-s4)}
.vvault-front .vvault-xp-events+.vvault-xp__pager,.vvault-front .vvault-xp-videos+.vvault-xp__pager{margin-top:0}
.vvault-front .vvault-xp__pagelabel{margin:0;font-family:var(--vv-font-ui);font-size:1rem}
.vvault-front .vvault-xp__pages{display:flex;gap:var(--vv-s2);margin:0;padding:0;list-style:none}
.vvault-front .vvault-xp__pages li{margin:0}
.vvault-front .vvault-xp__page{display:inline-grid;place-items:center;min-width:var(--vv-control-h);height:var(--vv-control-h);padding:0 var(--vv-s2);border:1px solid var(--vv-card-line);border-radius:var(--vv-radius-sm);background:var(--vv-paper);color:inherit;font-family:var(--vv-font-ui);font-size:1rem;text-decoration:none}
.vvault-front a.vvault-xp__page:is(:hover,:focus-visible){background:var(--vv-soft);color:inherit}
.vvault-front .vvault-xp__page[aria-current]{border-color:var(--vv-strong);background:var(--vv-strong);color:var(--vv-on-strong);font-weight:500}
.vvault-front .vvault-xp__page[aria-current]:is(:hover,:focus-visible){background:color-mix(in srgb,var(--vv-strong) 86%,var(--vv-on-strong));color:var(--vv-on-strong)}
.vvault-front .vvault-xp__page.is-off{color:var(--vv-muted)}
.vvault-front .vvault-xp__page svg{width:1.125rem;height:1.125rem}
.vvault-front .vvault-xp__flip{rotate:180deg}