/*
Theme Name: Mallard
Theme URI: https://mallardtrapclub.org
Description: Custom block theme for Mallard Trap Club.
Version: 0.7.12
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.1
Text Domain: mallard
*/

/* Tokens live in theme.json (--wp--preset--* and --wp--custom--*). This file carries
   component styling the design export expressed inline. Classes are prefixed mt-. */

/* ---------- Generic ---------- */
a { transition: color var(--wp--custom--motion--fast), background-color var(--wp--custom--motion--fast), border-color var(--wp--custom--motion--fast); }
.mt-lede { font-size: var(--wp--preset--font-size--large); line-height: var(--wp--custom--leading--large); color: var(--wp--preset--color--ink-soft); }
.mt-eyebrow { font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--small); letter-spacing: var(--wp--custom--tracking--eyebrow-lg); text-transform: uppercase; color: var(--wp--preset--color--clay); margin: 0; }
.mt-main { padding-top: var(--wp--preset--spacing--xl); padding-bottom: var(--wp--preset--spacing--xxl); }
.mt-cols { gap: var(--wp--preset--spacing--xl); }
.mt-more { font-size: var(--wp--preset--font-size--small-lg); font-weight: 600; margin-top: var(--wp--preset--spacing--m); }
/* Long content lists need air between items, not just around the block (design ref: interior page). */
.mt-main li + li { margin-top: var(--wp--preset--spacing--xs); }
/* Section rhythm: WP's layout blockGap outranks theme.json's h2/h3 margins here, so restate them. */
.mt-main h2 { margin-top: var(--wp--preset--spacing--xl); margin-bottom: var(--wp--preset--spacing--ml);
  padding-bottom: var(--wp--preset--spacing--s); border-bottom: 2px solid var(--wp--preset--color--navy); }
.mt-main h3 { margin-top: var(--wp--preset--spacing--l); }
.mt-main h2:first-child, .mt-main h3:first-child { margin-top: 0; }

/* ---------- Buttons ---------- */
.wp-block-button__link { transition: background-color var(--wp--custom--motion--fast), color var(--wp--custom--motion--fast), border-color var(--wp--custom--motion--fast); }
.wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; color: var(--wp--preset--color--red); border: 2px solid var(--wp--preset--color--red); }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--red); color: var(--wp--preset--color--white); }
.mt-btn-navy.is-style-outline > .wp-block-button__link { color: var(--wp--preset--color--navy); border-color: var(--wp--preset--color--navy); }
.mt-btn-navy.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--navy); color: var(--wp--preset--color--cream); }
.mt-btn-cream.is-style-outline > .wp-block-button__link { color: var(--wp--preset--color--cream); border-color: var(--wp--preset--color--cream); }
.mt-btn-cream.is-style-outline > .wp-block-button__link:hover { background: var(--wp--custom--on-navy--hover); color: var(--wp--preset--color--cream); }

/* ---------- Header ---------- */
.wp-site-blocks > header { position: sticky; top: 0; z-index: 20; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.mt-header { box-shadow: var(--wp--custom--shadow--1); }
.mt-header .alignwide { row-gap: var(--wp--preset--spacing--sm); }
.mt-brand { gap: var(--wp--preset--spacing--m); align-items: center; flex-wrap: nowrap; }
.mt-badge { margin: 0; }
.mt-badge img { width: 64px; height: auto; display: block; border-radius: 0; }
.mt-header .wp-block-site-title a { text-decoration: none; white-space: nowrap; }

/* Navigation: desktop bar */
.mt-nav, .mt-nav .wp-block-navigation__container { gap: 0; }
.mt-nav .wp-block-navigation-item { white-space: nowrap; }
.mt-header .alignwide { flex-wrap: nowrap; }
@media (max-width: 1100px) { .mt-header .alignwide { flex-wrap: wrap; } }
.mt-nav .wp-block-navigation-item__content { padding: var(--wp--preset--spacing--s); border-radius: var(--wp--custom--radius--s); transition: background-color var(--wp--custom--motion--fast); }
.mt-nav .wp-block-navigation-item__content:hover,
.mt-nav .current-menu-item > .wp-block-navigation-item__content,
.mt-nav .current-menu-ancestor > .wp-block-navigation-item__content { background: var(--wp--custom--on-navy--hover); }
.mt-nav .wp-block-navigation__submenu-icon { margin-left: var(--wp--preset--spacing--xs); }

/* Navigation: desktop dropdown */
/* The __container ul sits five levels inside .mt-nav (responsive-container > responsive-close >
   responsive-dialog > responsive-container-content > ul) and WordPress copies mt-nav onto that same
   ul, so `.mt-nav > .wp-block-navigation__container` can never match. Descendant, not child. */
.mt-nav .wp-block-navigation-item.has-child { position: relative; }
.mt-nav.items-justified-right .has-child > .wp-block-navigation__submenu-container { left: 0; right: auto; }
.mt-nav .wp-block-navigation__container > .has-child:nth-last-child(-n+2) > .wp-block-navigation__submenu-container { left: auto; right: 0; }
.mt-nav .wp-block-navigation__submenu-container {
  background: var(--wp--preset--color--cream) !important; color: var(--wp--preset--color--navy);
  border: 0 !important; border-radius: var(--wp--custom--radius--s); box-shadow: var(--wp--custom--shadow--1);
  min-width: 260px !important; padding: var(--wp--preset--spacing--s) 0 !important;
  font-family: var(--wp--preset--font-family--body); font-size: var(--wp--preset--font-size--body); text-transform: none; letter-spacing: 0;
}
.mt-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { color: var(--wp--preset--color--navy) !important; padding: 10px 20px; border-radius: 0; }
.mt-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--cream-deep); color: var(--wp--preset--color--red) !important; }
.mt-nav .wp-block-navigation-item.has-child:hover > .wp-block-navigation-item__content { background: var(--wp--preset--color--cream); color: var(--wp--preset--color--navy); border-radius: var(--wp--custom--radius--s) var(--wp--custom--radius--s) 0 0; }

