/*!
 * Theme Engine — shared styles for RefBytes themes for Omeka S.
 *
 * Every color, font and size comes from --v-* design tokens, written into
 * the page by the engine helper from the theme settings (see the Style book
 * page template for the full list). Styles live in cascade layers so that
 * Omeka core CSS, module CSS and an admin's custom CSS always override them.
 *
 * A theme's own stylesheet (its design) goes in the "theme" layer: after
 * the engine's layers, so it wins over them, and before the utilities.
 */
@layer engine.tokens, engine.reset, engine.base, engine.layout, engine.components, engine.content, theme, engine.utilities;

/* ==========================================================================
   Fallback tokens (the helper's inline tokens override all of these)
   ========================================================================== */
@layer engine.tokens {
    :root {
        --v-bg: #fff;
        --v-surface: #fff;
        --v-surface-alt: #f1f5f9;
        --v-surface-sunken: #f4f5f6;
        --v-text: #1d2228;
        --v-text-muted: #5b6168;
        --v-heading: #1d2228;
        --v-border: #dadcdf;
        --v-border-strong: #8a8f95;
        --v-primary: #2d5f8b;
        --v-on-primary: #fff;
        --v-primary-hover: #234b6f;
        --v-on-primary-hover: #fff;
        --v-primary-subtle: #e3ebf3;
        --v-on-primary-subtle: #24506f;
        --v-primary-text: #2d5f8b;
        --v-secondary: #3e4c59;
        --v-on-secondary: #fff;
        --v-secondary-hover: #2f3a44;
        --v-on-secondary-hover: #fff;
        --v-secondary-text: #3e4c59;
        --v-accent: #b3541e;
        --v-on-accent: #fff;
        --v-accent-subtle: #f6e7de;
        --v-on-accent-subtle: #8f4318;
        --v-dark: #1c2733;
        --v-on-dark: #fff;
        --v-link: #2d5f8b;
        --v-link-hover: #1e4466;
        --v-focus: #173a5c;
        --v-focus-halo: #fff;
        --v-mark: #f0d3c2;
        --v-on-mark: #1d2228;
        --v-overlay: #10202e;
        --v-header-bg: var(--v-bg);
        --v-header-text: var(--v-text);
        --v-header-muted: var(--v-text-muted);
        --v-header-accent: var(--v-accent);
        --v-header-border: var(--v-border);
        --v-header-hover: var(--v-surface-alt);
        --v-topbar-bg: var(--v-secondary);
        --v-topbar-text: var(--v-on-secondary);
        --v-footer-bg: var(--v-dark);
        --v-footer-text: var(--v-on-dark);
        --v-footer-muted: #c9d1d9;
        --v-footer-border: #3a4655;
        --v-notice-success: #24632a;
        --v-notice-success-bg: #eaf3eb;
        --v-notice-warning: #7d4800;
        --v-notice-warning-bg: #f6efe5;
        --v-notice-danger: #9c211a;
        --v-notice-danger-bg: #f8e9e8;
        --v-notice-info: #0b5a99;
        --v-notice-info-bg: #e7f0f7;
        --v-font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
        --v-font-heading: var(--v-font-body);
        --v-font-mono: ui-monospace, Menlo, Consolas, monospace;
        --v-heading-weight: 700;
        --v-heading-case: none;
        --v-heading-tracking: normal;
        --v-step-n2: 0.72rem;
        --v-step-n1: 0.875rem;
        --v-step-0: 1.0625rem;
        --v-step-1: 1.3rem;
        --v-step-2: 1.6rem;
        --v-step-3: 1.95rem;
        --v-step-4: 2.4rem;
        --v-step-5: 2.9rem;
        --v-step-6: 3.5rem;
        --v-space-3xs: 0.25rem;
        --v-space-2xs: 0.5rem;
        --v-space-xs: 0.75rem;
        --v-space-s: 1rem;
        --v-space-m: 1.5rem;
        --v-space-l: 2rem;
        --v-space-xl: 3rem;
        --v-space-2xl: 4rem;
        --v-space-3xl: 6rem;
        --v-radius: 4px;
        --v-radius-sm: 3px;
        --v-radius-button: 3px;
        --v-container: 77.5rem;
        --v-measure: 70ch;
        --v-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.06), 0 1px 3px rgb(0 0 0 / 0.1);
        --v-shadow-md: 0 4px 12px rgb(0 0 0 / 0.08), 0 2px 4px rgb(0 0 0 / 0.06);
        --v-logo-height: 3.5rem;
        --v-card-ratio: 4 / 3;
        --v-card-fit: cover;
        --v-grid-min: 15rem;

        /* Derived, not configurable */
        --v-gutter: clamp(1rem, 4vw, 2rem);
        --v-line-height: 1.6;
        --v-line-height-heading: 1.2;
        --v-touch: 2.75rem;
        --v-sticky-offset: 0px;
        --v-ease: cubic-bezier(0.2, 0, 0, 1);
        --v-bleed: max(var(--v-gutter), (100% - var(--v-container)) / 2);
    }
}

/* ==========================================================================
   Reset
   ========================================================================== */
@layer engine.reset {
    *, *::before, *::after { box-sizing: border-box; }
    html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
    body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd { margin: 0; }
    img, picture, video, canvas, svg, iframe { max-width: 100%; }
    img, picture, video, svg { display: block; height: auto; }
    input, button, textarea, select { font: inherit; color: inherit; letter-spacing: inherit; }
    button { cursor: pointer; }
    table { border-collapse: collapse; }
    /* hidden="until-found" panels must stay rendered (content-visibility) so find-in-page can reveal them. */
    [hidden]:not([hidden="until-found"]) { display: none !important; }
}

/* ==========================================================================
   Base elements
   ========================================================================== */
@layer engine.base {
    html {
        font-size: 100%;
        scroll-padding-block-start: calc(var(--v-sticky-offset) + var(--v-space-s));
        background: var(--v-bg);
    }
    @media (prefers-reduced-motion: no-preference) {
        html { scroll-behavior: smooth; }
    }
    body {
        min-height: 100vh;
        display: flex;
        flex-direction: column;
        background: var(--v-bg);
        color: var(--v-text);
        font-family: var(--v-font-body);
        font-size: var(--v-step-0);
        line-height: var(--v-line-height);
        overflow-wrap: break-word;
        text-rendering: optimizeLegibility;
        -webkit-font-smoothing: antialiased;
    }
    :where(h1, h2, h3, h4, h5, h6, .v-h1, .v-h2, .v-h3, .v-h4) {
        font-family: var(--v-font-heading);
        font-weight: var(--v-heading-weight);
        line-height: var(--v-line-height-heading);
        color: var(--v-heading);
        text-wrap: balance;
    }
    :where(h1, .v-h1) { font-size: var(--v-step-5); }
    :where(h2, .v-h2) { font-size: var(--v-step-4); }
    :where(h3, .v-h3) { font-size: var(--v-step-3); }
    :where(h4, .v-h4) { font-size: var(--v-step-2); }
    :where(h5) { font-size: var(--v-step-1); }
    :where(h6) { font-size: var(--v-step-0); }
    /* Uppercase headings are opt-in for short display headings only. */
    .v-headings-upper :where(h1, h2, h3, .v-h1, .v-h2, .v-h3, .v-page-title) {
        text-transform: var(--v-heading-case);
        letter-spacing: var(--v-heading-tracking);
    }
    p, li { text-wrap: pretty; }

    a {
        color: var(--v-link);
        text-decoration-line: underline;
        text-decoration-thickness: max(1px, 0.07em);
        text-underline-offset: 0.18em;
    }
    a:hover { color: var(--v-link-hover); text-decoration-thickness: max(2px, 0.12em); }
    .v-links-subtle a { text-decoration-thickness: 1px; text-decoration-color: color-mix(in srgb, currentColor 60%, transparent); }
    .v-links-subtle a:hover { text-decoration-thickness: 2px; text-decoration-color: currentColor; }

    :focus-visible {
        outline: 3px solid var(--v-focus);
        outline-offset: 2px;
        box-shadow: 0 0 0 2px var(--v-focus-halo);
        border-radius: 1px;
    }
    :focus:not(:focus-visible) { outline: none; }
    main:focus { outline: none; }

    ::selection { background: var(--v-mark); color: var(--v-on-mark); }
    mark { background: var(--v-mark); color: var(--v-on-mark); padding-inline: 0.1em; border-radius: 2px; }
    strong, b { font-weight: 700; }
    small { font-size: var(--v-step-n1); }
    code, kbd, samp, pre { font-family: var(--v-font-mono); font-size: 0.9em; }
    :not(pre) > code { background: var(--v-surface-sunken); padding: 0.1em 0.35em; border-radius: var(--v-radius-sm); }
    pre { background: var(--v-surface-sunken); padding: var(--v-space-s); border-radius: var(--v-radius); overflow-x: auto; }
    hr { border: 0; border-block-start: 1px solid var(--v-border); margin-block: var(--v-space-l); }
    blockquote {
        border-inline-start: 4px solid var(--v-primary);
        padding-inline-start: var(--v-space-m);
        font-size: var(--v-step-1);
        color: var(--v-text);
    }
    figcaption { font-size: var(--v-step-n1); color: var(--v-text-muted); margin-block-start: var(--v-space-2xs); }
    ul, ol { padding-inline-start: 1.4em; }
    li + li { margin-block-start: 0.25em; }
    abbr[title] { text-decoration: underline dotted; cursor: help; }
    table { width: 100%; }
    th, td { text-align: start; padding: var(--v-space-2xs) var(--v-space-xs); border-block-end: 1px solid var(--v-border); vertical-align: top; }
    th { font-weight: 700; }
    caption { text-align: start; font-weight: 700; padding-block: var(--v-space-2xs); }
    details > summary { cursor: pointer; }

    /* Form controls: 3:1 borders (WCAG 1.4.11) and 44px targets. */
    :where(input:not([type=checkbox], [type=radio], [type=range], [type=color], [type=file], [type=submit], [type=button], [type=reset], [type=image]), select, textarea) {
        min-height: var(--v-touch);
        padding: 0.5em 0.75em;
        border: 1px solid var(--v-border-strong);
        border-radius: var(--v-radius-sm);
        background: var(--v-surface);
        color: var(--v-text);
        max-width: 100%;
    }
    :where(textarea) { min-height: 6em; }
    /* Drop-down selects draw their own arrow, set in from the edge (the
       native one sits against the border and ignores padding). List boxes
       (multiple, size > 1) keep the native look. */
    :where(select:not([multiple], [size]:not([size="1"]))) {
        appearance: none;
        padding-inline-end: 2.6em;
        background-image: var(--v-chevron);
        background-repeat: no-repeat;
        background-position: right 0.9em center;
        background-size: 1em;
    }
    :where(select:not([multiple], [size]:not([size="1"]))):dir(rtl) { background-position: left 0.9em center; }
    :where(input, select, textarea)::placeholder { color: var(--v-text-muted); opacity: 1; }
    :where(input[type=checkbox], input[type=radio]) { width: 1.15em; height: 1.15em; accent-color: var(--v-primary); vertical-align: -0.15em; }
    :where(label) { font-weight: 600; }
    :where(fieldset) { border: 1px solid var(--v-border); border-radius: var(--v-radius); padding: var(--v-space-s); }
    :where(legend) { font-weight: 700; padding-inline: var(--v-space-3xs); }

    /* Buttons. Bare <button>s get gentle defaults; .v-button is the full style. */
    /* .button/.v-button carry class specificity so they beat the plain `a` rule. */
    :where(button, input[type=submit], input[type=button], input[type=reset]), .button, .v-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.45em;
        min-height: var(--v-touch);
        padding: 0.5em 1.15em;
        border: 2px solid var(--v-primary);
        border-radius: var(--v-radius-button);
        background: var(--v-primary);
        color: var(--v-on-primary);
        font-weight: 600;
        line-height: 1.2;
        text-decoration: none;
        text-align: center;
        cursor: pointer;
        transition: background-color 0.15s var(--v-ease), border-color 0.15s var(--v-ease), color 0.15s var(--v-ease);
    }
    :where(button, input[type=submit], input[type=button]):hover, .button:hover, .v-button:hover {
        background: var(--v-primary-hover);
        border-color: var(--v-primary-hover);
        color: var(--v-on-primary-hover);
    }
    :where(button, input, .button, .v-button):disabled,
    :where(button, input, .button, .v-button)[aria-disabled=true] { opacity: 0.55; cursor: not-allowed; }
    .v-buttons-outline :where(.v-button:not(.v-button--secondary), input[type=submit], .button) {
        background: transparent;
        color: var(--v-primary-text);
    }
    .v-buttons-outline :where(.v-button:not(.v-button--secondary), input[type=submit], .button):hover {
        background: var(--v-primary);
        color: var(--v-on-primary);
    }
}

