/* Native App shell. Plain CSS: no build tool or utility framework is required. */
:where(*, *::before, *::after) { box-sizing: border-box; }
:where(html) { font-family: Arial,Helvetica,sans-serif; line-height: 1.5; -webkit-text-size-adjust: 100%; }
:where(body) { margin: 0; }
:where(button, input, select, textarea) { font: inherit; }
:where(button, a, input, select, textarea, summary) { -webkit-tap-highlight-color: transparent; }
:where(img, svg, video) { max-width: 100%; vertical-align: middle; }
:where(img, video) { height: auto; }
:where(a) { color: var(--app-color-link); text-underline-offset: .2em; }
:where(a:hover) { color: var(--app-color-link-active); }
:where(h1,h2,h3,h4,h5,h6,p,dl) { margin-block-start: 0; }
:where(button) { cursor: pointer; }
:where(fieldset) { min-width: 0; }
:where(.app-frontend) { display: flex; flex-direction: column; min-height: 100dvh; background: var(--app-color-background); color: var(--app-color-text); }
:where(.app-container) { width: min(100% - 2.5rem,100rem); margin-inline: auto; }
:where(.app-header) { background: var(--app-color-header); color: var(--app-color-header-text); border-block-end: 1px solid var(--app-color-border); }
:where(.app-header-inner) { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--app-space); padding-block: var(--app-header-padding); }
:where(.app-brand) { min-width: 0; color: inherit; text-decoration: none; }
:where(.app-brand img) { display: block; width: min(20rem,100%); max-height: 6rem; object-fit: contain; object-position: left center; }
:where(.app-brand > span) { display: block; font-size: clamp(1.4rem,2.4vw,2rem); font-weight: 750; overflow-wrap: anywhere; }
:where(.app-header-actions) { display: flex; align-items: center; flex-wrap: wrap; justify-content: end; gap: .65rem; }
:where(.app-nav-band) { background: var(--app-color-navigation); color: var(--app-color-navigation-text); }
:where(.app-search-navigation) { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding-block: .7rem; }
:where(.app-main-nav) { display: block; position: static; margin: 0; padding: 0; border: 0; background: transparent; color: inherit; overflow: visible; max-width: 100%; }
:where(.app-main-nav)::backdrop { background: var(--app-color-overlay); }
:where(.app-burger, .app-drawer-heading) { display: none; }
:where(.app-menu) { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .75rem; list-style: none; padding: 0; margin: 0; }
:where(.app-menu) :where(a, summary) { display: flex; align-items: center; gap: .5rem; min-height: 2.75rem; padding: .6rem .5rem; font-weight: 600; text-decoration: none; color: inherit; cursor: pointer; }
:where(.app-menu-item) { position: relative; }
:where(.app-menu) :where(a:hover, a[aria-current="page"], summary:hover) { color: var(--app-color-link-active); background: var(--app-color-selection); border-radius: var(--app-control-radius); }
:where(.app-nav-band .app-menu) :where(a:hover,a[aria-current="page"]) { color: var(--app-color-navigation-active-text); background: var(--app-color-navigation-active); }
:where(.app-submenu) { position: absolute; z-index: 10; inset: 100% auto auto 0; min-width: 13rem; max-width: min(30rem,90vw); padding: .5rem; margin: 0; list-style: none; border: 1px solid var(--app-color-border); border-radius: var(--app-radius); background: var(--app-color-surface); color: var(--app-color-text); box-shadow: var(--app-shadow); }
:where(.app-submenu .app-submenu) { position: static; border: 0; box-shadow: none; padding-inline-start: 1rem; min-width: 0; }
:where(.app-nav-band .app-submenu) :where(a:hover,a[aria-current="page"]) { background: var(--app-color-selection); color: var(--app-color-selection-text); }
:where(.app-menu-preview) { display: none; position: absolute; z-index: 60; inset: 100% 0 auto auto; min-width: 17rem; max-width: min(25rem,90vw); max-height: 65vh; overflow: auto; padding: .75rem; color: var(--app-color-text); background: var(--app-color-surface); border: 1px solid var(--app-color-border); border-radius: var(--app-radius); box-shadow: var(--app-shadow); }
:where(.app-menu-with-preview):where(:hover,:focus-within) > .app-menu-preview { display: block; }
:where(.app-menu-preview) ul { list-style: none; padding: 0; margin: 0; }
:where(.app-menu-preview) li > a { display: flex; justify-content: space-between; gap: 1rem; }
:where(.app-menu-preview-all) { border-block-start: 1px solid var(--app-color-border); margin-block-start: .5rem; }
:where(button.app-menu-preview-all) { display: block; width: 100%; text-align: start; color: inherit; background: transparent; }
:where(.app-page-body) { flex: 1; padding-block: clamp(1.25rem,3vw,2.75rem); }
:where(.app-grid) { display: grid; gap: calc(var(--app-space) * 1.4); }
:where(.app-grid > *) { min-width: 0; }
:where(.app-sidebar) { display: grid; align-content: start; gap: var(--app-space); }
:where(.app-region-stack:not(:empty)) { display: grid; gap: var(--app-space); margin-block: var(--app-space); }
:where(.app-footer) { background: var(--app-color-footer); color: var(--app-color-footer-text); border-block-start: 1px solid var(--app-color-border); }
:where(.app-footer-inner) { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1.5rem; padding-block: 2rem; }
:where(.app-footer-inner p) { margin: 0; }
:where(.app-footer-name) { font-weight: 700; }
:where(.app-copyright) { font-size: .8rem; }
:where(.app-breadcrumbs) { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-block-end: 1.4rem; color: var(--app-color-text-muted); font-size: .875rem; }
:where(.app-breadcrumbs a) { display: inline-flex; align-items: center; min-height: 2.75rem; }
:where(.app-skip) { position: absolute; top: -10rem; left: 1rem; z-index: 100; padding: 1rem; color: var(--app-color-link); background: var(--app-color-surface); border: 2px solid var(--app-color-focus); }
:where(.app-skip:focus) { top: 1rem; }
:where(.sr-only) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
:where(.app-preview-banner) { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 1rem; padding: .75rem; }
:where(.app-welcome) { padding: clamp(1.25rem,4vw,3rem); border-block-start: .25rem solid var(--app-color-primary); }
:where(.app-eyebrow) { color: var(--app-color-link); letter-spacing: .1em; text-transform: uppercase; font-size: .8rem; font-weight: 700; margin-block-end: 1rem; }
:where(.app-widget) { padding: var(--app-panel-padding); }
:where(.app-widget > h2) { font-size: 1.1rem; margin-block-end: .75rem; }
:where(.app-rich-text) { overflow-wrap: anywhere; line-height: 1.65; }
:where(.app-rich-text) :where(ul,ol) { padding-inline-start: 1.5rem; }
:where(.app-search-host) { min-width: 0; flex: 1 1 25rem; max-width: 52rem; position: relative; }
:where(.app-search) { display: flex; align-items: stretch; width: 100%; min-width: 0; gap: 0; border: 1px solid var(--app-color-input-border); border-radius: var(--app-control-radius); background: var(--app-color-input); color: var(--app-color-input-text); }
:where(.app-search > input[type="search"]) { min-width: 4rem; flex: 1 1 12rem; border: 0; border-radius: 0; }
:where(.app-search-button,.app-search-reset,.app-search-settings) { display: flex; align-items: center; justify-content: center; gap: .5rem; flex: 0 0 auto; min-width: 2.75rem; border: 0; border-radius: 0; }
:where(.app-search-button) { color: var(--app-color-primary-text); background: var(--app-color-primary); }
:where(.app-search-context) { display: flex; align-items: center; max-width: 12rem; padding: .6rem .75rem; border-inline-end: 1px solid var(--app-color-border); background: var(--app-color-surface-alternate); font-weight: 600; overflow-wrap: anywhere; }
:where(.app-search-filter) { display: flex; min-width: 0; flex: 0 1 auto; max-width: 13rem; }
:where(.app-search-filter select) { width: 100%; max-width: 100%; flex: 1; border: 0; border-inline-end: 1px solid var(--app-color-border); border-radius: 0; }
:where(.app-search-results) { overflow-wrap: anywhere; }
@media (min-width: 64rem) {
    :where(.app-grid-left) { grid-template-columns: 16rem minmax(0,1fr); }
    :where(.app-grid-right) { grid-template-columns: minmax(0,1fr) 18rem; }
    :where(.app-grid-both) { grid-template-columns: 14rem minmax(0,1fr) 16rem; }
}
@media (max-width: 48rem) {
    :where(.app-container) { width: min(100% - 1.25rem,100rem); }
    :where(.app-header-inner) { align-items: start; }
    :where(.app-brand) { flex: 1 1 12rem; }
    :where(.app-brand img) { max-width: 15rem; }
    :where(.app-header-actions) { flex: 1 1 auto; }
    :where(.app-burger) { display: inline-flex; background: transparent; color: inherit; }
    :where(.app-main-nav:not([open])) { display: none; }
    :where(.app-main-nav[open]) { position: fixed; inset: 0 auto 0 0; margin: 0; width: min(24rem,90vw); height: 100dvh; max-height: 100dvh; overflow: auto; padding: 1rem; background: var(--app-color-surface); color: var(--app-color-text); }
    :where(.app-main-nav .app-menu) { align-items: stretch; flex-direction: column; }
    :where(.app-main-nav .app-submenu) { position: static; min-width: 0; }
    :where(.app-drawer-heading) { display: flex; align-items: center; justify-content: space-between; margin-block-end: 1rem; }
    :where(.app-search-navigation) { flex-wrap: nowrap; }
    :where(.app-search-host) { flex: 1 1 0; }
    :where(.app-search) { flex-wrap: wrap; }
    :where(.app-search-filter,.app-search-context) { flex: 1 1 40%; max-width: 100%; }
    :where(.app-search > input[type="search"]) { flex-basis: 50%; }
    :where(.app-footer-inner) { align-items: start; flex-direction: column; }
}

:where(.app-visually-hidden) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
:where(.app-header-login) { display: none; position: absolute; z-index: 60; inset: 100% 0 auto auto; width: min(26rem,calc(100vw - 2rem)); }
:where(.app-account-menu):where(:hover,:focus-within):not(.app-login-dismissed) > .app-header-login { display: block; }
:where(.app-header-login) .app-profile-login { margin: 0; padding: 0; border: 0; background: transparent; }
:where(.app-header-login) .app-login-actions { display: grid; }
:where(.app-menu-badge) { display: inline-flex; align-items: center; justify-content: center; min-width: 1.3rem; min-height: 1.3rem; padding: .1rem .35rem; border-radius: 1rem; background: var(--app-color-primary); color: var(--app-color-primary-text); font-size: .75rem; }