/* Navigation: mobile toggle and overlay */
.mt-nav .wp-block-navigation__responsive-container-open { width: 48px; height: 48px; border: 2px solid var(--wp--preset--color--cream); border-radius: var(--wp--custom--radius--s); color: var(--wp--preset--color--cream); }
.mt-nav .wp-block-navigation__responsive-container-open svg { width: 28px; height: 28px; }
.mt-nav .wp-block-navigation__responsive-container-close { width: 48px; height: 48px; border: 2px solid var(--wp--preset--color--cream); border-radius: var(--wp--custom--radius--s); background: var(--wp--preset--color--cream); color: var(--wp--preset--color--navy); }
.mt-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 0; }
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 72px; }

/* Rows. The overlay stacks in a column and inherits `align-items: flex-end` from the desktop
   `items-justified-right` setting, so the whole list collapsed to its text width and hugged the
   right edge. Stretch both the content wrapper and the list to full width. */
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: stretch; }
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { font-size: 19px; letter-spacing: var(--wp--custom--tracking--nav); gap: 0; }
/* Every row is a flex line: label fills it, chevron parks at the right, panel wraps underneath. */
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item {
  width: 100%; border-top: 1px solid var(--wp--custom--on-navy--rule-soft);
  /* Core stacks overlay items with flex-direction: column, which put the label and the
     chevron on separate lines and centred them on the cross axis. Row, wrapping. */
  display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;
}
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { flex: 1 1 auto; width: auto; justify-content: flex-start; text-align: left; }
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .has-child > .wp-block-navigation__submenu-container { flex: 0 0 100%; box-sizing: border-box; }
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { padding: 14px var(--wp--preset--spacing--ml); border-radius: 0; }
/* Submenu rows inherit the same column/flex-end stacking as the top level; stretch them too. */
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container > .wp-block-navigation-item { display: block; width: 100%; }
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { justify-content: flex-start; text-align: left; }

/* Accordion. Core pins its submenu state open in the overlay and locks the store, so
   assets/js/nav.js owns .mt-open; core sets no `display` here, so no specificity fight. */
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .has-child > .wp-block-navigation__submenu-container { display: none; }
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .has-child.mt-open > .wp-block-navigation__submenu-container { display: block; }
/* Core sizes the chevron with `width: inherit` on the svg, so the glyph is whatever the
   button's CONTENT box is -- with border-box and side padding that was 0, an invisible chevron.
   Size the button's content box instead of fighting the inherit; padding is the tap target. */
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-icon {
  display: flex; align-items: center; margin: 0; cursor: pointer;
  box-sizing: content-box; width: 16px; height: 16px; padding: 16px var(--wp--preset--spacing--ml);
  background: none; border: 0; color: inherit;
}
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon svg { transition: transform var(--wp--custom--motion--fast); }
/* Core flips the chevron on its own aria-expanded, which it pins to true in the overlay, so
   every arrow pointed up. Rotation follows .mt-open here instead. */
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon svg { transform: none; }
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .has-child.mt-open > .wp-block-navigation__submenu-icon svg { transform: rotate(180deg); }

/* Submenu panel: inset on the same navy, not the desktop cream dropdown. */
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
  background: var(--wp--custom--on-navy--hover-soft) !important; box-shadow: none; color: var(--wp--preset--color--cream-deep);
  border-radius: 0; min-width: 0 !important;
  padding: var(--wp--preset--spacing--s) var(--wp--preset--spacing--ml) var(--wp--preset--spacing--sm) !important;
}
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { color: var(--wp--preset--color--cream-deep) !important; padding: 10px 0 10px var(--wp--preset--spacing--m); border-left: 2px solid var(--wp--custom--on-navy--rule-strong); }
.mt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.has-child:hover > .wp-block-navigation-item__content { background: var(--wp--custom--on-navy--hover-soft); color: var(--wp--preset--color--cream); }

/* ---------- Hero ---------- */
.mt-hero { color: var(--wp--preset--color--cream); background: var(--wp--preset--color--navy); padding: 0; min-height: 330px; }
/* Photo at its native pixel size, never scaled with the viewport. Edges beyond the photo fall to navy. */
.mt-hero .wp-block-cover__image-background { object-fit: none; object-position: center center; }
.mt-hero .wp-block-cover__inner-container { width: 100%; }
.mt-hero-row { gap: 40px; align-items: flex-start; flex-wrap: wrap; padding: var(--wp--preset--spacing--ml) 0; }
.mt-hero-badge { margin: 0; flex: none; }
.mt-hero-badge img { width: 240px; height: auto; border-radius: 0; filter: drop-shadow(0 0 3px #f4edcc); }
.mt-hero-copy { flex: 1 1 480px; min-width: 0; }
.mt-hero h1 { font-size: var(--wp--preset--font-size--display); line-height: var(--wp--custom--leading--display); letter-spacing: var(--wp--custom--tracking--tight); margin: 0; padding-top: 4px; text-wrap: balance; color: var(--wp--preset--color--cream); }
.mt-hero p { font-size: var(--wp--preset--font-size--large); line-height: var(--wp--custom--leading--large); margin: var(--wp--preset--spacing--s) 0 var(--wp--preset--spacing--sm); max-width: 760px; color: var(--wp--preset--color--cream-deep); }
.mt-hero .wp-block-buttons { gap: var(--wp--preset--spacing--s) var(--wp--preset--spacing--sm); }
@media (max-width: 640px) { .mt-hero h1 { font-size: var(--wp--preset--font-size--heading-1); } .mt-hero-badge { display: none; } }

/* ---------- Homepage streams ---------- */
.mt-streams > * { margin-block-start: 0; }
.mt-streams { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--wp--preset--spacing--l); }
.mt-stream > h2 { margin: 0 0 var(--wp--preset--spacing--m); padding-bottom: var(--wp--preset--spacing--s); border-bottom: 3px solid var(--wp--preset--color--red); }
.mt-stream--results > h2 { border-bottom-color: var(--wp--preset--color--green); }
.mt-stream-list .wp-block-post-template { margin: 0; }
.mt-post-row { padding: var(--wp--preset--spacing--m) 0; border-bottom: 1px solid var(--wp--preset--color--rule); gap: var(--wp--preset--spacing--m); align-items: flex-start; }
.mt-post-row .wp-block-post-date { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink-muted); margin: 0 0 var(--wp--preset--spacing--xs); }
.mt-post-row .wp-block-post-title { font-family: var(--wp--preset--font-family--body); font-size: var(--wp--preset--font-size--large); font-weight: 600; line-height: var(--wp--custom--leading--title); text-transform: none; letter-spacing: 0; margin: 0; }
.mt-post-row .wp-block-post-title a { color: var(--wp--preset--color--navy); text-decoration: none; }
.mt-post-row .wp-block-post-title a:hover { color: var(--wp--preset--color--red); text-decoration: underline; }
.mt-post-row .wp-block-post-excerpt { margin-top: var(--wp--preset--spacing--xs); }
.mt-post-row .wp-block-post-excerpt__more-text { display: none; }
.mt-thumb { margin: 0; flex: none; }
.mt-thumb img { width: 72px; height: 72px; object-fit: cover; border-radius: var(--wp--custom--radius--s); display: block; }