/* ==========================================================================
   Layout: page frame, header, navigation, footer
   ========================================================================== */
@layer engine.layout {
    .v-container {
        width: 100%;
        max-width: calc(var(--v-container) + 2 * var(--v-gutter));
        margin-inline: auto;
        padding-inline: var(--v-gutter);
    }
    .v-main { flex: 1 0 auto; padding-block-end: var(--v-space-2xl); }
    .v-main > .messages { max-width: calc(var(--v-container) + 2 * var(--v-gutter)); margin: var(--v-space-s) auto 0; padding-inline: var(--v-gutter); }

    .v-skip-link {
        position: absolute;
        inset-inline-start: var(--v-space-s);
        inset-block-start: var(--v-space-s);
        z-index: 1000;
        padding: var(--v-space-xs) var(--v-space-s);
        background: var(--v-focus);
        color: var(--v-focus-halo);
        font-weight: 700;
        border-radius: var(--v-radius-sm);
        transform: translateY(calc(-100% - 2 * var(--v-space-s)));
    }
    .v-skip-link:focus { transform: none; }

    /* Announcement bar */
    .v-topbar { background: var(--v-topbar-bg); color: var(--v-topbar-text); font-size: var(--v-step-n1); }
    .v-topbar__inner { padding-block: var(--v-space-2xs); text-align: center; }
    .v-topbar__inner > * { margin: 0; }
    .v-topbar a { color: inherit; }

    /* Header */
    .v-header {
        position: relative;
        z-index: 50;
        background: var(--v-header-bg);
        color: var(--v-header-text);
        border-block-end: 1px solid var(--v-header-border);
    }
    .v-sticky-header .v-header { position: sticky; inset-block-start: 0; }
    .v-header.is-stuck { box-shadow: var(--v-shadow-md); }
    .v-header__inner {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas: "brand tools" "search search";
        align-items: center;
        column-gap: var(--v-space-s);
        padding-block: var(--v-space-xs);
    }
    .v-brand { grid-area: brand; display: flex; flex-wrap: wrap; align-items: center; column-gap: var(--v-space-s); min-width: 0; }
    .v-brand__link {
        display: inline-flex;
        align-items: center;
        gap: var(--v-space-xs);
        min-height: var(--v-touch);
        color: inherit;
        text-decoration: none;
    }
    .v-brand__link:hover { color: inherit; }
    .v-brand__logo { height: var(--v-logo-height); width: auto; min-width: 0; max-width: min(18rem, 60vw, 100%); object-fit: contain; }
    .v-brand__logo--dark { display: none; }
    .v-brand__link { min-width: 0; max-width: 100%; }
    .v-brand__title { font-family: var(--v-font-heading); font-weight: var(--v-heading-weight); font-size: var(--v-step-2); line-height: 1.1; overflow-wrap: break-word; min-width: 0; }
    .v-brand__tagline { color: var(--v-header-muted); font-size: var(--v-step-n1); }
    .v-header__tools { grid-area: tools; display: flex; align-items: center; justify-content: flex-end; gap: var(--v-space-3xs); }
    .v-header a:not(.v-button) { color: inherit; }

    .v-icon-button, .v-menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.4em;
        min-width: var(--v-touch);
        min-height: var(--v-touch);
        padding: 0.4em;
        border: 1px solid transparent;
        border-radius: var(--v-radius-button);
        background: transparent;
        color: inherit;
        font-weight: 600;
    }
    .v-icon-button:hover, .v-menu-toggle:hover, .v-icon-button[aria-expanded=true] {
        background: var(--v-header-hover);
        border-color: var(--v-header-border);
        color: inherit;
    }
    .v-menu-toggle { padding-inline: 0.75em; border-color: var(--v-header-border); }
    .v-menu-toggle__close, .v-menu-toggle[aria-expanded=true] .v-menu-toggle__open { display: none; }
    .v-menu-toggle[aria-expanded=true] .v-menu-toggle__close { display: inline-flex; }
    .v-header__cta { margin-inline-start: var(--v-space-2xs); }
    .v-nav__cta { display: none; margin: var(--v-space-s) 0 0; }
    /* Phones: the header keeps icon buttons only, so the site name has room;
       the call to action moves into the menu. */
    @media (max-width: 30em) {
        .v-header__cta { display: none; }
        .v-nav__cta { display: block; }
        .v-menu-toggle { padding-inline: 0.4em; }
        .v-menu-toggle__label {
            position: absolute;
            width: 1px;
            height: 1px;
            overflow: hidden;
            clip-path: inset(50%);
            white-space: nowrap;
        }
    }
    .v-header:is([data-style=primary], [data-style=secondary], [data-style=dark]) .v-header__cta {
        background: var(--v-header-text);
        border-color: var(--v-header-text);
        color: var(--v-header-bg);
    }
    .v-icon { width: 1.25em; height: 1.25em; flex: none; }

    /* Header search */
    .v-search { grid-area: search; }
    .v-search-form { display: flex; align-items: stretch; width: 100%; }
    .v-search-form input[type=search] {
        flex: 1 1 auto;
        min-width: 0;
        border-start-end-radius: 0;
        border-end-end-radius: 0;
        background: var(--v-surface);
        color: var(--v-text);
    }
    .v-search-form__submit { border-start-start-radius: 0; border-end-start-radius: 0; padding-inline: 0.85em; }
    :root.js .v-search { display: none; }
    :root.js .v-search.is-open { display: block; padding-block: var(--v-space-xs) var(--v-space-2xs); }

    /* Light/dark picker */
    .v-scheme { position: relative; }
    :root:not(.js) .v-scheme { display: none; }
    .v-scheme__panel {
        position: absolute;
        inset-inline-end: 0;
        inset-block-start: calc(100% + var(--v-space-3xs));
        z-index: 60;
        min-width: 13rem;
        padding: var(--v-space-xs);
        background: var(--v-surface);
        color: var(--v-text);
        border: 1px solid var(--v-border);
        border-radius: var(--v-radius);
        box-shadow: var(--v-shadow-md);
    }
    :root.js .v-scheme__panel:not(.is-open) { display: none; }
    .v-scheme__panel fieldset { border: 0; padding: 0; margin: 0; }
    .v-scheme__panel legend { font-size: var(--v-step-n1); color: var(--v-text-muted); padding: 0 0 var(--v-space-3xs); }
    .v-scheme__panel label { display: flex; align-items: center; gap: 0.6em; min-height: var(--v-touch); padding-inline: var(--v-space-2xs); border-radius: var(--v-radius-sm); font-weight: 500; cursor: pointer; }
    .v-scheme__panel label:hover { background: var(--v-surface-alt); }

    /* Navigation (desktop: disclosure dropdowns; small screens: modal drawer) */
    .v-nav { grid-area: nav; }
    .v-nav ul { list-style: none; margin: 0; padding: 0; }
    .v-nav li { margin: 0; }
    .v-nav a, .v-nav li > span {
        display: flex;
        align-items: center;
        min-height: var(--v-touch);
        padding: 0.4em 0.6em;
        border-radius: var(--v-radius-sm);
        color: inherit;
        font-weight: 600;
        text-decoration: none;
    }
    .v-nav a:hover { background: var(--v-header-hover); text-decoration: underline; text-underline-offset: 0.25em; }
    .v-nav a[aria-current=page] { text-decoration: underline; text-decoration-thickness: 3px; text-decoration-color: var(--v-header-accent); text-underline-offset: 0.35em; }
    /* Ancestors of the current page (core marks their <li> active). */
    .v-nav li.active > a:not([aria-current]) { text-decoration: underline; text-decoration-thickness: 2px; text-decoration-color: var(--v-header-accent); text-underline-offset: 0.35em; }
    .v-nav li.has-submenu { display: flex; flex-wrap: wrap; align-items: center; }
    .submenu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: var(--v-touch);
        min-height: var(--v-touch);
        padding: 0;
        border: 1px solid transparent;
        background: transparent;
        color: inherit;
    }
    .submenu-toggle:hover { background: var(--v-header-hover); color: inherit; border-color: transparent; }
    .submenu-toggle::before {
        content: "";
        width: 0.55em;
        height: 0.55em;
        border-inline-end: 2px solid currentColor;
        border-block-end: 2px solid currentColor;
        transform: translateY(-25%) rotate(45deg);
        transition: transform 0.15s var(--v-ease);
    }
    .submenu-toggle[aria-expanded=true]::before { transform: translateY(15%) rotate(225deg); }
    :root.js .v-nav li.has-submenu > ul { display: none; flex-basis: 100%; }
    :root.js .v-nav .submenu-toggle[aria-expanded=true] + ul { display: block; }
    .v-nav__close { display: none; }

    /* Small screens and the "minimal" header: the menu is a modal drawer. */
    @media (max-width: 63.99em) {
        :root.js .v-nav { display: none; }
        .v-search-toggle { display: inline-flex; }
    }
    :root.js .v-nav.is-drawer {
        display: block;
        position: fixed;
        inset: 0;
        inset-inline-start: auto;
        z-index: 200;
        width: min(26rem, 100%);
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: var(--v-space-s);
        background: var(--v-surface);
        color: var(--v-text);
        box-shadow: var(--v-shadow-md);
        --v-header-hover: var(--v-surface-alt);
        --v-header-accent: var(--v-accent);
    }
    :root.js .v-nav.is-drawer .v-nav__close {
        display: inline-flex;
        margin-block-end: var(--v-space-xs);
        margin-inline-start: auto;
    }
    :root.js .v-nav.is-drawer > ul > li { border-block-end: 1px solid var(--v-border); }
    :root.js .v-nav.is-drawer li.has-submenu > ul { padding-inline-start: var(--v-space-s); padding-block-end: var(--v-space-2xs); }
    .v-nav-backdrop { position: fixed; inset: 0; z-index: 150; background: color-mix(in srgb, var(--v-overlay) 55%, transparent); }
    /* The header is a stacking context holding the drawer and its backdrop
       (backdrop 150 < drawer 200). While the drawer is open (it is modal),
       lift the header over everything on the page, fixed widgets included,
       so the backdrop dims the whole page and the drawer stays on top. */
    :root.v-nav-open .v-header { z-index: 2147483000; }
    :root.v-nav-open { overflow: hidden; }

    @media (min-width: 64em) {
        .v-header:not([data-layout=minimal]) .v-menu-toggle { display: none; }
        .v-header:not([data-layout=minimal]) .v-nav { display: block; }
        .v-header:not([data-layout=minimal]) .v-nav > ul { display: flex; flex-wrap: wrap; align-items: center; gap: var(--v-space-3xs); }
        .v-header:not([data-layout=minimal]) .v-nav > ul > li.has-submenu { position: relative; flex-wrap: nowrap; }
        .v-header:not([data-layout=minimal]) .v-nav > ul > li > ul {
            position: absolute;
            inset-block-start: 100%;
            inset-inline-start: 0;
            z-index: 60;
            min-width: 15rem;
            padding: var(--v-space-2xs);
            background: var(--v-surface);
            color: var(--v-text);
            border: 1px solid var(--v-border);
            border-radius: var(--v-radius);
            box-shadow: var(--v-shadow-md);
            --v-header-hover: var(--v-surface-alt);
        }
        .v-header:not([data-layout=minimal]) .v-nav > ul > li > ul ul { padding-inline-start: var(--v-space-s); }
        :root:not(.js) .v-header:not([data-layout=minimal]) .v-nav > ul > li > ul { display: none; }
        :root:not(.js) .v-header:not([data-layout=minimal]) .v-nav > ul > li:is(:hover, :focus-within) > ul { display: block; }

        /* Search: inline field, or a toggle that opens a full-width row. */
        .v-header__inner:has(.v-search[data-search-mode=field]) .v-search-toggle { display: none; }
        :root.js .v-search[data-search-mode=field] { display: block; }
        /* Wide enough for the placeholder in every bundled font at the site's
           text size (the widest needs 15.5em with the button). */
        .v-search[data-search-mode=field] { width: 16em; }
        .v-header:not([data-layout=minimal]) .v-nav .submenu-toggle { min-width: 2rem; }

        .v-header[data-layout=classic] .v-header__inner {
            grid-template-columns: auto minmax(0, 1fr) auto auto;
            grid-template-areas: "brand nav search tools";
        }
        .v-header[data-layout=classic] .v-header__inner:has(.v-search[data-search-mode=toggle]) {
            grid-template-columns: auto minmax(0, 1fr) auto;
            grid-template-areas: "brand nav tools" "search search search";
        }
        .v-header[data-layout=classic] .v-nav > ul { justify-content: flex-end; }
        /* Long menus don't fit beside the logo on mid-size screens: put the
           menu on its own row, like the "stacked" layout. */
        @media (max-width: 89.99em) {
            .v-header[data-layout=classic] .v-header__inner:has(.v-nav > ul > li:nth-child(6)) {
                grid-template-columns: minmax(0, 1fr) auto auto;
                grid-template-areas: "brand search tools" "nav nav nav";
            }
            .v-header[data-layout=classic] .v-header__inner:has(.v-nav > ul > li:nth-child(6)):has(.v-search[data-search-mode=toggle]) {
                grid-template-areas: "brand tools tools" "search search search" "nav nav nav";
            }
            .v-header[data-layout=classic] .v-header__inner:has(.v-nav > ul > li:nth-child(6)) .v-nav > ul {
                justify-content: flex-start;
                margin-inline-start: -0.6em;
            }
        }

        .v-header[data-layout=stacked] .v-header__inner {
            grid-template-columns: minmax(0, 1fr) auto auto;
            grid-template-areas: "brand search tools" "nav nav nav";
        }
        .v-header[data-layout=stacked] .v-header__inner:has(.v-search[data-search-mode=toggle]) {
            grid-template-areas: "brand tools tools" "search search search" "nav nav nav";
        }
        .v-header[data-layout=stacked] .v-nav { border-block-start: 1px solid var(--v-header-border); margin-block-start: var(--v-space-xs); padding-block-start: var(--v-space-3xs); }
        .v-header[data-layout=stacked] .v-nav > ul { margin-inline-start: -0.75em; }

        .v-header[data-layout=centered] .v-header__inner {
            grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
            grid-template-areas: "search brand tools" "nav nav nav";
            row-gap: var(--v-space-2xs);
        }
        .v-header[data-layout=centered] .v-header__inner:has(.v-search[data-search-mode=toggle]) {
            grid-template-areas: ". brand tools" "search search search" "nav nav nav";
        }
        .v-header[data-layout=centered] .v-brand { flex-direction: column; text-align: center; }
        .v-header[data-layout=centered] .v-search[data-search-mode=field] { justify-self: start; }
        .v-header[data-layout=centered] .v-nav > ul { justify-content: center; }

        .v-header[data-layout=minimal] .v-header__inner {
            grid-template-columns: minmax(0, 1fr) auto auto;
            grid-template-areas: "brand search tools";
        }
        .v-header[data-layout=minimal] .v-header__inner:has(.v-search[data-search-mode=toggle]) {
            grid-template-areas: "brand tools tools" "search search search";
        }
        :root.js .v-header[data-layout=minimal] .v-nav:not(.is-drawer) { display: none; }
    }

    /* Footer */
    .v-footer {
        background: var(--v-footer-bg);
        color: var(--v-footer-text);
        font-size: var(--v-step-n1);
        border-block-start: 1px solid var(--v-footer-border);
    }
    .v-footer a { color: inherit; }
    .v-footer :focus-visible { outline-color: var(--v-footer-text); box-shadow: 0 0 0 2px var(--v-footer-bg); }
    .v-footer__main { display: grid; gap: var(--v-space-l); padding-block: var(--v-space-xl) var(--v-space-l); }
    .v-footer__columns { display: grid; gap: var(--v-space-l); }
    .v-footer__column > * + *, .v-footer__about > * + * { margin-block-start: var(--v-space-xs); }
    .v-footer__column :is(h2, h3, h4) { color: inherit; font-size: var(--v-step-1); }
    .v-footer__title { font-family: var(--v-font-heading); font-weight: var(--v-heading-weight); font-size: var(--v-step-2); }
    .v-footer__about { max-width: 40rem; }
    .v-footer__nav-list { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--v-space-2xs) var(--v-space-m); }
    .v-footer__nav-list li { margin: 0; }
    .v-footer__nav-list a { display: inline-flex; align-items: center; min-height: 1.5rem; }
    .v-footer__bottom {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: var(--v-space-xs) var(--v-space-l);
        padding-block: var(--v-space-m);
        border-block-start: 1px solid var(--v-footer-border);
        color: var(--v-footer-muted);
    }
    .v-footer__help, .v-social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--v-space-2xs) var(--v-space-m); }
    .v-footer__help li, .v-social li { margin: 0; }
    .v-footer__help a { color: var(--v-footer-text); display: inline-flex; align-items: center; min-height: 1.5rem; }
    .v-social a {
        display: inline-flex;
        align-items: center;
        gap: 0.4em;
        min-height: 2rem;
        padding: 0.2em 0.7em;
        border: 1px solid var(--v-footer-border);
        border-radius: 999px;
        color: var(--v-footer-text);
        text-decoration: none;
    }
    .v-social a:hover { background: color-mix(in srgb, var(--v-footer-text) 12%, transparent); color: var(--v-footer-text); }
    .v-social .v-icon { width: 1em; height: 1em; }
    .v-footer__copyright { margin-inline-end: auto; }
    .v-back-to-top { display: inline-flex; align-items: center; gap: 0.35em; min-height: 1.5rem; color: var(--v-footer-text) !important; }
    .v-back-to-top .v-icon { width: 1em; height: 1em; }
    @media (min-width: 48em) {
        .v-footer__columns[data-count="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .v-footer__columns[data-count="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
        .v-footer__main:has(.v-footer__nav) { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); }
    }

    .v-partners { background: var(--v-surface-alt); color: var(--v-text); padding-block: var(--v-space-l); text-align: center; }
    .v-partners__heading { font-size: var(--v-step-0); font-family: var(--v-font-body); font-weight: 700; color: var(--v-text-muted); margin-block-end: var(--v-space-s); }
    .v-partners__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--v-space-m) var(--v-space-xl); }
    .v-partners__list li { margin: 0; }
    .v-partners__list img { max-height: 3.5rem; width: auto; max-width: 12rem; object-fit: contain; }
    .v-partners :focus-visible { outline-color: var(--v-focus); box-shadow: 0 0 0 2px var(--v-focus-halo); }
}