/* ---------- Upcoming events (shortcode output) ---------- */
.mt-upcoming > h2 { margin: 0 0 var(--wp--preset--spacing--m); }
.mt-events { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--sm); }
.mt-event { display: flex; gap: var(--wp--preset--spacing--ml); align-items: center; background: var(--wp--preset--color--cream); border-radius: var(--wp--custom--radius--s); padding: var(--wp--preset--spacing--m) var(--wp--preset--spacing--ml); color: var(--wp--preset--color--navy); text-decoration: none; }
.mt-event:hover { background: var(--wp--preset--color--cream-deep); color: var(--wp--preset--color--navy); }
.mt-event-date { font-family: var(--wp--preset--font-family--display); text-align: center; border-right: 1px solid var(--wp--preset--color--rule-deep); padding-right: var(--wp--preset--spacing--m); flex: none; width: 80px; display: flex; flex-direction: column; }
.mt-event-mon { font-size: var(--wp--preset--font-size--small); text-transform: uppercase; letter-spacing: var(--wp--custom--tracking--eyebrow); }
.mt-event-day { font-size: var(--wp--preset--font-size--stat); line-height: var(--wp--custom--leading--flat); font-weight: 500; }
.mt-event-body { min-width: 0; }
.mt-event-title { display: block; font-size: var(--wp--preset--font-size--large); font-weight: 600; line-height: var(--wp--custom--leading--title); }
.mt-event-meta { display: block; font-size: var(--wp--preset--font-size--small-lg); color: var(--wp--preset--color--ink-muted); }
.mt-events-empty { color: var(--wp--preset--color--ink-muted); }

/* ---------- Sidebar ---------- */
.mt-sidebar { gap: var(--wp--preset--spacing--l); }
.mt-sidebar h3 { margin: 0 0 var(--wp--preset--spacing--sm); padding-bottom: var(--wp--preset--spacing--s); border-bottom: 1px solid var(--wp--preset--color--rule-deep); }
.mt-conditions { background: var(--wp--preset--color--navy); color: var(--wp--preset--color--cream); border-radius: var(--wp--custom--radius--s); padding: var(--wp--preset--spacing--ml); overflow: hidden; }
.mt-conditions .mt-eyebrow { margin-bottom: var(--wp--preset--spacing--sm); }
.mt-conditions .wp-block-shortcode, .mt-conditions iframe { max-width: 100%; }
.mt-conditions p { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--ink-muted-on-navy); margin: var(--wp--preset--spacing--s) 0 0; }
.mt-conditions a { color: var(--wp--preset--color--cream); }
.mt-sponsor-cta { background: var(--wp--preset--color--cream); border-radius: var(--wp--custom--radius--s); padding: var(--wp--preset--spacing--ml); text-align: center; }
.mt-sponsor-cta h3 { margin: 0; padding: 0; border: 0; }
.mt-sponsor-cta p { font-size: var(--wp--preset--font-size--small-lg); line-height: var(--wp--custom--leading--large); margin: var(--wp--preset--spacing--s) 0 var(--wp--preset--spacing--m); color: var(--wp--preset--color--ink-muted); }
.mt-sponsor-cta .wp-block-button__link { font-size: var(--wp--preset--font-size--small-lg); }
.mt-sidebar .wp-block-latest-posts { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--wp--preset--spacing--s); font-size: var(--wp--preset--font-size--body-sm); line-height: var(--wp--custom--leading--list); }
.mt-sidebar .wp-block-latest-posts a { color: var(--wp--preset--color--navy); text-decoration: none; }
.mt-sidebar .wp-block-latest-posts a:hover { color: var(--wp--preset--color--red); text-decoration: underline; }
.mt-chips { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--s); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--small); letter-spacing: var(--wp--custom--tracking--caps); text-transform: uppercase; }
.mt-chips li { margin: 0; }
.mt-chips li a { display: inline-block; border: 1px solid var(--wp--preset--color--navy); color: var(--wp--preset--color--navy); text-decoration: none; padding: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--sm); border-radius: var(--wp--custom--radius--pill); white-space: nowrap; }
.mt-chips li a:hover { background: var(--wp--preset--color--navy); color: var(--wp--preset--color--cream); }

/* ---------- Title band (pages, archives, search, 404) ---------- */
.mt-title-band { background: var(--wp--preset--color--cream); border-bottom: 1px solid var(--wp--preset--color--rule); padding-top: var(--wp--preset--spacing--l); padding-bottom: var(--wp--preset--spacing--l); }
.mt-title-band h1, .mt-title-band .wp-block-post-title, .mt-title-band .wp-block-query-title { margin: 0; }
.mt-title-band .wp-block-term-description, .mt-title-band .mt-lede { margin: var(--wp--preset--spacing--s) 0 0; }
.mt-title-band .wp-block-term-description p { margin: 0; }

/* ---------- Article ---------- */
.mt-article { max-width: var(--wp--style--global--content-size); }
.mt-post-meta { gap: var(--wp--preset--spacing--sm); align-items: center; flex-wrap: wrap; font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--small); letter-spacing: var(--wp--custom--tracking--label); text-transform: uppercase; margin-bottom: var(--wp--preset--spacing--sm); color: var(--wp--preset--color--ink-muted); }
.mt-post-meta .wp-block-post-terms a { display: inline-block; background: var(--wp--preset--color--navy); color: var(--wp--preset--color--white); text-decoration: none; padding: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--sm); border-radius: var(--wp--custom--radius--pill); white-space: nowrap; }
.mt-post-meta .wp-block-post-terms a:hover { background: var(--wp--preset--color--navy-deep); }
.category-results-events .mt-post-meta .wp-block-post-terms a { background: var(--wp--preset--color--green); }
.category-results-events .mt-post-meta .wp-block-post-terms a:hover { background: var(--wp--preset--color--green-deep); }
.category-reminder .mt-post-meta .wp-block-post-terms a { background: var(--wp--preset--color--red); }
.category-reminder .mt-post-meta .wp-block-post-terms a:hover { background: var(--wp--preset--color--red-deep); }
.mt-post-meta .wp-block-post-terms__separator { display: none; }
.mt-article .wp-block-post-title { margin: 0 0 var(--wp--preset--spacing--ml); text-wrap: balance; }
.mt-article .wp-block-post-featured-image { margin: 0 0 var(--wp--preset--spacing--l); }
/* Natural size, capped: many existing featured images are small and would upscale badly. */
.mt-article .wp-block-post-featured-image img { max-width: 100%; width: auto; max-height: 480px; height: auto; border-radius: var(--wp--custom--radius--s); }
.mt-post-nav { border-top: 1px solid var(--wp--preset--color--rule); padding-top: var(--wp--preset--spacing--ml); margin-top: var(--wp--preset--spacing--xl); justify-content: space-between; gap: var(--wp--preset--spacing--m); font-size: var(--wp--preset--font-size--body-sm); }
.mt-post-nav .wp-block-post-navigation-link { max-width: 48%; }
.mt-post-nav .post-navigation-link-next { text-align: right; }
.mt-post-nav a { color: var(--wp--preset--color--navy); text-decoration: none; }
.mt-post-nav a:hover { color: var(--wp--preset--color--red); }
.mt-post-nav .post-navigation-link__label { display: block; font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--x-small); letter-spacing: var(--wp--custom--tracking--eyebrow); text-transform: uppercase; color: var(--wp--preset--color--ink-muted); }

/* ---------- Archive / search lists ---------- */
.mt-list .wp-block-post-template { margin: 0; }
.mt-list .mt-post-row { padding: var(--wp--preset--spacing--ml) 0; }
.wp-block-query-pagination { margin-top: var(--wp--preset--spacing--l); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--small-lg); letter-spacing: var(--wp--custom--tracking--button); text-transform: uppercase; }
.wp-block-query-pagination a { text-decoration: none; }
.wp-block-query-pagination-numbers .current { color: var(--wp--preset--color--ink-muted); }

/* ---------- Sponsor band ---------- */
.mt-sponsor-band { background: var(--wp--preset--color--cream); padding-top: var(--wp--preset--spacing--xl); padding-bottom: var(--wp--preset--spacing--xl); }
.mt-sponsor-row { gap: var(--wp--preset--spacing--l) var(--wp--preset--spacing--xl); align-items: center; flex-wrap: wrap; }
.mt-sponsor-text { flex: 1 1 280px; min-width: 0; }
.mt-sponsor-text h2 { margin: 0 0 var(--wp--preset--spacing--s); }
.mt-sponsor-text p { font-size: var(--wp--preset--font-size--body-sm); line-height: var(--wp--custom--leading--large); margin: 0 0 var(--wp--preset--spacing--m); color: var(--wp--preset--color--ink-soft); }
.mt-logo-grid { flex: 2 1 480px; min-width: 0; width: 100%; }
/* Default grid only when the editor has not set one (a Grid layout in the Site Editor wins). */
.mt-logo-grid:not(.is-layout-grid) { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--wp--preset--spacing--m); }
.mt-logo-grid .wp-block-image { margin: 0; height: 72px; display: flex; align-items: center; justify-content: center; background: var(--wp--preset--color--white); border-radius: var(--wp--custom--radius--s); padding: var(--wp--preset--spacing--xs); transition: box-shadow var(--wp--custom--motion--fast); }
.mt-logo-grid .wp-block-image:hover { box-shadow: var(--wp--custom--shadow--1); }
.mt-logo-grid .wp-block-image a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.mt-logo-grid .wp-block-image img { max-width: 100%; max-height: 64px; width: auto; height: auto; object-fit: contain; border-radius: 0; }
/* The Sponsors page runs the same tiles at reading size: auto-fit so the grid reflows instead of
   locking to three, and taller boxes because the logos are mixed aspect ratios. */
.mt-logo-grid.mt-logo-wall:not(.is-layout-grid) { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--wp--preset--spacing--m); margin-block: var(--wp--preset--spacing--l); }
.mt-logo-grid.mt-logo-wall .wp-block-image { height: 150px; padding: var(--wp--preset--spacing--m); border: 1px solid var(--wp--preset--color--rule); }
.mt-logo-grid.mt-logo-wall .wp-block-image img { max-height: 118px; }

/* ---------- Footer ---------- */
.mt-footer { background: var(--wp--preset--color--navy); color: var(--wp--preset--color--cream-deep); padding-top: var(--wp--preset--spacing--xl); padding-bottom: var(--wp--preset--spacing--ml); font-size: var(--wp--preset--font-size--small-lg); line-height: var(--wp--custom--leading--body); }
.mt-footer a { color: var(--wp--preset--color--cream); }
.mt-footer a:hover { color: var(--wp--preset--color--clay); }
.mt-footer p { margin: 0; }
.mt-footer .wp-block-columns { gap: var(--wp--preset--spacing--l); }
.mt-footer-brand { gap: var(--wp--preset--spacing--m); align-items: center; margin-bottom: var(--wp--preset--spacing--sm); flex-wrap: nowrap; }
.mt-footer-brand .wp-block-image { margin: 0; }
.mt-footer-brand img { width: 56px; height: auto; border-radius: 0; filter: drop-shadow(0 0 3px #f4edcc); }
.mt-footer-name { font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--large); text-transform: uppercase; letter-spacing: var(--wp--custom--tracking--caps); color: var(--wp--preset--color--cream); margin: 0; }
.mt-footer .mt-eyebrow { margin-bottom: var(--wp--preset--spacing--s); }
.mt-footer .sib-form, .mt-footer .sib_signup_form { margin-top: var(--wp--preset--spacing--s); max-width: var(--wp--custom--width--sidebar); }
.mt-footer-bar { margin-top: var(--wp--preset--spacing--l); padding-top: var(--wp--preset--spacing--m); border-top: 1px solid var(--wp--custom--on-navy--rule); font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--ink-muted-on-navy); justify-content: space-between; flex-wrap: wrap; gap: var(--wp--preset--spacing--s); }
.mt-footer-bar p { margin: 0; }
.mt-footer-bar a { color: var(--wp--preset--color--ink-muted-on-navy); text-decoration: none; }
.mt-footer-bar a:hover { color: var(--wp--preset--color--cream); }