/* ==========================================================================
   Components
   ========================================================================== */
@layer engine.components {
    .v-button--secondary { background: var(--v-secondary); border-color: var(--v-secondary); color: var(--v-on-secondary); }
    .v-button--secondary:hover { background: var(--v-secondary-hover); border-color: var(--v-secondary-hover); color: var(--v-on-secondary-hover); }
    .v-button--outline, .v-button.v-button--outline { background: transparent; color: var(--v-primary-text); border-color: currentColor; }
    .v-button--outline:hover, .v-button.v-button--outline:hover { background: var(--v-primary-subtle); color: var(--v-on-primary-subtle); border-color: currentColor; }
    .v-button--small { min-height: 2.25rem; padding: 0.3em 0.8em; font-size: var(--v-step-n1); }
    .v-button--large { min-height: 3.25rem; padding: 0.7em 1.6em; font-size: var(--v-step-1); }
    .v-button-row { display: flex; flex-wrap: wrap; gap: var(--v-space-2xs); align-items: center; }
    .v-icon { display: inline-block; vertical-align: -0.2em; }

    /* Omeka's icon-font classes on public pages (advanced search add and
       remove buttons, value annotation and private markers) are empty
       elements meant to show an admin icon font. Draw them as masked SVG
       in the current text color instead; they keep their own accessible
       names (aria-label and title). */
    :is(.o-icon-add, .o-icon-delete, .o-icon-close, .o-icon-annotation, .o-icon-private) {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        vertical-align: middle;
    }
    :is(.o-icon-add, .o-icon-delete, .o-icon-close, .o-icon-annotation, .o-icon-private)::before {
        content: "";
        flex: none;
        width: 1.25em;
        height: 1.25em;
        background: currentColor;
        -webkit-mask: var(--v-o-icon) center / contain no-repeat;
        mask: var(--v-o-icon) center / contain no-repeat;
    }
    .o-icon-add { --v-o-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); }
    .o-icon-delete { --v-o-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E"); }
    .o-icon-close { --v-o-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E"); }
    .o-icon-annotation { --v-o-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 15a2 2 0 0 1-2 2H8l-4 4V6a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2Z'/%3E%3Cpath d='M8 9h8M8 13h5'/%3E%3C/svg%3E"); }
    .o-icon-private { --v-o-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E"); }

    /* Omeka's expand/collapse toggles (advanced search help, value
       annotations): core's global.js swaps a.expand and a.collapse on
       click. Show the state with a chevron, and hide the content while
       collapsed, only when scripts run so it stays readable without them. */
    a:is(.expand, .collapse) {
        --v-o-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 1.75rem;
        min-height: 1.75rem;
        vertical-align: middle;
        border-radius: var(--v-radius-sm);
        color: var(--v-link);
    }
    a:is(.expand, .collapse)::after {
        content: "";
        width: 1.15em;
        height: 1.15em;
        background: currentColor;
        -webkit-mask: var(--v-o-icon) center / contain no-repeat;
        mask: var(--v-o-icon) center / contain no-repeat;
        transition: transform 0.15s var(--v-ease);
    }
    a.expand::after { transform: rotate(-90deg); }
    a.expand:dir(rtl)::after { transform: rotate(90deg); }
    .v-icon--directional:dir(rtl) { transform: scaleX(-1); }
    :root.js a.expand + .collapsible { display: none; }
    .field-meta .field-description { margin-block: var(--v-space-3xs) var(--v-space-2xs); color: var(--v-text-muted); font-size: var(--v-step-n1); }
    /* Grouped fields label themselves with a span: match real labels. */
    .field-meta > .label { font-weight: 600; }

    @media (forced-colors: active) {
        :is(.o-icon-add, .o-icon-delete, .o-icon-annotation, .o-icon-private)::before,
        a:is(.expand, .collapse)::after { forced-color-adjust: none; background: CanvasText; }
        :is(button, .button):is(.o-icon-add, .o-icon-delete)::before { background: ButtonText; }
        a:is(.expand, .collapse)::after { background: LinkText; }
    }

    .v-kicker {
        font-size: var(--v-step-n1);
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: var(--v-primary-text);
    }
    .v-lead { font-size: var(--v-step-1); line-height: 1.5; }
    .v-text-muted { color: var(--v-text-muted); }
    .v-flow > * + * { margin-block-start: var(--v-flow-space, 1em); }
    .v-measure { max-width: var(--v-measure); }

    /* Breadcrumbs */
    .v-breadcrumbs { font-size: var(--v-step-n1); margin-block: var(--v-space-s) var(--v-space-2xs); }
    .v-breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; }
    .v-breadcrumbs li { margin: 0; display: inline-flex; align-items: center; min-height: 1.5rem; }
    .v-breadcrumbs li + li::before { content: "/" / ""; margin-inline: 0.5em; color: var(--v-text-muted); }
    .v-breadcrumbs [aria-current] { color: var(--v-text-muted); }

    /* Messages (Omeka flash messages and the style book) */
    .messages { list-style: none; padding: 0; display: grid; gap: var(--v-space-2xs); }
    .messages li {
        margin: 0;
        padding: var(--v-space-xs) var(--v-space-s);
        border-inline-start: 4px solid currentColor;
        border-radius: var(--v-radius-sm);
        background: var(--v-notice-info-bg);
        color: var(--v-notice-info);
        font-weight: 600;
    }
    .messages .success { background: var(--v-notice-success-bg); color: var(--v-notice-success); }
    .messages .warning { background: var(--v-notice-warning-bg); color: var(--v-notice-warning); }
    .messages .error { background: var(--v-notice-danger-bg); color: var(--v-notice-danger); }

    /* Pagination */
    .v-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--v-space-xs) var(--v-space-m); }
    .v-pagination__count { color: var(--v-text-muted); font-size: var(--v-step-n1); }
    .v-pagination__controls { display: flex; flex-wrap: wrap; align-items: center; gap: var(--v-space-2xs) var(--v-space-s); }
    .v-pagination__step { display: inline-flex; align-items: center; gap: 0.25em; min-height: var(--v-touch); padding-inline: 0.5em; font-weight: 600; }
    .v-pagination__jump { display: inline-flex; align-items: center; gap: 0.5em; }
    .v-pagination__jump input { width: 4.5em; }
    .v-pagination__jump label { font-weight: 500; }

    /* Browse pages */
    .v-browse__header { margin-block: var(--v-space-s) var(--v-space-m); display: grid; gap: var(--v-space-3xs); }
    .v-browse__subheading { margin-block: var(--v-space-l) var(--v-space-s); font-size: var(--v-step-3); }
    .v-browse-controls {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: var(--v-space-s);
        padding-block: var(--v-space-xs);
        margin-block-end: var(--v-space-m);
        border-block: 1px solid var(--v-border);
    }
    .v-browse-controls .v-pagination__controls { display: none; }
    .v-browse-controls__tools { display: flex; flex-wrap: wrap; align-items: center; gap: var(--v-space-xs) var(--v-space-m); }
    .v-browse-controls__advanced { display: inline-flex; align-items: center; gap: 0.35em; min-height: var(--v-touch); }
    .v-browse-controls__advanced .v-icon { width: 1em; height: 1em; }
    .v-browse > .v-pagination { margin-block-start: var(--v-space-l); padding-block-start: var(--v-space-s); border-block-start: 1px solid var(--v-border); }
    .v-sort { display: flex; flex-wrap: wrap; align-items: center; gap: var(--v-space-2xs); }
    .v-sort label { font-weight: 500; }
    .v-layout-switch { display: inline-flex; border: 1px solid var(--v-border-strong); border-radius: var(--v-radius-button); overflow: hidden; }
    .v-layout-switch button {
        min-height: 2.5rem;
        padding: 0.3em 0.8em;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: var(--v-text);
        font-weight: 500;
    }
    .v-layout-switch button + button { border-inline-start: 1px solid var(--v-border-strong); }
    .v-layout-switch button:hover { background: var(--v-surface-alt); color: var(--v-text); }
    .v-layout-switch button[aria-pressed=true] { background: var(--v-primary); color: var(--v-on-primary); }
    .v-layout-switch .v-icon { width: 1.1em; height: 1.1em; }
    .v-empty { padding: var(--v-space-xl) var(--v-space-m); text-align: center; background: var(--v-surface-alt); border-radius: var(--v-radius); }
    .search-filters, .v-browse .search-filters { margin-block-end: var(--v-space-s); }
    /* Each filter's values as chips: several item sets read as several. */
    .search-filters .filter { display: flex; flex-wrap: wrap; align-items: center; gap: var(--v-space-3xs) var(--v-space-2xs); }
    .search-filters .filter + .filter { margin-block-start: var(--v-space-2xs); }
    .search-filters .filter-label { color: var(--v-text-muted); }
    .search-filters .filter-value {
        padding: 0.1em 0.65em;
        border-radius: 999px;
        background: var(--v-surface-sunken);
        border: 1px solid var(--v-border);
        font-size: var(--v-step-n1);
        font-weight: 600;
    }

    /* Results: grid of cards, or list rows */
    .v-results {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(min(var(--v-grid-min), 100%), 1fr));
        gap: var(--v-space-m);
    }
    .v-results > li { margin: 0; }
    .v-card {
        position: relative;
        display: flex;
        flex-direction: column;
        min-width: 0;
        background: var(--v-surface);
        border: 1px solid var(--v-border);
        border-radius: var(--v-radius);
        overflow: hidden;
        box-shadow: var(--v-shadow-sm);
        transition: box-shadow 0.2s var(--v-ease), transform 0.2s var(--v-ease);
    }
    .v-card:hover { box-shadow: var(--v-shadow-md); }
    .v-card:has(.v-card__link:focus-visible) { outline: 3px solid var(--v-focus); outline-offset: 2px; }
    .v-card__link:focus-visible { outline: none; box-shadow: none; }
    .v-card__media {
        aspect-ratio: var(--v-card-ratio);
        background: var(--v-surface-sunken);
        overflow: hidden;
    }
    .v-card__media img { width: 100%; height: 100%; object-fit: var(--v-card-fit); }
    .v-card__media--empty { display: grid; place-items: center; color: var(--v-text-muted); aspect-ratio: 4 / 3; }
    @media (max-width: 40em) {
        .v-card__media--empty { aspect-ratio: 5 / 2; }
    }
    .v-card__placeholder { width: 2.5rem; height: 2.5rem; opacity: 0.7; }
    .v-card__body { display: grid; gap: var(--v-space-3xs); padding: var(--v-space-s); }
    .v-card__title { font-size: var(--v-step-1); line-height: 1.25; }
    .v-card__link { color: inherit; text-decoration: none; }
    .v-card__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
    .v-card__link:hover { color: var(--v-link-hover); text-decoration: underline; }
    .v-card:hover .v-card__link { text-decoration: underline; text-decoration-thickness: 2px; }
    .v-card__meta { font-size: var(--v-step-n1); color: var(--v-text-muted); }
    .v-card__text { font-size: var(--v-step-n1); color: var(--v-text); }
    .v-card__chips { margin-block-start: var(--v-space-3xs); }
    [data-lines="3"], [data-lines="5"] { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
    [data-lines="3"] { -webkit-line-clamp: 3; line-clamp: 3; }
    [data-lines="5"] { -webkit-line-clamp: 5; line-clamp: 5; }

    .v-cards-minimal .v-card { background: transparent; border-color: transparent; box-shadow: none; overflow: visible; }
    .v-cards-minimal .v-card__media { border-radius: var(--v-radius); }
    .v-cards-minimal .v-card__body { padding-inline: 0; }
    .v-cards-overlay .v-results[data-layout=grid] .v-card:has(.v-card__media img) { display: grid; }
    .v-cards-overlay .v-results[data-layout=grid] .v-card:has(.v-card__media img) > * { grid-area: 1 / 1; }
    .v-cards-overlay .v-results[data-layout=grid] .v-card:has(.v-card__media img) .v-card__body {
        align-self: end;
        /* A scrim at least 60% dark keeps white text above 4.5:1 on any image. */
        background: linear-gradient(to top, rgb(0 0 0 / 0.78), rgb(0 0 0 / 0.62) 70%, rgb(0 0 0 / 0));
        color: #fff;
        padding-block-start: var(--v-space-xl);
        --v-text: #fff;
        --v-text-muted: #fff;
        --v-link-hover: #fff;
    }

    /* List layout (chosen in settings or by the visitor). */
    .v-results[data-layout=list]:not([data-switchable]),
    :root:not([data-browse-layout=grid]) .v-results[data-switchable][data-layout=list],
    :root[data-browse-layout=list] .v-results[data-switchable] {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--v-space-s);
        --v-list: 1;
    }
    :is(.v-results[data-layout=list]:not([data-switchable]), :root:not([data-browse-layout=grid]) .v-results[data-switchable][data-layout=list], :root[data-browse-layout=list] .v-results[data-switchable]) .v-card {
        flex-direction: row;
        align-items: stretch;
    }
    :is(.v-results[data-layout=list]:not([data-switchable]), :root:not([data-browse-layout=grid]) .v-results[data-switchable][data-layout=list], :root[data-browse-layout=list] .v-results[data-switchable]) .v-card__media {
        flex: 0 0 clamp(5.5rem, 22%, 11rem);
        aspect-ratio: 1;
    }
    /* Minimal cards have no padding of their own: keep the text off the image. */
    .v-cards-minimal :is(.v-results[data-layout=list]:not([data-switchable]), :root:not([data-browse-layout=grid]) .v-results[data-switchable][data-layout=list], :root[data-browse-layout=list] .v-results[data-switchable]) .v-card__body {
        padding: var(--v-space-3xs) 0 var(--v-space-3xs) var(--v-space-m);
    }
    /* A description shown "in list view only". */
    .v-card__text[data-list-only] { display: none; }
    :is(.v-results[data-layout=list]:not([data-switchable]), :root:not([data-browse-layout=grid]) .v-results[data-switchable][data-layout=list], :root[data-browse-layout=list] .v-results[data-switchable]) .v-card__text[data-list-only] {
        display: -webkit-box;
    }

    .v-results--featured { grid-template-columns: repeat(auto-fill, minmax(min(var(--v-grid-min), 100%), 1fr)); }
    @media (min-width: 48em) {
        .v-results--featured > li:first-child { grid-column: span 2; grid-row: span 2; }
        .v-results--featured > li:first-child .v-card__title { font-size: var(--v-step-3); }
    }

    /* Panels (sidebar blocks) */
    .v-panel {
        padding: var(--v-space-s);
        background: var(--v-surface);
        border: 1px solid var(--v-border);
        border-radius: var(--v-radius);
    }
    .v-panel__title {
        display: flex;
        align-items: center;
        gap: 0.45em;
        font-size: var(--v-step-1);
        margin-block-end: var(--v-space-xs);
    }
    .v-panel__title .v-icon { color: var(--v-primary-text); }
    .v-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--v-space-2xs); }
    .v-chips li { margin: 0; }
    .v-chip {
        display: inline-flex;
        align-items: center;
        min-height: 2rem;
        padding: 0.15em 0.75em;
        border-radius: 999px;
        background: var(--v-primary-subtle);
        color: var(--v-on-primary-subtle);
        font-size: var(--v-step-n1);
        font-weight: 600;
        text-decoration: none;
    }
    .v-chip:hover { text-decoration: underline; color: var(--v-on-primary-subtle); }
    .v-citation__text { font-size: var(--v-step-n1); margin-block-end: var(--v-space-xs); }
    .v-share__url { display: grid; gap: var(--v-space-3xs); margin-block-end: var(--v-space-xs); font-size: var(--v-step-n1); }
    .v-share__url input { width: 100%; font-size: var(--v-step-n1); }
    .v-rights__list, .v-downloads__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--v-space-xs); }
    .v-rights__list li, .v-downloads__list li { margin: 0; }
    .v-rights__label { font-weight: 700; }
    .v-rights__help { font-size: var(--v-step-n1); color: var(--v-text-muted); }
    /* Wall label: an artwork's caption, the way a museum hangs it. */
    .v-wall-label { display: grid; gap: var(--v-space-3xs); align-content: start; font-size: var(--v-step-n1); }
    .v-wall-label > p { margin: 0; }
    .v-wall-label__creator { font-size: var(--v-step-0); font-weight: 700; }
    .v-wall-label__creator a { color: inherit; }
    .v-wall-label__life { display: block; font-weight: 400; font-size: var(--v-step-n1); color: var(--v-text-muted); }
    .v-wall-label__creator + .v-wall-label__title { margin-block-start: var(--v-space-2xs); }
    .v-wall-label__title { font-size: var(--v-step-0); }
    .v-wall-label__title cite { font-style: italic; }
    .v-wall-label__credit { margin-block-start: var(--v-space-2xs); }
    .v-wall-label__credit, .v-wall-label__number { color: var(--v-text-muted); }
    .v-wall-label__text {
        max-width: var(--v-measure);
        margin-block-start: var(--v-space-xs);
        padding-block-start: var(--v-space-xs);
        border-block-start: 1px solid var(--v-border);
        font-size: var(--v-step-0);
    }
    .v-wall-label__text > * + * { margin-block-start: 0.75em; }
    .v-downloads__list a { display: grid; padding: var(--v-space-2xs) 0; }
    .v-downloads__name { font-weight: 600; }
    .v-downloads__meta { font-size: var(--v-step-n1); color: var(--v-text-muted); }
    /* Copy and share feedback: the button swaps its icon and label, and the
       status line below shows the message as a small notice. Notice colors
       are fixed text/background pairs, readable in light and dark mode. */
    .v-copy-status { margin: 0; font-size: var(--v-step-n1); }
    .v-copy-status:not(:empty) {
        display: block;
        width: fit-content;
        max-width: 100%;
        margin-block-start: var(--v-space-2xs);
        padding: 0.3em 0.7em;
        border-radius: var(--v-radius-sm);
        background: var(--v-notice-info-bg);
        color: var(--v-notice-info);
    }
    .v-copy-status[data-tone="success"]:not(:empty) { background: var(--v-notice-success-bg); color: var(--v-notice-success); }
    .v-copy-status[data-tone="warning"]:not(:empty) { background: var(--v-notice-warning-bg); color: var(--v-notice-warning); }
    .v-button.v-copy .v-copy__done { display: none; }
    .v-button.v-copy.is-copied .v-copy__icon { display: none; }
    .v-button.v-copy.is-copied .v-copy__done { display: inline-block; }
    @media (prefers-reduced-motion: no-preference) {
        .v-copy-status:not(:empty), .v-button.v-copy.is-copied .v-copy__done { animation: v-copy-pop 0.18s ease-out; }
        @keyframes v-copy-pop { from { opacity: 0; transform: translateY(2px); } }
    }

    /* Gallery and lightbox */
    .v-gallery__feature { margin: 0; }
    .v-gallery__zoom { position: relative; display: block; background: var(--v-surface-sunken); border-radius: var(--v-radius); overflow: hidden; }
    .v-gallery__image { width: 100%; max-height: min(75vh, 48rem); object-fit: contain; }
    .v-gallery__zoom-label {
        position: absolute;
        inset-inline-end: var(--v-space-xs);
        inset-block-end: var(--v-space-xs);
        display: inline-flex;
        align-items: center;
        gap: 0.35em;
        padding: 0.35em 0.7em;
        border-radius: 999px;
        background: rgb(0 0 0 / 0.72);
        color: #fff;
        font-size: var(--v-step-n1);
        font-weight: 600;
    }
    .v-gallery__render { background: var(--v-surface-sunken); border-radius: var(--v-radius); padding: var(--v-space-s); }
    .v-gallery__render :is(img, video) { margin-inline: auto; }
    .v-gallery__caption { font-size: var(--v-step-n1); }
    .v-gallery__heading { font-size: var(--v-step-1); margin-block: var(--v-space-m) var(--v-space-xs); }
    .v-gallery__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(8rem, 100%), 1fr)); gap: var(--v-space-xs); }
    .v-gallery__grid--block { grid-template-columns: repeat(auto-fill, minmax(min(12rem, 100%), 1fr)); gap: var(--v-space-s); }
    .v-gallery__grid li { margin: 0; }
    .v-gallery__grid figure { margin: 0; }
    .v-gallery__grid a { display: block; color: inherit; }
    .v-gallery__grid img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--v-radius-sm); background: var(--v-surface-sunken); }
    .v-gallery__grid--block img { aspect-ratio: 4 / 3; }
    .v-gallery__file { display: grid !important; gap: var(--v-space-3xs); font-size: var(--v-step-n1); }
    .v-gallery__file .v-icon { width: 100%; height: auto; aspect-ratio: 1; padding: 25%; background: var(--v-surface-sunken); border-radius: var(--v-radius-sm); }

    .lightbox {
        width: min(100vw - 2rem, 80rem);
        max-height: calc(100vh - 2rem);
        padding: var(--v-space-s);
        border: 0;
        border-radius: var(--v-radius);
        background: #0b0d10;
        color: #fff;
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-rows: auto minmax(0, 1fr) auto;
        gap: var(--v-space-xs);
        --v-focus: #fff;
        --v-focus-halo: #000;
    }
    .lightbox:not([open]) { display: none; }
    .lightbox::backdrop { background: rgb(0 0 0 / 0.85); }
    .lightbox__figure { grid-column: 1 / -1; grid-row: 2; margin: 0; display: grid; place-items: center; min-height: 0; }
    .lightbox__figure img { max-width: 100%; max-height: calc(100vh - 12rem); object-fit: contain; }
    .lightbox__figure figcaption { color: #e8e8e8; text-align: center; }
    .lightbox__counter { grid-column: 1 / 3; grid-row: 1; align-self: center; color: #e8e8e8; font-size: var(--v-step-n1); margin: 0; }
    .lightbox button { background: #fff; color: #0b0d10; border-color: #fff; }
    .lightbox button:hover { background: #d9d9d9; border-color: #d9d9d9; color: #0b0d10; }
    .lightbox__close { grid-column: 3; grid-row: 1; justify-self: end; }
    .lightbox__prev { grid-column: 1; grid-row: 3; }
    .lightbox__next { grid-column: 3; grid-row: 3; }

    /* Tables */
    .v-table-wrap { overflow-x: auto; margin-block: var(--v-space-s); }
    .v-table thead th { background: var(--v-surface-alt); }
}

/* ==========================================================================
   Content: pages, blocks, sections, block templates, resource pages
   ========================================================================== */
@layer engine.content {
    .v-page__header { margin-block: var(--v-space-m) var(--v-space-s); }
    .v-page-title { font-size: var(--v-step-5); }
    .v-display-title { font-size: var(--v-step-6); letter-spacing: -0.01em; }
    .v-subnav { margin-block-start: var(--v-space-xl); }
    .v-subnav__heading { font-size: var(--v-step-2); margin-block-end: var(--v-space-s); }
    .v-subnav ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(16rem, 100%), 1fr)); gap: var(--v-space-s); }
    .v-subnav ul ul { display: none; }
    .v-subnav li { margin: 0; }
    .v-subnav a {
        display: flex;
        align-items: center;
        min-height: var(--v-touch);
        height: 100%;
        padding: var(--v-space-s) var(--v-space-m);
        background: var(--v-surface);
        border: 1px solid var(--v-border);
        border-radius: var(--v-radius);
        box-shadow: var(--v-shadow-sm);
        color: var(--v-text);
        font-weight: 700;
        text-decoration: none;
    }
    .v-subnav a:hover { border-color: var(--v-primary); color: var(--v-link); text-decoration: underline; }
    .v-page-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--v-space-s); }
    .v-page-steps__link {
        display: grid;
        gap: var(--v-space-3xs);
        padding: var(--v-space-s) var(--v-space-m);
        border: 1px solid var(--v-border);
        border-radius: var(--v-radius);
        text-decoration: none;
        color: var(--v-text);
    }
    .v-page-steps__link:hover { border-color: var(--v-primary); }
    .v-page-steps__link:hover .v-page-steps__title { text-decoration: underline; }
    .v-page-steps__link--next { grid-column: 2; text-align: end; }
    .v-page-steps__label { display: inline-flex; align-items: center; gap: 0.25em; font-size: var(--v-step-n1); color: var(--v-text-muted); }
    .v-page-steps__link--next .v-page-steps__label { justify-content: flex-end; }
    .v-page-steps__label .v-icon { width: 1em; height: 1em; }
    .v-page-steps__title { font-weight: 700; color: var(--v-link); }

    /* Block flow: every block is contained; sections may run full width. */
    .v-blocks { --v-flow-space: var(--v-space-l); }
    .v-blocks > .blocks-inner { display: flow-root; }
    /* Core's unlayered `.page-layout-normal .block { margin: 1rem 0 }` would
       beat these layered rules, so block margins use !important (an
       important declaration in a layer outranks unlayered normal ones). */
    .v-blocks > .page-layout-normal > .block {
        width: min(100% - 2 * var(--v-gutter), var(--v-container));
        margin: 0 auto !important;
    }
    .v-blocks > .page-layout-normal > .block + .block { margin-block-start: var(--v-space-l) !important; }
    .v-blocks > .page-layout-normal > .block:first-child { margin-block-start: var(--v-space-s) !important; }
    .v-blocks .page-layout-normal .block-blockGroup > .block { margin: 0 !important; }
    .v-blocks .page-layout-normal .block-blockGroup > .block + .block { margin-block-start: var(--v-space-m) !important; }
    /* Floated (left/right aligned) blocks stay inside the content column. */
    .v-blocks > .page-layout-normal > .block.block-layout-alignment-block-left { margin: 0 var(--v-space-m) var(--v-space-s) var(--v-bleed) !important; }
    .v-blocks > .page-layout-normal > .block.block-layout-alignment-block-right { margin: 0 var(--v-bleed) var(--v-space-s) var(--v-space-m) !important; }
    .v-blocks > .page-layout-grid { width: min(100% - 2 * var(--v-gutter), var(--v-container)); margin-inline: auto; }
    .v-blocks .block-html > :where(p, ul, ol, dl, h2, h3, h4, h5, h6, blockquote, table) { max-width: var(--v-measure); }
    .v-blocks .block-html > * + * { margin-block-start: 1em; }
    .v-blocks .block-html > :where(h2, h3, h4) { margin-block-start: 1.5em; }
    .v-blocks .block-html > :first-child { margin-block-start: 0; }

    /* oEmbed: framed embeds of known size keep their aspect ratio as the
       column narrows (common/block-layout/oembed.phtml sets the ratio). */
    .v-embed--ratio { position: relative; aspect-ratio: var(--v-embed-ratio, 16 / 9); }
    .v-embed--ratio > iframe { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; border: 0; }
    .v-embed iframe { border-radius: var(--v-radius); }
    .v-embed > :where(blockquote, div) { margin-inline: auto; }

    /* IIIF blocks (core): an OpenSeadragon area and a Mirador frame with
       fixed inline heights; scaled to the screen and framed like media. */
    .block-iiifImage > [id^="iiif-image-"] {
        block-size: clamp(18rem, 60vh, 40rem) !important;
        background: var(--v-surface-sunken);
        border: 1px solid var(--v-border);
        border-radius: var(--v-radius);
        overflow: hidden;
    }
    .block-iiifPresentation > iframe {
        display: block;
        inline-size: 100% !important;
        block-size: clamp(24rem, 80vh, 44rem) !important;
        border: 1px solid var(--v-border);
        border-radius: var(--v-radius);
        background: var(--v-surface-sunken);
    }
    :where(.block-iiifImage, .block-iiifPresentation) > h3 { margin-block-end: var(--v-space-2xs); }

    /* Page date/time block */
    .page-date-time { display: flex; flex-wrap: wrap; gap: 0.25em 1.5em; margin: 0; color: var(--v-text-muted); font-size: var(--v-step-n1); }
    .page-date-time .property { font-weight: 600; }
    .v-blocks .block-layout-alignment-text-center > :where(p, ul, ol, h2, h3, h4, blockquote) { margin-inline: auto; }

    /* Width modifiers (block "Class" field). */
    .v-blocks > .page-layout-normal > .block:is(.section-narrow) { width: min(100% - 2 * var(--v-gutter), var(--v-measure)); }
    .v-blocks > .page-layout-normal > .block:is(.section-wide) { width: min(100% - 2 * var(--v-gutter), calc(var(--v-container) + 12rem)); }
    .v-blocks > .page-layout-normal > .block:is(.section-full, .section-tint, .section-primary, .section-secondary, .section-accent, .section-dark, .v-has-bg-image):not(.section-contained),
    .v-blocks > .page-layout-normal > .block:has(> .v-hero):not(.section-contained) {
        width: 100%;
        padding-inline: var(--v-bleed);
    }
    .v-blocks > .page-layout-normal > .block.block-blockGroup:is(.section-full, .section-tint, .section-primary, .section-secondary, .section-accent, .section-dark, .v-has-bg-image):not(.section-contained) > .block {
        width: auto;
        margin-inline: 0;
    }
    .v-blocks > .page-layout-normal > .block:has(> .v-hero):not(.section-contained) { padding-inline: 0; }

    /* Section colors. Tokens are re-pointed so text, links and buttons
       inside stay readable (each pair is contrast-checked by the theme). */
    .section-tint, .section-primary, .section-secondary, .section-accent, .section-dark, .v-has-bg-color, .v-has-bg-image {
        padding-block: var(--v-space-xl);
        color: var(--v-text);
    }
    .section-contained { padding-inline: var(--v-space-l); border-radius: var(--v-radius); }
    .v-has-bg-color:not(:is(.section-full, .section-wide)) { padding-inline: var(--v-space-l); border-radius: var(--v-radius); }
    .section-tint { background: var(--v-surface-alt); }
    .section-primary { --v-sec-bg: var(--v-primary); --v-sec-fg: var(--v-on-primary); }
    .section-secondary { --v-sec-bg: var(--v-secondary); --v-sec-fg: var(--v-on-secondary); }
    .section-accent { --v-sec-bg: var(--v-accent); --v-sec-fg: var(--v-on-accent); }
    .section-dark { --v-sec-bg: var(--v-dark); --v-sec-fg: var(--v-on-dark); }
    :is(.section-primary, .section-secondary, .section-accent, .section-dark) {
        background: var(--v-sec-bg);
        --v-text: var(--v-sec-fg);
        --v-text-muted: var(--v-sec-fg);
        --v-heading: var(--v-sec-fg);
        --v-link: var(--v-sec-fg);
        --v-link-hover: var(--v-sec-fg);
        --v-primary-text: var(--v-sec-fg);
        --v-border: color-mix(in srgb, var(--v-sec-fg) 30%, transparent);
        --v-focus: var(--v-sec-fg);
        --v-focus-halo: var(--v-sec-bg);
        color: var(--v-sec-fg);
    }
    :is(.section-primary, .section-secondary, .section-accent, .section-dark) :where(.v-button, button, .button, input[type=submit]):not(.v-button--outline) {
        background: var(--v-sec-fg);
        border-color: var(--v-sec-fg);
        color: var(--v-sec-bg);
    }
    :is(.section-primary, .section-secondary, .section-accent, .section-dark) :where(.v-button, button, .button):hover {
        background: transparent;
        color: var(--v-sec-fg);
    }
    :is(.section-primary, .section-secondary, .section-accent, .section-dark) .v-card { --v-text: var(--v-sec-fg); }
    .v-has-bg-color :where(h1, h2, h3, h4, h5, h6) { color: var(--v-heading); }

    /* Background images: a 60% scrim guarantees white text over any photo. */
    .v-has-bg-image {
        position: relative;
        isolation: isolate;
        background-size: cover;
        background-position: center;
        min-height: 20rem;
        display: grid;
        align-content: center;
        --v-text: #fff;
        --v-text-muted: #fff;
        --v-heading: #fff;
        --v-link: #fff;
        --v-link-hover: #fff;
        --v-focus: #fff;
        --v-focus-halo: #000;
        color: #fff;
    }
    .v-has-bg-image::before { content: ""; position: absolute; inset: 0; z-index: -1; background: color-mix(in srgb, var(--v-overlay) 62%, rgb(0 0 0 / 0.62)); }
    .v-has-bg-image :where(.v-button, .button):not(.v-button--outline) { background: #fff; border-color: #fff; color: #111; }

    /* Block templates: text */
    .v-callout {
        padding: var(--v-space-m);
        border-inline-start: 5px solid var(--v-primary);
        border-radius: var(--v-radius-sm);
        background: var(--v-primary-subtle);
        color: var(--v-text);
        max-width: var(--v-measure);
    }
    .v-callout a { color: var(--v-on-primary-subtle); }
    .v-card-box { padding: var(--v-space-m); background: var(--v-surface); border: 1px solid var(--v-border); border-radius: var(--v-radius); box-shadow: var(--v-shadow-sm); max-width: var(--v-measure); }
    .v-columns { columns: 2 22rem; column-gap: var(--v-space-xl); }
    .v-columns > * { break-inside: avoid; }
    .v-columns > :is(h2, h3, h4) { break-after: avoid; }
    .v-pullquote { margin: 0; max-width: var(--v-measure); }
    .v-pullquote blockquote {
        border: 0;
        padding: 0;
        font-family: var(--v-font-heading);
        font-size: var(--v-step-3);
        line-height: 1.3;
        color: var(--v-heading);
    }
    .v-pullquote blockquote > p:last-child:not(:first-child) { font-family: var(--v-font-body); font-size: var(--v-step-0); color: var(--v-text-muted); }
    .v-cta { text-align: center; max-width: var(--v-measure); margin-inline: auto; }
    .v-cta p:has(> a) { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--v-space-2xs); }
    .v-cta p > a {
        display: inline-flex;
        align-items: center;
        min-height: var(--v-touch);
        padding: 0.5em 1.15em;
        border: 2px solid var(--v-primary);
        border-radius: var(--v-radius-button);
        background: var(--v-primary);
        color: var(--v-on-primary);
        font-weight: 600;
        text-decoration: none;
    }
    .v-cta p > a:hover { background: var(--v-primary-hover); color: var(--v-on-primary-hover); }
    .v-cta p > a + a { background: transparent; color: var(--v-primary-text); border-color: currentColor; }
    :is(.section-primary, .section-secondary, .section-accent, .section-dark) .v-cta p > a { background: var(--v-sec-fg); border-color: var(--v-sec-fg); color: var(--v-sec-bg); }
    :is(.section-primary, .section-secondary, .section-accent, .section-dark) .v-cta p > a + a { background: transparent; color: var(--v-sec-fg); }
    .v-has-bg-image .v-cta p > a { background: #fff; border-color: #fff; color: #111; }
    .v-has-bg-image .v-cta p > a + a { background: transparent; color: #fff; }
    .v-lead { max-width: var(--v-measure); }

    .v-divider--space { height: var(--v-space-2xl); }
    .break { border-color: var(--v-border); }

    /* Block templates: media */
    .v-hero {
        position: relative;
        isolation: isolate;
        display: grid;
        align-items: end;
        min-height: clamp(22rem, 62vh, 42rem);
        overflow: hidden;
        background: var(--v-dark);
        color: #fff;
        --v-heading: #fff;
        --v-focus: #fff;
        --v-focus-halo: #000;
    }
    .section-contained > .v-hero, .v-hero:only-child:not(:where(.v-blocks > .page-layout-normal > .block > *)) { border-radius: var(--v-radius); }
    .v-hero__image { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
    .v-hero::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient(to top, rgb(0 0 0 / 0.78) 0%, rgb(0 0 0 / 0.62) 45%, rgb(0 0 0 / 0.25) 100%);
    }
    .v-hero--plain::before { display: none; }
    .v-hero__content {
        width: min(100% - 2 * var(--v-gutter), var(--v-container));
        margin-inline: auto;
        padding-block: var(--v-space-2xl);
        max-width: none;
    }
    .v-hero__title { font-family: var(--v-font-heading); font-weight: var(--v-heading-weight); font-size: var(--v-step-6); line-height: 1.05; max-width: 20ch; text-wrap: balance; }
    .v-hero__text { font-size: var(--v-step-1); max-width: 50ch; }
    .v-hero .v-button { background: #fff; border-color: #fff; color: #111; }
    .v-hero .v-button:hover { background: transparent; color: #fff; }

    .v-logos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--v-space-l) var(--v-space-xl); }
    .v-logos li { margin: 0; display: grid; justify-items: center; gap: var(--v-space-3xs); }
    .v-logos img { max-height: 4.5rem; width: auto; max-width: 12rem; object-fit: contain; }
    .v-logos__caption { font-size: var(--v-step-n1); color: var(--v-text-muted); }

    .v-feature { display: grid; gap: var(--v-space-m); align-items: center; margin: 0; }
    .v-feature__media img { width: 100%; border-radius: var(--v-radius); }
    .v-feature + .v-feature { margin-block-start: var(--v-space-xl); }
    .v-feature__text { margin: 0; font-size: var(--v-step-0); color: var(--v-text); }
    .v-feature__title { font-size: var(--v-step-3); }
    @media (min-width: 48em) {
        .v-feature { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: var(--v-space-xl); }
        .v-feature:nth-of-type(even) .v-feature__media { order: 2; }
    }

    .v-spotlight { display: grid; gap: var(--v-space-m); align-items: center; }
    .v-spotlight + .v-spotlight { margin-block-start: var(--v-space-xl); }
    .v-spotlight__media img { width: 100%; border-radius: var(--v-radius); background: var(--v-surface-sunken); }
    .v-spotlight__title { font-size: var(--v-step-4); }
    .v-spotlight__fields { display: grid; gap: var(--v-space-2xs); font-size: var(--v-step-n1); }
    .v-spotlight__fields div { display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: var(--v-space-s); }
    .v-spotlight__fields dt { font-weight: 700; color: var(--v-text-muted); }
    @media (min-width: 48em) {
        .v-spotlight { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--v-space-xl); }
    }

    .v-preview__heading { margin-block-end: var(--v-space-s); }
    .v-preview__more { margin-block-start: var(--v-space-m); }
    .v-preview__more .v-icon { width: 1em; height: 1em; }

    .v-link-cards, .v-toc-cards > ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(16rem, 100%), 1fr)); gap: var(--v-space-s); border: 0; }
    .v-link-cards li, .v-toc-cards > ul > li { margin: 0; }
    .v-link-cards a, .v-toc-cards > ul > li > a {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: var(--v-space-3xs) var(--v-space-s);
        height: 100%;
        padding: var(--v-space-s) var(--v-space-m);
        background: var(--v-surface);
        border: 1px solid var(--v-border);
        border-radius: var(--v-radius);
        color: var(--v-text);
        font-weight: 700;
        text-decoration: none;
        box-shadow: var(--v-shadow-sm);
    }
    .v-link-cards a:hover, .v-toc-cards > ul > li > a:hover { border-color: var(--v-primary); color: var(--v-link); text-decoration: underline; }
    .v-link-cards .v-icon { grid-row: span 2; color: var(--v-primary-text); }
    .v-link-cards__meta { font-weight: 400; font-size: var(--v-step-n1); color: var(--v-text-muted); }
    .v-toc-cards ul ul { display: none; }

    /* Core block defaults */
    .preview-block .resource-list { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(12rem, 100%), 1fr)); gap: var(--v-space-m); }
    .preview-block .resource-list li { margin: 0; }
    .preview-block .resource-link { display: grid; gap: var(--v-space-2xs); font-weight: 600; }
    .preview-block .resource-link img { width: 100%; aspect-ratio: var(--v-card-ratio); object-fit: var(--v-card-fit); border-radius: var(--v-radius); background: var(--v-surface-sunken); }
    .toc-block > ul { border-inline-start-color: var(--v-border); }
    .media-embed .resource h3 { font-size: var(--v-step-0); }
    .media-embed .caption { color: var(--v-text-muted); }
    .assets { display: flex; flex-wrap: wrap; gap: var(--v-space-m); }
    .assets .caption { font-size: var(--v-step-n1); color: var(--v-text-muted); }

    /* Section navigation template */
    .v-page__with-nav { display: grid; gap: var(--v-space-l); }
    .v-page__with-nav .v-blocks > .page-layout-normal > .block { width: auto; margin-inline: 0; }
    .v-page__with-nav .v-blocks > .page-layout-normal > .block:is(.section-full, .section-tint, .section-primary, .section-secondary, .section-accent, .section-dark, .v-has-bg-image) { padding-inline: var(--v-space-l); border-radius: var(--v-radius); }
    .v-section-nav { align-self: start; padding: var(--v-space-s); background: var(--v-surface-alt); border-radius: var(--v-radius); }
    .v-section-nav__heading { font-size: var(--v-step-1); margin-block-end: var(--v-space-2xs); }
    .v-section-nav__heading a { color: inherit; text-decoration: none; }
    .v-section-nav ul { list-style: none; margin: 0; padding: 0; }
    .v-section-nav ul ul { padding-inline-start: var(--v-space-s); }
    .v-section-nav li { margin: 0; }
    .v-section-nav a { display: flex; align-items: center; min-height: 2.25rem; padding: 0.2em 0.5em; border-radius: var(--v-radius-sm); text-decoration: none; color: var(--v-text); }
    .v-section-nav a:hover { background: var(--v-surface); text-decoration: underline; }
    .v-section-nav a[aria-current=page] { background: var(--v-surface); color: var(--v-link); font-weight: 700; box-shadow: inset 3px 0 0 var(--v-primary); }
    @media (min-width: 64em) {
        .v-page__with-nav { grid-template-columns: 16rem minmax(0, 1fr); gap: var(--v-space-xl); }
        .v-section-nav { position: sticky; inset-block-start: calc(var(--v-sticky-offset) + var(--v-space-s)); }
    }

    /* Page template variants */
    .v-page--reading .v-blocks > .page-layout-normal > .block:not(:is(.block-media, .block-asset, .section-full, .section-tint, .section-primary, .section-secondary, .section-accent, .section-dark, .v-has-bg-image)) {
        width: min(100% - 2 * var(--v-gutter), var(--v-measure));
    }
    .v-page--reading .v-blocks .block-html { font-size: var(--v-step-1); line-height: 1.7; }
    .v-page--reading .v-page__header { width: min(100% - 2 * var(--v-gutter), var(--v-measure)); margin-inline: auto; padding: 0; }
    .v-page--full-width .v-blocks > .page-layout-normal > .block { width: calc(100% - 2 * var(--v-gutter)); }
    .v-page--full-width .v-blocks > .page-layout-grid { width: calc(100% - 2 * var(--v-gutter)); }
    .v-page--landing .v-blocks > .page-layout-normal > .block:first-child { margin-block-start: 0 !important; }
    .v-page__pagination { margin-block-start: var(--v-space-xl); }

    /* Resource pages */
    .v-resource__header { display: grid; gap: var(--v-space-3xs); margin-block: var(--v-space-xs) var(--v-space-m); }
    .v-resource__header h1 { font-size: var(--v-step-5); }
    .v-resource__parent { color: var(--v-text-muted); }
    .v-resource__top { margin-block-end: var(--v-space-l); }
    .v-resource__bottom { margin-block-start: var(--v-space-xl); }
    .v-resource__body { display: grid; gap: var(--v-space-l); align-items: start; }
    .v-resource__sidebar { display: grid; gap: var(--v-space-s); }
    .v-rblock + .v-rblock { margin-block-start: var(--v-space-m); }
    .v-resource__sidebar .v-rblock + .v-rblock { margin-block-start: 0; }
    .v-resource__sidebar .v-rblock > dl { padding: var(--v-space-s); background: var(--v-surface); border: 1px solid var(--v-border); border-radius: var(--v-radius); }
    .v-resource__sidebar .v-rblock > dl .property { display: block; }
    .v-resource__sidebar .v-rblock > dl dt { font-family: var(--v-font-heading); font-weight: var(--v-heading-weight); font-size: var(--v-step-1); margin-block-end: var(--v-space-2xs); color: var(--v-heading); }
    @media (min-width: 64em) {
        .v-resource__body[data-layout=sidebar-right] { grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem); gap: var(--v-space-xl); }
        .v-resource__body[data-layout=sidebar-left] { grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr); gap: var(--v-space-xl); }
        .v-resource__body[data-layout=sidebar-left] .v-resource__sidebar { order: -1; }
        .v-resource__sidebar { position: sticky; inset-block-start: calc(var(--v-sticky-offset) + var(--v-space-s)); }
    }

    /* Property values (dl > .property > dt + dd.value) */
    .v-resource dl:not(.v-spotlight__fields), .item-with-metadata dl { margin: 0; }
    :is(.v-resource__main, .v-resource__top, .v-resource__bottom) .property, .item-with-metadata .property {
        display: grid;
        gap: var(--v-space-3xs) var(--v-space-m);
        padding-block: var(--v-space-xs);
        border-block-end: 1px solid var(--v-border);
    }
    :is(.v-resource__main, .v-resource__top, .v-resource__bottom) .property:first-child, .item-with-metadata .property:first-child { border-block-start: 1px solid var(--v-border); }
    .property dt { font-weight: 700; color: var(--v-text); }
    .property dt .field-term { font-weight: 400; color: var(--v-text-muted); font-size: var(--v-step-n1); }
    .property dd { margin: 0; min-width: 0; }
    .property dd + dd { margin-block-start: var(--v-space-3xs); }
    .property .language { display: inline-block; font-size: var(--v-step-n2); font-weight: 700; text-transform: uppercase; padding: 0 0.4em; margin-inline-end: 0.35em; border-radius: var(--v-radius-sm); background: var(--v-surface-sunken); color: var(--v-text-muted); }
    .property .resource-link { display: inline-flex; align-items: center; gap: var(--v-space-2xs); }
    .property .resource-link img { width: 2.5rem; height: 2.5rem; object-fit: cover; border-radius: var(--v-radius-sm); }
    .property .annotation { margin-block-start: var(--v-space-2xs); padding: var(--v-space-2xs) var(--v-space-s); border-inline-start: 3px solid var(--v-border-strong); background: var(--v-surface-sunken); }
    .v-values-more { margin-block-start: var(--v-space-2xs); }
    @media (min-width: 40em) {
        :is(.v-resource__main, .v-resource__top, .v-resource__bottom) .property, .item-with-metadata .property { grid-template-columns: minmax(8rem, 30%) minmax(0, 1fr); }
        :is(.v-resource__main, .v-resource__top, .v-resource__bottom) .property dt, .item-with-metadata .property dt { grid-column: 1; }
        :is(.v-resource__main, .v-resource__top, .v-resource__bottom) .property dd, .item-with-metadata .property dd, .v-values-more { grid-column: 2; }
        .property dd + dd { margin-block-start: 0; }
    }
    .media-embeds .media-render + .media-render { margin-block-start: var(--v-space-m); }
    .media-render img, .media-render video { margin-inline: auto; }
    .v-resource table { font-size: var(--v-step-n1); }
    .v-rblock__heading { font-size: var(--v-step-2); margin-block-end: var(--v-space-s); }

    /* Previous and next in collection (resource page block) */
    .v-prevnext {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
        grid-template-areas: "prev position next";
        align-items: center;
        gap: var(--v-space-2xs) var(--v-space-s);
        padding-block: var(--v-space-3xs);
        border-block: 1px solid var(--v-border);
    }
    .v-prevnext__link--prev { grid-area: prev; }
    .v-prevnext__link--next { grid-area: next; justify-content: flex-end; text-align: end; }
    .v-prevnext__position { grid-area: position; margin: 0; text-align: center; color: var(--v-text-muted); font-size: var(--v-step-n1); }
    .v-prevnext__link {
        display: flex;
        align-items: center;
        gap: var(--v-space-xs);
        min-width: 0;
        min-height: var(--v-touch);
        padding: var(--v-space-3xs) var(--v-space-2xs);
        border-radius: var(--v-radius);
        color: var(--v-text);
        text-decoration: none;
    }
    .v-prevnext__link:hover { background: var(--v-surface-alt); }
    .v-prevnext__link:hover .v-prevnext__dir { text-decoration: underline; }
    .v-prevnext__text { display: grid; min-width: 0; }
    .v-prevnext__dir { font-weight: 700; color: var(--v-link); }
    .v-prevnext__title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--v-step-n1); color: var(--v-text-muted); }
    .v-prevnext__thumb { flex: none; }
    .v-prevnext__thumb img { display: block; inline-size: 3rem; block-size: 3rem; object-fit: cover; border-radius: var(--v-radius-sm); }
    .v-prevnext__arrow { flex: none; inline-size: 1.25em; block-size: 1.25em; color: var(--v-link); }
    @media (max-width: 40em) {
        .v-prevnext { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "position position" "prev next"; }
        .v-prevnext__thumb { display: none; }
    }
    .v-set-intro { margin-block-end: var(--v-space-l); }

    /* Search results */
    .v-search-results__summary { color: var(--v-text-muted); }
    .v-search-results__group + .v-search-results__group { margin-block-start: var(--v-space-xl); }
    .v-search-results__group > h2 { font-size: var(--v-step-3); margin-block-end: var(--v-space-s); }
    .v-count { color: var(--v-text-muted); font-weight: 400; }
    .v-search-results__more { margin-block-start: var(--v-space-s); }

    /* Page lists: page search results, page browse, cross-site search. */
    .v-page-results { display: grid; gap: var(--v-space-2xs); padding: 0; list-style: none; }
    .v-page-results > li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.15em 0.75em; margin: 0; padding-block: var(--v-space-3xs); border-block-end: 1px solid var(--v-border); }
    .v-page-results__site { color: var(--v-text-muted); font-size: var(--v-step-n1); }

    /* Cross-site search (all sites) */
    .v-cross-search__form { max-width: 40rem; margin-block-end: var(--v-space-m); }
    .v-cross-search__bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--v-space-2xs) var(--v-space-m); margin-block-end: var(--v-space-s); }
    .v-cross-search__bar > p { margin: 0; }
    .v-cross-search__links { display: flex; flex-wrap: wrap; gap: var(--v-space-s); }
    .v-cross-search__form + .v-search-results__summary { margin-block-end: var(--v-space-m); }

    /* Blog (module) lists: theme overrides of omeka/site/blog/* */
    .v-blog__layout { display: grid; gap: var(--v-space-xl); }
    .v-blog__posts { display: grid; gap: var(--v-space-l); align-content: start; }
    .v-post { display: grid; gap: var(--v-space-s); padding-block-end: var(--v-space-l); border-block-end: 1px solid var(--v-border); }
    .v-post__image img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--v-radius); background: var(--v-surface-sunken); }
    .v-post__body { display: grid; gap: var(--v-space-2xs); align-content: start; }
    .v-post__title { font-size: var(--v-step-3); }
    .v-post__title a { color: inherit; text-decoration: none; }
    .v-post__title a:hover { color: var(--v-link-hover); text-decoration: underline; }
    .v-post__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--v-space-2xs) var(--v-space-s); font-size: var(--v-step-n1); color: var(--v-text-muted); }
    .v-post__meta a:not(.v-chip) { color: inherit; }
    .v-post__tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--v-space-2xs) var(--v-space-s); font-size: var(--v-step-n1); }
    .v-post__tags li { margin: 0; }
    .v-blog__sidebar { display: grid; gap: var(--v-space-s); align-content: start; }
    .v-blog__categories { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--v-space-3xs); }
    .v-blog__feed a, .v-blog__back a { display: inline-flex; align-items: center; gap: 0.35em; min-height: 1.5rem; }
    .v-blog__pagination { margin-block-start: var(--v-space-s); }
    @media (min-width: 48em) {
        .v-post--image { grid-template-columns: minmax(10rem, 15rem) minmax(0, 1fr); gap: var(--v-space-m); }
    }
    @media (min-width: 64em) {
        .v-blog__layout--sidebar { grid-template-columns: minmax(0, 1fr) minmax(15rem, 20rem); }
    }

    /* Error pages */
    .v-error { display: grid; gap: var(--v-space-s); justify-items: start; padding-block: var(--v-space-2xl); max-width: calc(var(--v-measure) + 2 * var(--v-gutter)); }
    .v-error__search { max-width: 30rem; }
    .v-error__details { width: 100%; }

    /* Style book */
    .v-style-book > section { margin-block: var(--v-space-xl); }
    .v-swatches { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(11rem, 100%), 1fr)); gap: var(--v-space-xs); }
    .v-swatch { margin: 0; display: grid; gap: var(--v-space-3xs); padding: var(--v-space-s); min-height: 6rem; align-content: end; border-radius: var(--v-radius); border: 1px solid var(--v-border); font-size: var(--v-step-n1); }
    .v-swatch code { background: transparent; padding: 0; color: inherit; font-weight: 700; }
    .v-contrast-sample { display: inline-block; padding: 0.1em 0.6em; border-radius: var(--v-radius-sm); font-weight: 700; }
    .v-sb-section { padding-block: var(--v-space-l); }
    .v-token-list { columns: 2 20rem; font-size: var(--v-step-n1); }
    .v-token-list li { break-inside: avoid; }
    .v-form-sample { max-width: 30rem; }
    .v-form-sample p { display: grid; gap: var(--v-space-3xs); }
    .v-form-sample fieldset label { display: flex; align-items: center; gap: 0.5em; font-weight: 500; min-height: 2rem; }
}