/* ---------- Tables (core + TablePress) ---------- */
.wp-block-table { overflow-x: auto; margin-bottom: var(--wp--preset--spacing--l); }
.wp-block-table table { width: 100%; min-width: 480px; border-collapse: collapse; font-size: var(--wp--preset--font-size--body); line-height: var(--wp--custom--leading--table); }
.wp-block-table thead th, .tablepress thead th, .tablepress .row-1 th { background: var(--wp--preset--color--navy); color: var(--wp--preset--color--cream); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--small); letter-spacing: var(--wp--custom--tracking--label); text-transform: uppercase; text-align: left; font-weight: 500; padding: var(--wp--preset--spacing--sm) var(--wp--preset--spacing--m); border: 0; }
.wp-block-table th { background: var(--wp--preset--color--navy); color: var(--wp--preset--color--cream); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--small); letter-spacing: var(--wp--custom--tracking--label); text-transform: uppercase; font-weight: 500; padding: var(--wp--preset--spacing--sm) var(--wp--preset--spacing--m); border: 0; }
.wp-block-table td, .tablepress td { padding: var(--wp--preset--spacing--sm) var(--wp--preset--spacing--m); border: 0; border-bottom: 1px solid var(--wp--preset--color--rule); vertical-align: top; }
/* Legacy content tables use fixed layout, which breaks words on phones. Let them scroll instead. */
.wp-block-table table.has-fixed-layout { table-layout: auto; }
.wp-block-table table.has-fixed-layout td, .wp-block-table table.has-fixed-layout th { word-break: normal; }
.wp-block-table tbody tr:nth-child(even) td, .tablepress tbody tr:nth-child(even) td { background: var(--wp--preset--color--cream); }
.wp-block-table tbody td:first-child, .tablepress tbody td:first-child { font-weight: 600; }
.wp-block-table.is-style-stripes { border-bottom: 0; }
.tablepress-scroll-wrapper, .tablepress-table-wrapper { overflow-x: auto; margin: 0 0 var(--wp--preset--spacing--l); }
/* TablePress: compact, one line per cell; .mt-scroll (added in functions.php) scrolls only when the table is wider than the column. */
.mt-scroll { overflow-x: auto; margin: 0 0 var(--wp--preset--spacing--l); }
/* Columns shrink to their content; the table centers in the column instead of stretching to fill it. */
.mt-scroll .tablepress { width: auto !important; min-width: 0; margin: 0 auto; font-size: var(--wp--preset--font-size--small); line-height: 1.3; }
.mt-scroll .tablepress th, .mt-scroll .tablepress td { white-space: nowrap !important; padding: 6px 8px !important; }
.mt-scroll .tablepress thead th { font-size: 12px; letter-spacing: 0; padding-right: 18px !important; } /* room for sort arrows */
.mt-scroll .tablepress th br { display: none; }
/* TablePress "horizontal scrolling" option splits header and body into two tables; keep both full width so they align. */
.mt-scroll .dataTables_scroll .tablepress, .mt-scroll .dt-scroll .tablepress, .mt-scroll .dataTables_scrollHead .tablepress, .mt-scroll .dataTables_scrollBody .tablepress { width: 100% !important; margin: 0; }
.mt-scroll .tablepress td:last-child { white-space: normal !important; } /* notes columns may wrap */
.mt-scroll .tablepress .dt-container, .mt-scroll .dataTables_wrapper { font-size: var(--wp--preset--font-size--small); }
.mt-main--wide .wp-block-post-content.alignfull { margin-left: 0; margin-right: 0; max-width: none; }

/* ---------- Forms: password, search, Contact Form 7 ---------- */
.post-password-form { background: var(--wp--preset--color--white); border-top: 4px solid var(--wp--preset--color--navy); border-radius: var(--wp--custom--radius--s); padding: var(--wp--preset--spacing--ml); box-shadow: var(--wp--custom--shadow--1); }
.post-password-form p:last-child { display: flex; gap: var(--wp--preset--spacing--s); flex-wrap: wrap; align-items: flex-end; margin: 0; }
.post-password-form label { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--xs); flex: 1 1 220px; font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--small); letter-spacing: var(--wp--custom--tracking--label); text-transform: uppercase; }
input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="number"], textarea, select,
.wp-block-search__input {
  font: inherit; font-size: var(--wp--preset--font-size--body); color: var(--wp--preset--color--navy); background: var(--wp--preset--color--paper);
  border: 1px solid var(--wp--preset--color--rule-deep); border-radius: var(--wp--custom--radius--s); padding: 10px 12px; max-width: 100%;
}
input:focus, textarea:focus, select:focus, .wp-block-search__input:focus { outline: 0; border: 2px solid var(--wp--preset--color--navy); padding: 9px 11px; }
input[type="submit"], button[type="submit"], .wp-block-search__button, .wpcf7-submit {
  font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--body-sm); text-transform: uppercase; letter-spacing: var(--wp--custom--tracking--button);
  background: var(--wp--preset--color--red); color: var(--wp--preset--color--white); border: 2px solid var(--wp--preset--color--red); border-radius: var(--wp--custom--radius--s); padding: 10px 20px; cursor: pointer;
}
input[type="submit"]:hover, button[type="submit"]:hover, .wp-block-search__button:hover, .wpcf7-submit:hover { background: var(--wp--preset--color--red-deep); border-color: var(--wp--preset--color--red-deep); color: var(--wp--preset--color--white); }
.wpcf7-not-valid { border-color: var(--wp--preset--color--red) !important; border-width: 2px; }
.wpcf7-not-valid-tip { color: var(--wp--preset--color--red); font-size: var(--wp--preset--font-size--small); }
.wp-block-search__inside-wrapper { gap: var(--wp--preset--spacing--s); }

/* ---------- Embeds (Range Schedule calendar) ---------- */
.mt-embed { position: relative; aspect-ratio: 16 / 10; min-height: 480px; margin: 0 0 var(--wp--preset--spacing--m); }
.mt-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: var(--wp--custom--radius--s); }
@media (max-width: 640px) { .mt-embed { aspect-ratio: 3 / 4; } }

/* A bare iframe from a shortcode ([ventus] on Current Conditions) is inline-level, so the constrained
   layout's auto margins do not centre it — it sits hard left. display:block is the whole fix. */
.mt-main .wp-block-post-content iframe { display: block; margin-inline: auto; max-width: 100%; }

/* assets/js/localendar.js grows each iframe to fit its own content, so this is a pre-load floor and a
   frame, not an .mt-embed aspect box — a fixed box would nest a scrollbar inside the month grid.
   Content width, not alignwide: the embeds are meant to line up with the prose either side of them. */
.mt-calendar-embed { margin-block: var(--wp--preset--spacing--l); }
.mt-calendar-embed iframe { display: block; width: 100%; min-height: 520px; border: 1px solid var(--wp--preset--color--rule); border-radius: var(--wp--custom--radius--s); background: var(--wp--preset--color--white); }

/* ---------- Print ---------- */
/* The range-duty and cheat-sheet pages replaced PDFs members used to print, so Ctrl-P has to give a
   clean sheet rather than a screenshot of the site. The button is injected by JS (see functions.php)
   so there is no dead control when JS is off; everything here works without it. */
.mt-print { position: fixed; right: 20px; bottom: 20px; z-index: 20; display: none;
	width: 40px; height: 40px; padding: 0; cursor: pointer; opacity: .55;
	border: 1px solid var(--wp--preset--color--rule-deep); border-radius: 50%;
	background: var(--wp--preset--color--white); color: var(--wp--preset--color--ink-muted);
	transition: opacity .2s, color .2s, border-color .2s; }
.mt-print svg { display: block; width: 18px; height: 18px; margin: auto; fill: currentColor; }
.mt-print:hover, .mt-print:focus-visible { opacity: 1; color: var(--wp--preset--color--navy); border-color: var(--wp--preset--color--navy); }
/* Nobody prints from a phone; below this width the button is only in the way. */
@media (min-width: 768px) { .mt-print { display: block; } }

/* Echoed at wp_body_open (functions.php); screen never shows it, print puts it at the top of page 1.
   A normal block in the flow, not a running header — so it appears once, on the first page only. */
.mt-print-masthead { display: none; }

@page { margin: 15mm; }