/* ==========================================================================
   Utilities, user preferences, print
   ========================================================================== */
@layer engine.utilities {
    .visually-hidden, .sr-only, .screen-reader-text {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }

    /* Dark-mode logo */
    :root[data-scheme-mode=always] .v-brand__logo--light:has(+ .v-brand__logo--dark),
    :root[data-color-scheme=dark] .v-brand__logo--light:has(+ .v-brand__logo--dark) { display: none; }
    :root[data-scheme-mode=always] .v-brand__logo--dark,
    :root[data-color-scheme=dark] .v-brand__logo--dark { display: block; }
    @media (prefers-color-scheme: dark) {
        :root[data-scheme-mode=auto]:not([data-color-scheme=light]) .v-brand__logo--light:has(+ .v-brand__logo--dark) { display: none; }
        :root[data-scheme-mode=auto]:not([data-color-scheme=light]) .v-brand__logo--dark { display: block; }
    }

    @media (prefers-reduced-motion: reduce) {
        *, *::before, *::after {
            animation-duration: 0.01ms !important;
            animation-iteration-count: 1 !important;
            transition-duration: 0.01ms !important;
            scroll-behavior: auto !important;
        }
    }
    @media (prefers-contrast: more) {
        :root { --v-border: var(--v-border-strong); --v-shadow-sm: none; --v-shadow-md: none; }
        .v-card, .v-panel { border-width: 2px; }
        a { text-decoration-thickness: 2px; }
    }
    @media (forced-colors: active) {
        .v-card, .v-panel, .v-callout, .v-chip, .v-layout-switch button, .v-icon-button, .v-menu-toggle { border: 1px solid CanvasText; }
        .v-layout-switch button[aria-pressed=true] { outline: 2px solid Highlight; }
        .v-hero::before, .v-has-bg-image::before { display: none; }
        :focus-visible { outline-color: Highlight; }
        .v-icon { forced-color-adjust: auto; }
        /* The drawn select arrow has a fixed color: use the system's. */
        select { appearance: auto; background-image: none; padding-inline-end: 0.75em; }
    }

    @media print {
        :root { --v-bg: #fff; --v-text: #000; --v-link: #000; --v-heading: #000; }
        .v-topbar, .v-header__tools, .v-nav, .v-search, .v-skip-link, .v-back-to-top, .v-browse-controls,
        .v-layout-switch, .v-share, .v-pagination, .v-partners, #user-bar { display: none !important; }
        .v-header, .v-footer { background: none !important; color: #000 !important; border: 0; }
        .v-card, .v-panel { box-shadow: none; break-inside: avoid; }
        .v-main a[href^="http"]:not(.v-card__link)::after { content: " (" attr(href) ")"; font-size: 0.8em; }
        .section-primary, .section-secondary, .section-accent, .section-dark, .v-has-bg-image, .v-has-bg-color { background: none !important; color: #000 !important; --v-text: #000; --v-heading: #000; --v-link: #000; }
    }
}