@media print {
	/* Chrome, navigation and anything that only exists to click. */
	.mt-header, .mt-sidebar, .mt-footer, .mt-sponsor-band, .mt-print, .mt-more,
	.wp-block-navigation, .wp-block-search, .wp-block-buttons, .skip-link,
	/* Popup Maker parks the Brevo mailing-list popup in the DOM on every page; printing lands it
	   on top of the text whether or not it was ever opened on screen. */
	.pum-overlay { display: none !important; }
	/* An iframe prints as a blank box at best (windy, localendar), and the WP Map Block leaflet div
	   prints as an empty frame with its zoom buttons, so drop both rather than leave a hole. */
	.mt-main iframe, .wpmapblockrender { display: none !important; }

	.mt-print-masthead { display: flex; align-items: center; gap: 8pt;
		margin: 0 0 10pt; padding-bottom: 6pt; border-bottom: 1px solid var(--wp--preset--color--rule-deep); }
	.mt-print-masthead img { width: 30px; height: auto; }
	.mt-print-masthead span { font-family: var(--wp--preset--font-family--display); font-size: 10pt;
		letter-spacing: var(--wp--custom--tracking--button); text-transform: uppercase; color: #000; }

	body { background: #fff; color: #000; }

	/* Screen sizes are px on a 1200px column; at 96dpi they convert straight to pt and print huge
	   (h1 40px = 30pt). Restate the scale in pt. Class selectors beat theme.json's :root :where(...)
	   global styles, which is why these are prefixed rather than bare element rules. */
	html, body, .mt-main, .mt-main p, .mt-main li, .mt-main td, .mt-main th { font-size: 10pt; line-height: 1.4; }
	.mt-main .mt-lede { font-size: 11pt; line-height: 1.35; }
	.mt-title-band h1, .mt-title-band .wp-block-post-title { font-size: 18pt; line-height: 1.15; }
	.mt-main h2 { font-size: 13pt; margin: 14pt 0 4pt; }
	.mt-main h3 { font-size: 11pt; margin: 10pt 0 3pt; }
	.mt-main figcaption, .mt-main .wp-element-caption { font-size: 8.5pt; }
	.mt-print-masthead span { font-size: 9pt; }

	/* blockGap is 24px between every block; that is a screen rhythm, not a paper one. */
	.mt-main p, .mt-main ul, .mt-main ol, .mt-main .wp-block-group { margin-top: 0; margin-bottom: 6pt; }
	.mt-main li { margin-bottom: 2pt; }
	.mt-title-band { background: none; padding: 0 0 6pt; margin-bottom: 10pt; border-bottom: 1px solid #000; }
	.mt-main, .mt-main > .wp-block-post-content { max-width: none; padding: 0; }

	h1, h2, h3 { color: #000; break-after: avoid; }
	.mt-main h2 { border-bottom: 1px solid #000; }
	/* NOT .wp-block-group: .mt-main carries that class, so avoiding a break inside it means avoiding a
	   break inside the whole page, and the browser pushes the lot onto page 2 behind a blank page 1.
	   Only things that genuinely fit in a page get break-inside. */
	li, tr, img, figure, .wp-block-table, .has-cream-background-color { break-inside: avoid; }
	a { color: #000; text-decoration: underline; }
	/* Internal links are root-relative and print as plain text; only spell out where an external one goes. */
	.mt-main a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; word-break: break-all; }
	/* Cream reads as a grey wash on a mono printer; a rule keeps the callout legible as a callout. */
	.has-cream-background-color { background: none !important; border: 1px solid #000; }
}

/* ---------- The Events Calendar: fonts and colors follow the theme ---------- */
.tribe-common, .tribe-events {
  --tec-font-family-sans-serif: var(--wp--preset--font-family--body);
  --tec-color-accent-primary: var(--wp--preset--color--red);
  --tec-color-accent-primary-hover: var(--wp--preset--color--red-deep);
  --tec-color-accent-primary-active: var(--wp--preset--color--red-deep);
  --tec-color-accent-secondary: var(--wp--preset--color--navy);
  --tec-color-link-primary: var(--wp--preset--color--navy);
  --tec-color-link-accent: var(--wp--preset--color--red);
  --tec-color-link-accent-hover: var(--wp--preset--color--red-deep);
  --tec-color-button-primary: var(--wp--preset--color--red);
  --tec-color-button-primary-hover: var(--wp--preset--color--red-deep);
  --tec-color-button-primary-active: var(--wp--preset--color--red-deep);
  --tec-color-button-primary-background: var(--wp--preset--color--red);
  --tec-color-button-secondary: var(--wp--preset--color--navy);
  --tec-color-button-secondary-hover: var(--wp--preset--color--navy-deep);
  --tec-color-button-secondary-active: var(--wp--preset--color--navy-deep);
  --tec-color-background-events-bar-submit-button: var(--wp--preset--color--red);
  --tec-color-background-events-bar-submit-button-hover: var(--wp--preset--color--red-deep);
  --tec-color-background-events-bar-submit-button-active: var(--wp--preset--color--red-deep);
  --tec-color-text-events-bar-submit-button: var(--wp--preset--color--white);
  --tec-color-text-events-bar-submit-button-hover: var(--wp--preset--color--white);
  --tec-color-border-default: var(--wp--preset--color--rule);
  --tec-color-border-secondary: var(--wp--preset--color--rule);
  --tec-color-border-tertiary: var(--wp--preset--color--rule);
  --tec-color-border-active: var(--wp--preset--color--navy);
  --tec-color-border-events-bar: var(--wp--preset--color--rule-deep);
}
.tribe-common .tribe-common-h1, .tribe-common .tribe-common-h2, .tribe-common .tribe-common-h3 { font-family: var(--wp--preset--font-family--display); text-transform: uppercase; letter-spacing: var(--wp--custom--tracking--heading); }

/* Event archive (templates/archive-events.html). TEC's view sits inside .mt-main, which already
   carries the page's padding, so drop the view's own. min-height:600px is TEC's loader reserve and
   leaves a screen of blank paper above the sponsor band on a short calendar. */
/* TEC picks its list layout from the container's own width: under 960px it drops event
   descriptions and collapses the search bar, so the archive runs at wideSize, not contentSize. */
.mt-events-archive > .tribe-block { max-width: var(--wp--style--global--wide-size); }
/* TEC's own rules run to .tribe-common--breakpoint-medium.tribe-events .x (0,3,0) and load after
   this file, so these carry a matching-or-higher selector on purpose. */
.mt-events-archive .tribe-events.tribe-events-view { margin: 0; padding: 0; }
.mt-events-archive .tribe-events.tribe-events-view .tribe-events-l-container { min-height: 0; padding-top: 0; padding-bottom: 0; }
.mt-events-archive .tribe-events-c-search__button { font-family: var(--wp--preset--font-family--display); text-transform: uppercase; letter-spacing: var(--wp--custom--tracking--button); border-radius: var(--wp--custom--radius--s); }
/* Event names are content, not section headings: body face, sentence case, navy like other links. */
.mt-events-archive .tribe-common .tribe-events-calendar-list__event-title { font-family: var(--wp--preset--font-family--body); text-transform: none; letter-spacing: 0; }
.mt-events-archive .tribe-events-calendar-list__event-title a { color: var(--wp--preset--color--navy); text-decoration: none; }
.mt-events-archive .tribe-events-calendar-list__event-title a:hover { color: var(--wp--preset--color--red); text-decoration: underline; }
.mt-events-archive .tribe-common .tribe-events-calendar-list__month-separator-text { font-family: var(--wp--preset--font-family--display); text-transform: uppercase; letter-spacing: var(--wp--custom--tracking--label); color: var(--wp--preset--color--ink-muted); }

/* ---------- In Memoriam ---------- */
/* Portraits arrive at six different aspect ratios; a common crop keeps the entries in a column
   instead of stair-stepping, and top alignment stops the photo drifting off its name. */
.mt-memorial { margin-block: var(--wp--preset--spacing--xl); padding-bottom: var(--wp--preset--spacing--l); border-bottom: 1px solid var(--wp--preset--color--rule); }
.mt-memorial:last-child { border-bottom: 0; padding-bottom: 0; }
.mt-memorial .wp-block-media-text__media img { aspect-ratio: 3 / 4; object-fit: cover; object-position: center top; border-radius: var(--wp--custom--radius--s); }
.mt-main .mt-memorial h2 { margin: 0; padding: 0; border: 0; font-size: var(--wp--preset--font-size--heading-3); }
.mt-memorial-dates { font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--small); letter-spacing: var(--wp--custom--tracking--label); text-transform: uppercase; color: var(--wp--preset--color--ink-muted); margin: var(--wp--preset--spacing--xs) 0 var(--wp--preset--spacing--m); }

/* ---------- Long documents (Constitution / By-Laws, Rules) ---------- */
/* Section headings are frequent and short; the h2 article rule carries the weight, so h3 stays quiet. */
.mt-doc h3 { font-size: var(--wp--preset--font-size--large); color: var(--wp--preset--color--ink-soft); margin-top: var(--wp--preset--spacing--ml); margin-bottom: var(--wp--preset--spacing--xs); }
.mt-doc-meta { background: var(--wp--preset--color--cream); border-radius: var(--wp--custom--radius--s); padding: var(--wp--preset--spacing--m) var(--wp--preset--spacing--ml); font-size: var(--wp--preset--font-size--body-sm); color: var(--wp--preset--color--ink-soft); }

/* ---------- Diagrams ---------- */
/* Inline SVG in post content (the Skrap field layout on Other Trap Games). Styling lives here rather
   than on the elements so the diagram follows the palette and needs no edit when tokens move. */
.mt-diagram { margin-block: var(--wp--preset--spacing--l); }
.mt-diagram svg { display: block; width: 100%; height: auto; background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--rule); border-radius: var(--wp--custom--radius--s); padding: var(--wp--preset--spacing--s) 0; box-sizing: border-box; }
.mt-diagram text { font-family: var(--wp--preset--font-family--display); fill: var(--wp--preset--color--ink-muted); }
.mt-d-note { font-size: 11px; letter-spacing: var(--wp--custom--tracking--label); text-transform: uppercase; }
.mt-d-num { font-size: 12px; font-weight: 600; fill: var(--wp--preset--color--red); }
.mt-d-house { fill: var(--wp--preset--color--navy); }
.mt-d-flight { stroke: var(--wp--preset--color--ink-muted); stroke-width: 1.5; }
.mt-d-guide { stroke: var(--wp--preset--color--rule-deep); stroke-width: 1; stroke-dasharray: 4 4; }
.mt-d-arc16 { stroke: var(--wp--preset--color--navy); stroke-width: 1.5; }
.mt-d-arc27 { stroke: var(--wp--preset--color--red); stroke-width: 2; }
.mt-d-dot16 { fill: var(--wp--preset--color--navy); }
.mt-d-dot27 { fill: var(--wp--preset--color--red); }
.mt-diagram figcaption { font-size: var(--wp--preset--font-size--body-sm); line-height: var(--wp--custom--leading--large); color: var(--wp--preset--color--ink-muted); margin-top: var(--wp--preset--spacing--xs); }

/* ---------- Photo albums (Photos index + album galleries) ---------- */
/* post-content is a constrained child of a constrained .mt-main, so without this it
   caps at contentSize and alignwide has nothing to widen into. */
.mt-main > .wp-block-post-content { max-width: var(--wp--style--global--wide-size); }

.mt-album-grid { gap: var(--wp--preset--spacing--m); list-style: none; padding: 0; }
.mt-album-grid > li { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--xs); }
.mt-album-grid .wp-block-post-featured-image img { border-radius: var(--wp--custom--radius--s); }
.mt-album-grid .wp-block-post-title { margin: 0; border: 0; padding: 0; }
.mt-album-grid .wp-block-post-title a { color: var(--wp--preset--color--navy); }
.mt-album-grid .wp-block-post-title a { text-decoration: none; }
.mt-album-grid .wp-block-post-title a:hover { color: var(--wp--preset--color--red); }
/* [mallard_albums] on a group page. Core's Query Loop gets its grid from a generated layout
   class; the shortcode's own container needs the same geometry stated here. The thumb keeps its
   own class rather than borrowing wp-block-post-featured-image, whose sizing rules fight this. */
.mt-album-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); margin: 0; }
.mt-album-thumb { display: block; aspect-ratio: 4/3; overflow: hidden;
  border-radius: var(--wp--custom--radius--s); background: var(--wp--preset--color--cream); }
.mt-album-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }

.mt-main .wp-block-gallery { margin-block: var(--wp--preset--spacing--l); }
.mt-main .wp-block-gallery img { border-radius: var(--wp--custom--radius--s); }
.mt-more { font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--body-sm);
  text-transform: uppercase; letter-spacing: var(--wp--custom--tracking--button); margin-top: var(--wp--preset--spacing--s); }
.mt-main .wp-block-gallery + .mt-more { margin-top: calc(-1 * var(--wp--preset--spacing--m)); }

/* ---------- TablePress: DataTables chrome (search, sort arrows, info) ---------- */
.mt-scroll .dt-layout-row { align-items: center; margin: 0 0 var(--wp--preset--spacing--s); }
.mt-scroll .dt-layout-row.dt-layout-table { margin: 0; }
.mt-scroll .dt-search { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.mt-scroll .dt-search label {
  margin: 0; font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--small);
  text-transform: uppercase; letter-spacing: var(--wp--custom--tracking--label); color: var(--wp--preset--color--ink-soft);
}
.mt-scroll .dt-search input.dt-input {
  font-family: var(--wp--preset--font-family--body); font-size: var(--wp--preset--font-size--body-sm);
  color: var(--wp--preset--color--navy);
  background: var(--wp--preset--color--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23263940' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4.3-4.3'/%3E%3C/svg%3E") no-repeat 9px center / 14px;
  border: 1px solid var(--wp--preset--color--rule-deep); border-radius: var(--wp--custom--radius--s);
  padding: 7px 10px 7px 30px; min-width: 200px; max-width: 100%;
}
.mt-scroll .dt-search input.dt-input:focus { outline: 0; border: 2px solid var(--wp--preset--color--navy); padding: 6px 9px 6px 29px; }
.mt-scroll .dt-info { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink-muted); padding-top: var(--wp--preset--spacing--xs); }
/* Sort arrows stay out of the way until hover/focus; the sorted column stays lit. */
.mt-scroll .tablepress thead .dt-column-order::before,
.mt-scroll .tablepress thead .dt-column-order::after { opacity: 0; transition: opacity .15s ease; }
.mt-scroll .tablepress thead th:hover .dt-column-order::before,
.mt-scroll .tablepress thead th:hover .dt-column-order::after,
.mt-scroll .tablepress thead .dt-column-order:focus-visible::before,
.mt-scroll .tablepress thead .dt-column-order:focus-visible::after { opacity: .4; }
.mt-scroll .tablepress thead .dt-ordering-asc .dt-column-order::before,
.mt-scroll .tablepress thead .dt-ordering-desc .dt-column-order::after { opacity: 1; }
