@penn-libraries/web 1.4.0-dev.4 → 1.4.0

package/dist/collection/components/pennlibs-service-switcher/pennlibs-service-switcher.css

@@ -0,0 +1,222 @@
+:host {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  font-family: var(--pl-font-family);
+  font-size: var(--pl-font-size);
+}
+
+/* Icon-only trigger. Inherits the header's themed service color so it works on
+   both light and dark headers. */
+.service-switcher__trigger {
+  all: unset;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--pl-space-xs) var(--pl-space-2xs);
+  border-radius: var(--pl-border-radius-subtle);
+  cursor: pointer;
+  /* Icon takes the header's themed service color (penn-blue on light, light on
+     dark). At rest the trigger is just the stacked dots, reading like a quiet
+     divider; the chip background appears on hover, focus, and while open. */
+  color: var(--color-fg-service, var(--pl-color-penn-blue));
+  background: transparent;
+  border: solid 1px transparent;
+}
+
+.service-switcher__trigger:hover,
+.service-switcher__trigger[aria-expanded="true"] {
+  background: var(--pl-color-bg-subtle);
+}
+
+/* Dark header: the chip is a translucent wash of the (light) service color so
+   the penn-blue header shows through. */
+:host([theme="dark"]) .service-switcher__trigger:hover,
+:host([theme="dark"]) .service-switcher__trigger[aria-expanded="true"] {
+  background: rgb(from var(--color-fg-service, var(--pl-color-fg-on-emphasis)) r g b / 0.15);
+}
+
+.service-switcher__trigger:focus-visible {
+  outline: none;
+  box-shadow: var(--pl-focus-box-shadow);
+}
+
+/* Tooltip showing the trigger's label on hover/focus. Hidden by default;
+   revealed by the rules below. */
+.service-switcher__tooltip {
+  visibility: hidden;
+  opacity: 0;
+  transition: opacity 120ms ease;
+  position: absolute;
+  z-index: 10;
+  /* Fallback placement: centered under the trigger (the :host wraps it). */
+  top: calc(100% + var(--pl-space-2xs));
+  left: 50%;
+  translate: -50%;
+  width: max-content;
+  max-width: 16rem;
+  padding: var(--pl-space-2xs) var(--pl-space-xs);
+  border-radius: var(--pl-border-radius-subtle);
+  background: var(--pl-color-fg-default);
+  color: var(--pl-color-bg-default);
+  font-size: 0.875rem;
+  line-height: 1.4;
+}
+
+/* Progressive enhancement: anchor the tooltip to the trigger so it isn't tied
+   to the :host containing block (and won't be clipped by header overflow). */
+@supports (anchor-name: --a) {
+  .service-switcher__trigger {
+    anchor-name: --service-switcher-anchor;
+  }
+
+  .service-switcher__tooltip {
+    position-anchor: --service-switcher-anchor;
+    top: calc(anchor(bottom) + var(--pl-space-2xs));
+    left: anchor(center);
+  }
+}
+
+/* Show on pointer hover, keyboard focus, or when hovering the tooltip itself
+   (so it's hoverable/persistent per WCAG 1.4.13). */
+.service-switcher__trigger:hover + .service-switcher__tooltip,
+.service-switcher__trigger:focus-visible + .service-switcher__tooltip,
+.service-switcher__tooltip:hover {
+  visibility: visible;
+  opacity: 1;
+}
+
+/* Escape-dismissed: force-hide even while hovered/focused. Placed last so it
+   wins the source-order tie against the show rules above. */
+:host(.tooltip-dismissed) .service-switcher__trigger + .service-switcher__tooltip {
+  visibility: hidden;
+  opacity: 0;
+}
+
+/* Centered modal dialog (native <dialog> opened with showModal). */
+.service-switcher__dialog {
+  /* Single source for the modal body inset; the close button aligns to it. */
+  --service-switcher-padding: var(--pl-space-xl);
+  position: fixed;
+  inset: 0;
+  margin: auto;
+  width: min(90vw, 52rem);
+  height: fit-content;
+  max-height: calc(100dvh - var(--pl-space-2xl));
+  overflow: auto;
+  padding: 0;
+  border: 1px solid var(--pl-color-fg-default);
+  border-radius: var(--pl-border-radius-subtle);
+  background: var(--pl-color-bg-default);
+  color: var(--pl-color-fg-default);
+}
+
+/* The dialog is focused on open; show the design system focus ring around the
+   whole modal so it's clear the modal itself has focus. Uses `:focus` (not
+   `:focus-visible`) because the focus is moved programmatically, not by keyboard. */
+.service-switcher__dialog:focus {
+  outline: none;
+  box-shadow: var(--pl-focus-box-shadow);
+}
+
+.service-switcher__dialog::backdrop {
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+}
+
+.service-switcher__dialog-inner {
+  padding: var(--service-switcher-padding);
+}
+
+@media (max-width: 620px) {
+  .service-switcher__dialog {
+    --service-switcher-padding: var(--pl-space-l);
+  }
+}
+
+/* Bare icon close, pinned to the upper-right of the modal. */
+.service-switcher__close {
+  all: unset;
+  position: absolute;
+  top: calc(var(--service-switcher-padding) - var(--pl-space-xs));
+  right: calc(var(--service-switcher-padding) - var(--pl-space-xs));
+  display: inline-flex;
+  padding: var(--pl-space-2xs);
+  border-radius: var(--pl-border-radius-subtle);
+  color: var(--pl-color-fg-default);
+  cursor: pointer;
+}
+
+.service-switcher__close:hover {
+  background: var(--pl-color-bg-subtle);
+}
+
+/* `all: unset` clears the inherited focus ring, so restore it explicitly. */
+.service-switcher__close:focus-visible {
+  outline: none;
+  box-shadow: var(--pl-focus-box-shadow);
+}
+
+/* Keep the heading clear of the absolutely-positioned close button. */
+.service-switcher__dialog-inner h1 {
+  padding-right: var(--pl-space-xl);
+}
+
+/* Cards — mirrors docs/css/card.css (a docs-only stylesheet, not shipped).
+   Two columns on wider screens (so four services read as a 2×2 grid), stacking
+   to one column on narrow screens. */
+.cards {
+  display: grid;
+  gap: var(--pl-space-m);
+  grid-template-columns: 1fr 1fr;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+@media (max-width: 620px) {
+  .cards {
+    grid-template-columns: 1fr;
+  }
+}
+
+.card {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  gap: var(--pl-space-2xs);
+  justify-content: space-between;
+  min-height: 6rem;
+  padding: var(--pl-space-m);
+  background-color: var(--pl-color-bg-default);
+  border: 1px solid var(--pl-color-fg-default);
+  border-radius: var(--pl-border-radius-subtle);
+  box-shadow: calc(-1 * var(--pl-space-2xs)) var(--pl-space-2xs) 0 var(--pl-color-fg-accent);
+}
+
+.card__heading {
+  margin: 0;
+  font-size: 1.25rem;
+  font-weight: 500;
+}
+
+.card__description {
+  margin: 0;
+  color: var(--pl-color-fg-subtle);
+}
+
+.card__link {
+  color: var(--pl-color-fg-default);
+  text-decoration: none;
+}
+
+.card__link:hover {
+  text-decoration: underline;
+}
+
+.card__link::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+}
+

package/dist/collection/components/pennlibs-service-switcher/pennlibs-service-switcher.js

@@ -0,0 +1,123 @@
+import { Host, h } from "@stencil/core";
+// The Penn Libraries services the switcher links to. The component owns this
+// list — consumers don't author it.
+const SERVICES = [
+    { href: 'https://www.library.upenn.edu/', name: 'Using the library', description: 'Get hours, plan your visit, and use our many services.' },
+    { href: 'https://find.library.upenn.edu', name: 'Find', description: 'Search our catalog to find materials and manage your account.' },
+    { href: 'https://digitalcollections.library.upenn.edu/', name: 'Digital Collections', description: 'Browse digitized originals from our libraries and partners.' },
+    { href: 'https://findingaids.library.upenn.edu/', name: 'Philadelphia Area Archives', description: 'Explore primary sources held by archives across the area.' },
+];
+// The trigger's accessible name and the text shown in its hover/focus tooltip.
+const TRIGGER_LABEL = 'Where would you like to go?';
+/**
+ * A "waffle" switcher that helps people move between Penn Libraries services
+ * (Find, Digital Collections, Philadelphia Area Archives, and the main library
+ * site) and discover which one fits their task. The list of services is built
+ * into the component — consumers don't author it. Slots into `pennlibs-header`
+ * beside the logo via the `service-switcher` slot.
+ *
+ * @component
+ * @example
+ * <pennlibs-service-switcher></pennlibs-service-switcher>
+ */
+export class ServiceSwitcher {
+    constructor() {
+        /**
+         * The visual theme, matching the surrounding header. `dark` keeps the icon
+         * light and uses a translucent chip; `light` uses the default solid chip.
+         * @default 'light'
+         */
+        this.theme = 'light';
+        this.isOpen = false;
+        this.tooltipDismissed = false;
+        this.open = () => {
+            var _a, _b;
+            this.isOpen = true;
+            (_a = this.dialogEl) === null || _a === void 0 ? void 0 : _a.showModal();
+            // Native <dialog> doesn't lock the page behind it, so stop the document
+            // from scrolling while the modal is open. Restored in handleDialogClose.
+            document.body.style.overflow = 'hidden';
+            // Move focus to the modal itself (rather than the first focusable control)
+            // so assistive tech announces the dialog and its heading on open.
+            (_b = this.dialogEl) === null || _b === void 0 ? void 0 : _b.focus();
+        };
+        this.close = () => {
+            var _a;
+            (_a = this.dialogEl) === null || _a === void 0 ? void 0 : _a.close();
+        };
+        // Native <dialog> handles Escape and restores focus to the trigger on close;
+        // we only sync our open state, re-enable page scrolling, and close when the
+        // backdrop itself is clicked.
+        this.handleDialogClose = () => {
+            this.isOpen = false;
+            document.body.style.overflow = '';
+        };
+        this.handleDialogClick = (event) => {
+            if (event.target === this.dialogEl) {
+                this.close();
+            }
+        };
+        // The tooltip shows on hover/focus via CSS. Escape dismisses it without moving
+        // focus (WCAG 1.4.13); leaving or blurring the trigger re-arms it.
+        this.dismissTooltip = (event) => {
+            if (event.key === 'Escape') {
+                this.tooltipDismissed = true;
+            }
+        };
+        this.rearmTooltip = () => {
+            this.tooltipDismissed = false;
+        };
+    }
+    renderIcon() {
+        return (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", "aria-hidden": "true", focusable: "false" }, h("circle", { cx: "10", cy: "2.5", r: "1.6", fill: "currentColor" }), h("circle", { cx: "10", cy: "10", r: "1.6", fill: "currentColor" }), h("circle", { cx: "10", cy: "17.5", r: "1.6", fill: "currentColor" })));
+    }
+    render() {
+        return (h(Host, { key: '91777d9473396972fd522cd9461da74943345353', class: { 'tooltip-dismissed': this.tooltipDismissed } }, h("button", { key: '6eae2a5a75dbb20a51f100f5a706cc208b0a68c7', type: "button", class: "service-switcher__trigger", "aria-haspopup": "dialog", "aria-expanded": String(this.isOpen), "aria-controls": "service-switcher-panel", "aria-labelledby": "service-switcher-tooltip", onClick: this.open, onKeyDown: this.dismissTooltip, onMouseLeave: this.rearmTooltip, onBlur: this.rearmTooltip }, this.renderIcon()), h("span", { key: '71b3e538d5bcee5796de6b720a8ac4ce73eb20e6', id: "service-switcher-tooltip", role: "tooltip", class: "service-switcher__tooltip" }, TRIGGER_LABEL), h("dialog", { key: '6650dd267a52b2666a14d0f32efb441b290ffa6f', id: "service-switcher-panel", class: "service-switcher__dialog pl-typeset pl-reset", tabindex: "-1", "aria-labelledby": "service-switcher-title", ref: (el) => (this.dialogEl = el), onClose: this.handleDialogClose, onClick: this.handleDialogClick }, h("div", { key: '4db8cabdd9c54a764e87ae32ad581e17dc2575ac', class: "service-switcher__dialog-inner pl-typeset" }, h("h1", { key: 'b228235738bd82bbc86363e49923ff85d16346e2', id: "service-switcher-title" }, "Where would you like to go?"), h("button", { key: '247ad89b707ff68a7da34fda741d96aa05106cf2', type: "button", class: "service-switcher__close", "aria-label": "Close", onClick: this.close }, h("svg", { key: '4484125618a78b71723574e860aa00422249df5c', width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false" }, h("path", { key: '48f1696eacd2a61a34f60396bf8afac7f68af849', d: "M17 7L7 17M7 7L17 17", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("ul", { key: 'cab54cea65fd9241f11ba8c30ce7481001c5cdd1', class: "cards" }, SERVICES.map((service) => (h("li", { class: "card" }, h("h3", { class: "card__heading" }, h("a", { class: "card__link", href: service.href }, service.name)), service.description && (h("p", { class: "card__description" }, service.description))))))))));
+    }
+    static get is() { return "pennlibs-service-switcher"; }
+    static get encapsulation() { return "scoped"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["pennlibs-service-switcher.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["pennlibs-service-switcher.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "theme": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'light' | 'dark'",
+                    "resolved": "\"dark\" | \"light\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "'light'"
+                        }],
+                    "text": "The visual theme, matching the surrounding header. `dark` keeps the icon\nlight and uses a translucent chip; `light` uses the default solid chip."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "theme",
+                "defaultValue": "'light'"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "isOpen": {},
+            "tooltipDismissed": {}
+        };
+    }
+}
+//# sourceMappingURL=pennlibs-service-switcher.js.map

package/dist/collection/components/pennlibs-service-switcher/pennlibs-service-switcher.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pennlibs-service-switcher.js","sourceRoot":"","sources":["../../../src/components/pennlibs-service-switcher/pennlibs-service-switcher.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, Host, h } from '@stencil/core';\n\ninterface ServiceItem {\n  href: string;\n  name: string;\n  description: string;\n}\n\n// The Penn Libraries services the switcher links to. The component owns this\n// list — consumers don't author it.\nconst SERVICES: ServiceItem[] = [\n  { href: 'https://www.library.upenn.edu/', name: 'Using the library', description: 'Get hours, plan your visit, and use our many services.' },\n  { href: 'https://find.library.upenn.edu', name: 'Find', description: 'Search our catalog to find materials and manage your account.' },\n  { href: 'https://digitalcollections.library.upenn.edu/', name: 'Digital Collections', description: 'Browse digitized originals from our libraries and partners.' },\n  { href: 'https://findingaids.library.upenn.edu/', name: 'Philadelphia Area Archives', description: 'Explore primary sources held by archives across the area.' },\n];\n\n// The trigger's accessible name and the text shown in its hover/focus tooltip.\nconst TRIGGER_LABEL = 'Where would you like to go?';\n\n/**\n * A \"waffle\" switcher that helps people move between Penn Libraries services\n * (Find, Digital Collections, Philadelphia Area Archives, and the main library\n * site) and discover which one fits their task. The list of services is built\n * into the component — consumers don't author it. Slots into `pennlibs-header`\n * beside the logo via the `service-switcher` slot.\n *\n * @component\n * @example\n * <pennlibs-service-switcher></pennlibs-service-switcher>\n */\n@Component({\n  tag: 'pennlibs-service-switcher',\n  styleUrl: 'pennlibs-service-switcher.css',\n  scoped: true,\n})\nexport class ServiceSwitcher {\n  /**\n   * The visual theme, matching the surrounding header. `dark` keeps the icon\n   * light and uses a translucent chip; `light` uses the default solid chip.\n   * @default 'light'\n   */\n  @Prop({ reflect: true }) theme: 'light' | 'dark' = 'light';\n\n  @State() isOpen: boolean = false;\n  @State() tooltipDismissed: boolean = false;\n\n  private dialogEl?: HTMLDialogElement;\n\n  private open = () => {\n    this.isOpen = true;\n    this.dialogEl?.showModal();\n    // Native <dialog> doesn't lock the page behind it, so stop the document\n    // from scrolling while the modal is open. Restored in handleDialogClose.\n    document.body.style.overflow = 'hidden';\n    // Move focus to the modal itself (rather than the first focusable control)\n    // so assistive tech announces the dialog and its heading on open.\n    this.dialogEl?.focus();\n  };\n\n  private close = () => {\n    this.dialogEl?.close();\n  };\n\n  // Native <dialog> handles Escape and restores focus to the trigger on close;\n  // we only sync our open state, re-enable page scrolling, and close when the\n  // backdrop itself is clicked.\n  private handleDialogClose = () => {\n    this.isOpen = false;\n    document.body.style.overflow = '';\n  };\n\n  private handleDialogClick = (event: MouseEvent) => {\n    if (event.target === this.dialogEl) {\n      this.close();\n    }\n  };\n\n  // The tooltip shows on hover/focus via CSS. Escape dismisses it without moving\n  // focus (WCAG 1.4.13); leaving or blurring the trigger re-arms it.\n  private dismissTooltip = (event: KeyboardEvent) => {\n    if (event.key === 'Escape') {\n      this.tooltipDismissed = true;\n    }\n  };\n\n  private rearmTooltip = () => {\n    this.tooltipDismissed = false;\n  };\n\n  private renderIcon() {\n    return (\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"20\"\n        height=\"20\"\n        viewBox=\"0 0 20 20\"\n        aria-hidden=\"true\"\n        focusable=\"false\"\n      >\n        <circle cx=\"10\" cy=\"2.5\" r=\"1.6\" fill=\"currentColor\" />\n        <circle cx=\"10\" cy=\"10\" r=\"1.6\" fill=\"currentColor\" />\n        <circle cx=\"10\" cy=\"17.5\" r=\"1.6\" fill=\"currentColor\" />\n      </svg>\n    );\n  }\n\n  render() {\n    return (\n      <Host class={{ 'tooltip-dismissed': this.tooltipDismissed }}>\n        <button\n          type=\"button\"\n          class=\"service-switcher__trigger\"\n          aria-haspopup=\"dialog\"\n          aria-expanded={String(this.isOpen)}\n          aria-controls=\"service-switcher-panel\"\n          aria-labelledby=\"service-switcher-tooltip\"\n          onClick={this.open}\n          onKeyDown={this.dismissTooltip}\n          onMouseLeave={this.rearmTooltip}\n          onBlur={this.rearmTooltip}\n        >\n          {this.renderIcon()}\n        </button>\n        <span id=\"service-switcher-tooltip\" role=\"tooltip\" class=\"service-switcher__tooltip\">\n          {TRIGGER_LABEL}\n        </span>\n\n        <dialog\n          id=\"service-switcher-panel\"\n          class=\"service-switcher__dialog pl-typeset pl-reset\"\n          tabindex=\"-1\"\n          aria-labelledby=\"service-switcher-title\"\n          ref={(el) => (this.dialogEl = el as HTMLDialogElement)}\n          onClose={this.handleDialogClose}\n          onClick={this.handleDialogClick}\n        >\n          <div class=\"service-switcher__dialog-inner pl-typeset\">\n            <h1 id=\"service-switcher-title\">\n              Where would you like to go?\n            </h1>\n            <button\n              type=\"button\"\n              class=\"service-switcher__close\"\n              aria-label=\"Close\"\n              onClick={this.close}\n            >\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" focusable=\"false\">\n                <path d=\"M17 7L7 17M7 7L17 17\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </svg>\n            </button>\n            <ul class=\"cards\">\n              {SERVICES.map((service) => (\n                <li class=\"card\">\n                  <h3 class=\"card__heading\">\n                    <a class=\"card__link\" href={service.href}>\n                      {service.name}\n                    </a>\n                  </h3>\n                  {service.description && (\n                    <p class=\"card__description\">{service.description}</p>\n                  )}\n                </li>\n              ))}\n            </ul>\n          </div>\n        </dialog>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/components/index.d.ts

@@ -21,6 +21,8 @@ export { Hero as PennlibsHero } from '../types/components/pennlibs-hero/pennlibs
 export { defineCustomElement as defineCustomElementPennlibsHero } from './pennlibs-hero';
 export { IIIFImg as PennlibsIiifImg } from '../types/components/pennlibs-iiif-img/pennlibs-iiif-img';
 export { defineCustomElement as defineCustomElementPennlibsIiifImg } from './pennlibs-iiif-img';
+export { ServiceSwitcher as PennlibsServiceSwitcher } from '../types/components/pennlibs-service-switcher/pennlibs-service-switcher';
+export { defineCustomElement as defineCustomElementPennlibsServiceSwitcher } from './pennlibs-service-switcher';
 
 /**
  * Get the base path to where the assets can be found. Use "setAssetPath(path)"

package/dist/components/index.js

@@ -10,6 +10,7 @@ export { PennlibsFooter, defineCustomElement as defineCustomElementPennlibsFoote
 export { PennlibsHeader, defineCustomElement as defineCustomElementPennlibsHeader } from './pennlibs-header.js';
 export { PennlibsHero, defineCustomElement as defineCustomElementPennlibsHero } from './pennlibs-hero.js';
 export { PennlibsIiifImg, defineCustomElement as defineCustomElementPennlibsIiifImg } from './pennlibs-iiif-img.js';
+export { PennlibsServiceSwitcher, defineCustomElement as defineCustomElementPennlibsServiceSwitcher } from './pennlibs-service-switcher.js';
 //# sourceMappingURL=index.js.map
 
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -1 +1 @@
-{"file":"index.js","mappings":";;;;;;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
+{"file":"index.js","mappings":";;;;;;;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/pennlibs-header.js

@@ -8,7 +8,7 @@ const LogoBlue = () => {
     return (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "445", fill: "none", class: "website-header__logo", viewBox: "0 0 445 95" }, h("g", { "clip-path": "url(#clip0_10377_15535)" }, h("path", { fill: "#011F5B", d: "M443.498 60.919H84.084v1.247h359.414v-1.247z" }), h("path", { fill: "#fff", d: "M76.106 3.45H0v37.926c-.052 16.52 9.105 28.478 16.793 35.601 8.456 7.841 17.766 12.368 20.875 13.035l.376.085.376-.085c3.11-.683 12.437-5.194 20.876-13.035 7.687-7.123 16.827-19.082 16.793-35.601V3.45h.017z" }), h("path", { fill: "#900", d: "M1.93 5.45s.103 22.037 0 21.934h72.245V5.45H1.93zM21.32 19.32c.12.085.222.17.307.29.086.137.12.274.12.445a.888.888 0 01-.12.427c-.085.12-.205.205-.307.307-.171.137-.342.257-.342.479v1.35H5.022v-1.35c0-.222-.17-.36-.341-.479a1.054 1.054 0 01-.308-.307.753.753 0 01-.12-.444c0-.171.035-.308.12-.445.085-.12.205-.205.308-.29.17-.137.341-.256.341-.495V14.4c0-.222-.17-.342-.341-.478a1.245 1.245 0 01-.308-.29.752.752 0 01-.12-.445c0-.17.035-.307.12-.444.085-.12.205-.222.308-.29.17-.137.341-.257.341-.479v-1.383h.205c.94 0 1.743-.018 2.324-.274.239-.085.444-.239.666-.376.495-.307 1.042-.649 1.879-.649.666 0 1.281.256 1.828.479.393.153.752.29 1.025.29h.102c.274 0 .633-.154 1.025-.29.547-.223 1.162-.479 1.828-.479.837 0 1.384.342 1.88.65.222.136.444.273.683.375.564.24 1.384.274 2.323.274h.205v1.383c0 .222.17.342.342.479.102.085.222.17.307.29.086.137.12.273.12.444 0 .171-.051.308-.12.444-.085.12-.205.205-.307.29-.171.137-.342.257-.342.48v4.407c0 .222.17.358.342.495m30.527 2.306c-1.23 1.965-3.621 2.46-3.706 2.477-.462.086-.957.12-1.436.12-2.494 0-4.783-1.093-7.123-2.29-.256-.136-.547-.29-.854-.46-1.487-.82-3.57-1.948-5.33-1.948-.513 0-1.008.102-1.435.325l-.069.034v.085c0 .222-.068.444-.136.65-.29.751-1.196 1.537-1.64 1.861-1.025.735-2.29 1.487-3.844 1.487-.24 0-.444-.035-.65-.103a1.502 1.502 0 01-.7-.495c-.085-.103-.153-.24-.222-.376-.051-.103-.068-.222-.102-.342v-.085l-.103-.034c-.615-.188-.973-.581-.973-1.06 0-.375.273-.683.53-.99.41-.479.75-.889.187-1.435-.051-.052-.12-.086-.17-.137-.086-.068-.172-.12-.24-.205-.495-.53-.205-1.657-.034-2.323v-.069c.205-.734.512-1.486.922-2.306.564-1.11 1.23-2.374 2.187-3.16.017 0 .034-.017.068-.017.017 0 .052.017.069.034 0 .034.12.188.273.444l.154.273.102-.29c.274-.786.7-1.298 1.299-1.52.632-.24 1.23.085 1.52.307l.12.102.085-.136c.188-.308.547-.684 1.128-.718.649-.034 1.178.41 1.434.684l.103.085.102-.085c.29-.24 1.042-.786 1.794-.684.718.103.991.718 1.076.974l.052.17.153-.068c.342-.17.991-.392 1.606 0 .393.257.444.684.41.991v.188l.171-.034c.461-.068 1.316-.12 1.828.393.393.41.427.94.376 1.298v.188h.17c.41-.068.957-.034 1.248.427.205.308.12.752.051.974l-.034.137.136.034c.24.051.65.205.77.547.102.256.068.666-.07 1.161l-.033.12.12.051c.204.085.58.29.785.683.205.393.188.872-.017 1.453l-.034.085.068.068c.53.479 1.06.906 1.589 1.282 1.06.768 2.716 1.178 3.844.256.427-.342.615-.991.478-1.589-.137-.53-.478-.888-.957-1.008-.854-.188-1.52.615-2.067 1.435 0 .017-.05.034-.085.034-.034 0-.051-.017-.068-.051-.513-1.213-.53-2.204-.086-2.973.393-.649 1.128-1.11 2.033-1.264h.12v-.153c0-1.418.324-2.46 1.008-3.092.427-.376 1.195-.803 2.477-.615a.13.13 0 01.068.034v.068c-.94 2.29-.718 3.143-.205 5.023.051.17.085.341.137.512.478 1.777.341 3.297-.428 4.527m19.56-2.306c.12.085.223.17.308.29a.79.79 0 01.12.444.734.734 0 01-.12.427c-.085.12-.205.206-.307.308-.171.137-.342.256-.342.478v1.35H55.127v-1.35c0-.222-.153-.358-.341-.478a1.055 1.055 0 01-.308-.308.648.648 0 01-.12-.444c0-.17.035-.307.12-.444.086-.12.188-.205.308-.29.17-.137.341-.256.341-.496V14.35c0-.222-.153-.342-.341-.479a1.242 1.242 0 01-.308-.29.648.648 0 01-.12-.444c0-.154.035-.308.12-.444.086-.12.205-.222.308-.29.17-.137.341-.257.341-.479V10.54h.205c.94 0 1.743-.017 2.324-.273.239-.085.444-.24.683-.376.478-.307 1.042-.65 1.862-.65.666 0 1.281.257 1.828.48.393.153.752.29 1.025.29h.103c.273 0 .632-.154 1.025-.29.546-.223 1.161-.48 1.828-.48.837 0 1.383.343 1.879.65.222.137.444.273.683.376.564.24 1.384.273 2.323.273h.205v1.384c0 .222.154.342.342.478.103.086.222.171.308.29.085.137.119.274.119.445 0 .17-.034.307-.12.444-.085.12-.204.205-.307.29-.17.137-.342.257-.342.479v4.407c0 .222.154.36.342.496" }), h("path", { fill: "#011F5B", d: "M26.82 18.382c.257 0 .496.068.735.256.086.068.154.136.222.188a.374.374 0 01-.017.564c-.17.153-.376.29-.512.375-.29.205-.803.564-1.145.29-.17-.153.17-.392.017-.99-.12-.478.342-.683.718-.683" }), h("path", { fill: "#011F5B", d: "M46.706 24.378c-2.495 0-4.818-1.077-7.192-2.307-.257-.136-.564-.29-.872-.46-1.896-1.043-4.749-2.598-6.628-1.624 0 .24-.051.479-.137.684-.29.785-1.23 1.605-1.69 1.93-1.043.752-2.324 1.503-3.93 1.503-.24 0-.478-.034-.683-.102a1.64 1.64 0 01-.77-.547 2.354 2.354 0 01-.238-.41 1.784 1.784 0 01-.103-.376c-.666-.205-1.076-.649-1.076-1.195 0-.41.29-.752.564-1.077.444-.53.649-.803.188-1.23-.052-.051-.103-.085-.171-.136-.086-.069-.171-.12-.256-.223-.547-.597-.24-1.759-.069-2.46v-.068c.222-.734.513-1.503.94-2.34.564-1.128 1.247-2.409 2.22-3.212.052-.034.12-.068.188-.051.069 0 .12.051.154.102.034.052.427.65.837 1.435 1.692-1.008 4.1-1.127 4.374-1.127 1.486-.051 3.638.17 5.483 1.589 1.145.888 2.085 1.964 2.99 3.023.24.274.478.564.734.838 1.401 1.571 2.734 2.818 4.066 3.792 1.008.735 2.597 1.145 3.673.256.393-.324.564-.905.427-1.435-.12-.478-.427-.803-.854-.905-.769-.171-1.4.598-1.913 1.366-.051.069-.137.12-.222.103-.086 0-.154-.068-.188-.137-.53-1.247-.547-2.289-.069-3.092.41-.683 1.196-1.178 2.136-1.315 0-1.47.342-2.546 1.06-3.195.443-.393 1.246-.837 2.596-.666.068 0 .136.051.17.12.035.068.052.136 0 .205-.939 2.237-.7 3.075-.204 4.92.05.17.085.341.153.53.496 1.81.342 3.382-.444 4.629-1.264 2.033-3.707 2.528-3.81 2.545-.495.085-.973.12-1.452.12M33.398 19.2c1.793 0 3.843 1.128 5.45 2 .307.17.597.324.87.46 2.734 1.418 5.433 2.648 8.337 2.136.017 0 2.358-.479 3.502-2.34.718-1.145.837-2.58.393-4.271a7.72 7.72 0 01-.137-.513c-.478-1.76-.751-2.75.103-4.937-.99-.068-1.589.273-1.93.564-.65.58-.957 1.606-.906 3.058a.24.24 0 01-.205.239c-.888.102-1.64.512-2.016 1.127-.358.598-.376 1.367-.05 2.29.443-.598 1.195-1.418 2.152-1.213.598.136 1.042.598 1.195 1.23.171.717-.05 1.486-.58 1.913-1.265 1.025-3.075.598-4.237-.24-1.367-.99-2.716-2.254-4.134-3.86l-.735-.837c-.905-1.025-1.828-2.101-2.921-2.956-1.725-1.332-3.775-1.554-5.176-1.503-.957.034-2.887.308-4.186 1.094.41.82.752 1.776.752 2.494 0 .136-.017.256-.068.393.94-.547 2.067-.154 2.682.53.136.153.29.375.444.631.24.359.53.786.854 1.11.051.052.068.12.068.188a.188.188 0 01-.102.171s-.598.428-1.435 1.043c-.12.085-.24.17-.342.239-.017 0-.034.034-.051.05l.735.12c.512-.273 1.059-.393 1.657-.393m-6.475-7.926c-.803.752-1.4 1.88-1.913 2.887-.41.803-.7 1.537-.888 2.255v.068c-.154.53-.445 1.623-.069 2.016.051.051.12.103.188.154.068.051.137.102.205.17.786.752.24 1.402-.154 1.863-.239.273-.461.53-.461.786 0 .546.666.751.871.785.103.018.171.103.171.205 0 .171.034.274.085.41.052.12.103.205.171.308.137.17.325.307.547.393.154.068.342.085.547.085 1.486 0 2.682-.734 3.673-1.435.58-.41 1.315-1.161 1.537-1.708.051-.154.085-.308.103-.478l-1.042-.171h-.018a.3.3 0 01-.205-.222c-.034-.205.154-.325.53-.581.103-.069.222-.154.325-.24.546-.41.99-.717 1.23-.888a7.525 7.525 0 01-.735-1.008c-.154-.222-.29-.444-.41-.563-.512-.547-1.418-.871-2.152-.427-.29.188-.547.41-.838.666-.222.188-.444.41-.7.58-.103.069-.24.052-.308-.05-.085-.086-.068-.223 0-.308a.742.742 0 01.12-.103c.325-.324 1.11-1.042 1.11-1.571 0-1.213-1.161-3.195-1.571-3.861" }), h("path", { fill: "#011F5B", d: "M25.386 22.789c-.223 0-.445 0-.667-.034-.12-.017-.222-.12-.205-.256 0-.12.12-.205.257-.205 1.042.136 2.58 0 3.895-1.384a.237.237 0 01.324 0 .238.238 0 010 .324C28 22.26 26.752 22.79 25.37 22.79M43.802 19.338s-.052 0-.086-.017c-.12-.051-.154-.17-.12-.29.24-.547.274-1.008.103-1.35-.239-.461-.786-.615-.803-.615-.051 0-.12-.051-.136-.102-.035-.052-.035-.12 0-.188.085-.205.256-.837.153-1.162-.102-.273-.615-.376-.785-.41-.069 0-.137-.051-.171-.103-.035-.068-.035-.136 0-.187.068-.171.222-.684.034-.957-.342-.53-1.23-.273-1.23-.273-.086.017-.171 0-.222-.052-.052-.05-.069-.153-.052-.222 0 0 .257-.803-.239-1.332-.58-.598-1.845-.24-1.862-.24a.196.196 0 01-.205-.068c-.051-.051-.068-.136-.051-.222 0-.034.222-.7-.24-.973-.717-.445-1.537.119-1.537.136a.181.181 0 01-.205.017c-.068-.034-.12-.102-.12-.17 0-.035-.119-.906-.887-1.009-.838-.12-1.709.735-1.726.752a.26.26 0 01-.17.069.18.18 0 01-.154-.086s-.599-.769-1.333-.735c-.717.035-.99.752-.99.77a.242.242 0 01-.155.136c-.068 0-.136 0-.188-.051 0 0-.717-.684-1.434-.41-.906.341-1.162 1.452-1.248 1.81a.206.206 0 01-.256.171c-.12-.017-.188-.136-.17-.256.102-.427.392-1.708 1.52-2.118.7-.257 1.332.085 1.657.324.188-.307.564-.751 1.247-.786.7-.034 1.281.462 1.537.718.342-.273 1.11-.837 1.914-.718.7.103 1.042.65 1.178 1.077.376-.188 1.077-.41 1.76 0 .461.307.512.803.478 1.127.496-.085 1.401-.136 1.948.427.444.462.461 1.06.41 1.418.393-.051 1.042-.017 1.384.513.222.358.153.803.068 1.093.29.068.735.24.871.632.137.376 0 .94-.085 1.247.239.103.632.325.854.752.24.478.205 1.042-.086 1.725-.034.086-.12.12-.205.12" }), h("path", { fill: "#011F5B", d: "M42.725 22.31h-.017c-.12 0-.205-.119-.188-.239.103-.82-.393-.973-.803-1.093-.102-.034-.204-.068-.29-.12-.222-.136-.24-.41-.24-.683 0-.307-.016-.649-.255-.905-.41-.444-1.196-.154-1.196-.154-.069.034-.154 0-.205-.034-.069-.051-.086-.12-.086-.188 0 0 .12-.871-.375-1.298-.428-.36-1.23-.274-1.504-.205-.068 0-.136 0-.188-.052-.05-.034-.068-.102-.068-.17.034-.53-.17-1.008-.58-1.265a1.06 1.06 0 00-1.094-.085c-.906.478-1.264.512-2.204-.154-.29-.205-.598-.273-.871-.205-.359.086-.683.41-.94.906-.051.102-.17.153-.29.102a.22.22 0 01-.103-.29c.308-.598.735-1.008 1.213-1.128.41-.102.837 0 1.23.274.803.563.974.546 1.743.12.478-.257 1.059-.223 1.537.084.462.308.752.82.786 1.401.393-.05 1.128-.068 1.606.342.461.393.547 1.008.547 1.367.358-.069.956-.086 1.366.358.325.376.359.838.359 1.196 0 .12 0 .29.034.342.034.017.12.051.205.068.41.12 1.247.393 1.11 1.572 0 .102-.102.188-.204.188M21.405 19.202c-.17-.137-.273-.222-.273-.36v-4.406c0-.137.102-.24.273-.376.12-.086.24-.188.342-.325a.959.959 0 00.154-.53.904.904 0 00-.154-.512c-.086-.137-.222-.24-.342-.342-.17-.136-.273-.222-.273-.376v-1.537h-.359c-.82 0-1.691 0-2.255-.256-.222-.086-.444-.222-.666-.359-.495-.325-1.076-.683-1.948-.683-.7 0-1.332.256-1.879.478-.376.154-.717.29-.973.29h-.103c-.24 0-.598-.136-.974-.29-.546-.222-1.178-.478-1.879-.478-.871 0-1.452.358-1.947.683-.222.137-.427.273-.65.359-.563.239-1.452.256-2.272.256h-.341v1.537c0 .154-.103.24-.274.376-.12.086-.239.188-.341.342a.959.959 0 000 1.042c.085.137.222.24.341.325.171.136.274.222.274.375v4.408c0 .137-.103.222-.274.359a1.52 1.52 0 00-.341.324.959.959 0 000 1.042c.085.137.222.24.341.325.171.137.274.222.274.376v1.469h16.246v-1.47c0-.136.102-.238.273-.375.12-.085.24-.188.342-.325a.959.959 0 00.154-.53.904.904 0 00-.154-.512c-.086-.136-.222-.239-.342-.324zm-7.192-9.089c.513-.205 1.094-.444 1.691-.444.718 0 1.196.29 1.675.598.222.137.46.29.734.41a4.5 4.5 0 00.684.205v9.362c-.376-.069-.803-.069-1.248-.069-.666 0-1.366 0-2.032-.205-.223-.068-.462-.136-.684-.222-.683-.222-1.298-.41-1.725-.444h-.017v-8.883c.29-.051.598-.17.94-.308m-6.527.564a6.17 6.17 0 00.735-.41c.495-.307.957-.598 1.674-.598.598 0 1.179.24 1.691.444.36.137.684.274.974.308v8.866h-.051c-.427.034-1.042.24-1.726.444-.222.069-.46.154-.683.222-.666.205-1.366.205-2.033.205-.444 0-.854 0-1.247.069v-9.345a3.15 3.15 0 00.684-.205m13.752 9.396a.445.445 0 01-.069.256c-.051.086-.154.154-.239.222-.205.171-.444.359-.444.735v.974H5.33v-.974c0-.376-.256-.564-.444-.735a1.02 1.02 0 01-.24-.222c-.05-.085-.085-.17-.068-.256 0-.12.017-.188.069-.273.05-.086.153-.154.239-.223.205-.153.444-.358.444-.717v-4.407c0-.376-.256-.564-.444-.718-.103-.085-.188-.154-.24-.24-.05-.084-.085-.17-.068-.255 0-.103.017-.205.069-.274.05-.085.153-.153.239-.222.205-.153.444-.358.444-.734v-1.025h.034c.41 0 .786 0 1.162-.034v10.147h5.586a.923.923 0 00.905.683c.444 0 .803-.29.906-.683h5.586V10.933c.359.035.752.035 1.145.035h.034v1.025c0 .375.239.563.444.734.102.069.188.154.239.222.051.069.085.171.068.257 0 .119-.017.187-.068.273-.051.085-.154.154-.24.239-.204.154-.443.359-.443.717v4.408c0 .359.239.564.444.717.102.086.188.154.239.223.051.085.085.17.068.256l.035.034zM71.51 19.202c-.188-.137-.273-.222-.273-.36v-4.406c0-.137.103-.24.273-.376.12-.086.24-.188.342-.325a.959.959 0 00.154-.53.904.904 0 00-.154-.512c-.085-.137-.222-.24-.342-.342-.188-.136-.273-.222-.273-.376v-1.537h-.359c-.82 0-1.69 0-2.255-.256a4.235 4.235 0 01-.666-.359c-.495-.325-1.076-.683-1.947-.683-.684 0-1.333.256-1.88.478-.375.154-.734.29-.973.29h-.103c-.239 0-.598-.136-.974-.29-.563-.222-1.195-.478-1.879-.478-.87 0-1.452.358-1.947.683-.222.137-.427.273-.65.359-.563.239-1.451.256-2.271.256h-.342v1.537c0 .154-.103.24-.273.376-.12.086-.24.188-.342.342a.959.959 0 000 1.042c.085.137.222.24.342.325.17.136.273.222.273.375v4.408c0 .137-.103.222-.273.359a1.52 1.52 0 00-.342.324.959.959 0 000 1.042c.085.137.222.24.342.325.17.137.273.222.273.376v1.469h16.246v-1.47c0-.136.103-.238.273-.375.12-.085.24-.188.342-.325a.959.959 0 00.154-.53.904.904 0 00-.154-.512c-.085-.136-.222-.239-.342-.324m-7.192-9.089c.513-.205 1.094-.444 1.692-.444.734 0 1.178.29 1.674.598.222.137.461.29.717.41.222.086.444.154.684.205v9.362c-.376-.069-.803-.069-1.247-.069-.667 0-1.367 0-2.033-.205-.223-.068-.462-.136-.684-.222-.683-.222-1.298-.41-1.725-.444h-.017v-8.883c.29-.051.598-.17.94-.308m-6.526.564c.256-.12.495-.256.717-.41.495-.307.957-.598 1.674-.598.598 0 1.179.24 1.692.444.358.137.683.274.973.308v8.866h-.051c-.427.034-1.025.24-1.725.444-.223.069-.462.154-.684.222-.666.205-1.366.205-2.033.205-.444 0-.854 0-1.247.069v-9.345a3.15 3.15 0 00.684-.205m13.752 9.396a.446.446 0 01-.069.256c-.051.086-.153.154-.239.222-.205.171-.444.359-.444.735v.974h-15.34v-.974c0-.376-.257-.564-.445-.735a1.02 1.02 0 01-.24-.222c-.05-.085-.085-.17-.068-.256 0-.12.018-.188.069-.273.051-.086.154-.154.239-.223.205-.153.444-.358.444-.717v-4.407c0-.376-.256-.564-.444-.718-.102-.085-.188-.154-.24-.24-.05-.084-.085-.17-.068-.255 0-.103.018-.205.069-.274.051-.085.154-.153.239-.222.205-.153.444-.358.444-.734v-1.025h.034c.41 0 .786 0 1.162-.034v10.147h5.586a.923.923 0 00.906.683c.444 0 .785-.29.905-.683h5.586V10.933c.376.035.752.035 1.162.035h.034v1.025c0 .375.256.563.444.734.103.069.188.154.24.222.05.069.085.171.068.257 0 .119-.017.187-.069.273-.05.085-.153.154-.239.239-.205.154-.444.359-.444.717v4.408c0 .359.256.564.444.717.103.086.188.154.24.223.05.085.085.17.068.256l-.034.034z" }), h("path", { fill: "#011F5B", d: "M74.654 4.886H1.452v36.49c-.051 15.99 8.85 27.606 16.315 34.542 8.148 7.551 17.322 12.061 20.21 12.676h.153c2.887-.632 12.06-5.125 20.21-12.676 7.482-6.936 16.365-18.552 16.331-34.542V4.886h-.017zm-1.008 21.986H2.46V5.894h71.186v20.978zM16.588 62.457a6.28 6.28 0 010-8.867 6.279 6.279 0 018.866 0 6.28 6.28 0 010 8.867 6.28 6.28 0 01-8.866 0zm41.051 12.727c-8.473 7.858-17.237 11.804-19.595 12.402-2.357-.598-11.12-4.561-19.594-12.402-.205-.188-.41-.393-.615-.581l20.21-21.457 20.209 21.457c-.205.188-.41.393-.615.58zM31.775 42.469c0-3.45 2.802-6.27 6.27-6.27a6.263 6.263 0 016.269 6.27 6.263 6.263 0 01-6.27 6.27 6.274 6.274 0 01-6.27-6.27zm27.743 19.988a6.28 6.28 0 01-8.866 0 6.28 6.28 0 010-8.867 6.279 6.279 0 018.866 0 6.28 6.28 0 010 8.867zm10.062-3.178L38.045 28.871 6.508 59.279C4.066 54.12 2.426 48.158 2.46 41.376V27.88h71.186v13.496c.017 6.765-1.606 12.744-4.066 17.903M88.799 81.3c0 3.604.973 6.371 4.817 6.371 3.536 0 5.398-2.374 5.398-6.491v-7.175c0-.53-.102-.974-.153-1.384-.12-.922-1.008-1.298-2.221-1.418v-.666h6.082v.666c-1.23.12-2.085.495-2.221 1.418-.051.41-.137.854-.137 1.384v7.277c0 5.552-3.536 7.602-6.867 7.602-5.484 0-7.192-2.784-7.192-7.448v-7.688c0-2.391.102-2.272-2.221-2.545v-.666h6.935v.666c-2.323.273-2.22.154-2.22 2.546v7.55zM117.31 88.577c-3.16-3.742-6.44-7.654-9.686-11.48v8.798c0 .41.086.751.12 1.059.102.717.769 1.008 2.084 1.093v.513h-4.869v-.513c.957-.085 1.606-.376 1.709-1.093.034-.325.119-.65.119-1.06v-9.361c-.564-.718-1.179-1.35-2.306-1.35v-.512h3.622c2.955 3.604 6.047 7.26 9.002 10.865h.035V77.37c0-.427-.086-.769-.12-1.076-.102-.718-.786-.991-2.084-1.093v-.513h4.869v.513c-.94.102-1.623.375-1.709 1.093-.034.307-.119.649-.119 1.076v11.224h-.684l.017-.017zM127.117 86.082c0 1.846-.086 1.743 1.708 1.965v.513h-5.347v-.513c1.794-.222 1.708-.12 1.708-1.965v-8.951c0-1.845.086-1.743-1.708-1.965v-.53h5.347v.53c-1.794.205-1.708.12-1.708 1.965v8.951zM137.503 75.166c-1.093 0-1.879.308-1.23 2.221a1204.83 1204.83 0 002.973 8.798c1.281-3.04 2.494-6.116 3.724-9.14.495-1.264-.017-1.879-1.367-1.879v-.512h4.288v.512c-.581 0-1.23.188-1.64 1.196-1.674 4.083-3.348 8.132-5.022 12.198h-1.025c-1.213-3.434-2.563-7.278-3.776-10.643-.734-2.136-1.349-2.75-2.306-2.75v-.513h5.398v.512h-.017zM148.932 88.047c1.793-.222 1.708-.12 1.708-1.965v-8.951c0-1.845.085-1.76-1.708-1.965v-.512h8.9v3.194h-.512c-.205-1.486-.598-2.562-2.033-2.562h-2.7v5.689h1.675c1.247 0 1.793-.496 1.828-1.726h.512v4.237h-.512c-.035-1.162-.496-1.862-1.828-1.862h-1.675v4.493c0 1.69.786 1.828 2.563 1.828 2.887 0 2.75-.82 3.656-2.939h.512l-.598 3.57h-9.788v-.529zM162.735 74.654h5.791c1.999 0 4.015 1.059 4.015 3.382 0 2.05-1.247 3.451-2.785 4.049l1.948 2.955c.991 1.453 2.101 2.853 2.819 3.263v.257h-2.05c-1.179 0-1.811-2.17-4.22-6.168h-1.879v3.69c0 1.846-.086 1.743 1.708 1.965v.513h-5.347v-.513c1.794-.222 1.708-.12 1.708-1.965v-8.951c0-1.845.069-1.76-1.708-1.965v-.512zm3.639 7.124h1.64c1.725 0 2.528-1.299 2.528-3.554s-1.196-2.921-2.648-2.921h-1.537v6.475h.017zM184.568 77.61c-.171-1.384-.923-2.512-2.512-2.512-1.144 0-2.186.598-2.186 2.067 0 1.47 1.383 2.221 3.382 3.724 2.101 1.572 2.785 2.597 2.785 4.237 0 2.358-2.426 3.673-4.818 3.673a9.267 9.267 0 01-3.399-.632c-.086-.034-.137-.12-.137-.273v-2.87h.513c.205 2.203 1.657 3.092 3.211 3.092 1.401 0 2.563-1.077 2.563-2.529 0-1.281-.701-2.34-3.673-4.322-1.076-.717-2.409-1.486-2.409-3.656 0-1.793 1.999-3.211 4.271-3.211.854 0 1.999.102 2.784.376.12.034.137.12.137.204v2.614h-.512v.017zM193.81 86.082c0 1.846-.086 1.743 1.708 1.965v.513h-5.347v-.513c1.794-.222 1.708-.12 1.708-1.965v-8.951c0-1.845.069-1.743-1.708-1.965v-.53h5.347v.53c-1.794.205-1.708.12-1.708 1.965v8.951zM205.7 86.082c0 1.846-.086 1.743 1.708 1.965v.513h-5.347v-.513c1.794-.222 1.708-.12 1.708-1.965V75.286h-1.793c-1.726 0-2.119 1.093-2.785 2.409h-.495l.546-3.041h11.002l.529 3.04h-.512c-.649-1.315-1.042-2.408-2.785-2.408H205.7v10.796zM216.53 88.047c1.794-.222 1.708-.12 1.708-1.965v-3.057l-3.057-6.065c-.65-1.298-1.213-1.794-2.136-1.794v-.512h5.074v.512c-1.503 0-1.384.752-.871 1.794l2.408 4.988 2.734-4.988c.683-1.213.034-1.794-1.145-1.794v-.512h4.1v.512c-.547 0-1.093.257-1.623 1.213l-3.331 6.03c-.205.393-.222.957-.222 1.453v2.22c0 1.846-.086 1.743 1.708 1.965v.513h-5.364v-.513h.017zM235.527 83.81c0-3.382 2.921-8.438 7.209-8.438 3.434 0 4.186 2.323 4.186 4.646 0 2.836-2.272 8.866-7.192 8.866-3.297 0-4.203-2.647-4.203-5.073m9.02-5.023c0-2.682-1.623-2.784-2.033-2.784-2.784 0-4.612 5.005-4.612 8.353 0 1.333.222 3.759 2.135 3.759 2.938 0 4.51-4.835 4.51-9.328zM258.914 76.225l-.615.547h-3.383c-1.264 6.15-3.331 14.316-4.8 18.228h-1.162l3.69-18.228h-2.443l.24-1.076h2.425c1.367-5.484 5.911-6.065 6.987-6.065.598 0 1.828.103 2.221.462l-.324 1.708-.649.307c-.359-.7-1.179-1.503-2.255-1.503-1.555 0-2.717 1.06-3.332 3.844l-.29 1.23h3.792l-.102.546zM274.391 85.348c0 2.392-.102 2.272 2.221 2.546v.666h-6.935v-.666c2.323-.291 2.22-.154 2.22-2.546v-11.6c0-2.391.103-2.272-2.22-2.545v-.666h6.747c4.288 0 6.39 1.691 6.39 4.783 0 3.707-3.349 5.723-7.295 5.484v-.513c3.212.052 4.715-1.879 4.715-4.715 0-2.835-1.384-4.22-4.271-4.22h-1.572v13.992zM286.384 88.047c1.776-.222 1.708-.12 1.708-1.965v-8.951c0-1.845.068-1.76-1.708-1.965v-.512h8.883v3.194h-.513c-.205-1.486-.598-2.562-2.033-2.562h-2.699v5.689h1.674c1.248 0 1.794-.496 1.828-1.726h.513v4.237h-.513c-.034-1.162-.495-1.862-1.828-1.862h-1.674v4.493c0 1.69.769 1.828 2.563 1.828 2.87 0 2.733-.82 3.656-2.939h.512l-.598 3.57h-9.789v-.512l.018-.017zM312.231 88.577c-3.161-3.742-6.441-7.654-9.687-11.48v8.798c0 .41.086.751.12 1.059.103.717.769 1.008 2.084 1.093v.513h-4.869v-.513c.957-.085 1.606-.376 1.709-1.093.051-.325.119-.65.119-1.06v-9.361c-.563-.718-1.178-1.35-2.306-1.35v-.512h3.622c2.955 3.604 6.047 7.26 9.003 10.865h.034V77.37c0-.427-.068-.769-.12-1.076-.102-.718-.769-.991-2.101-1.093v-.513h4.886v.513c-.94.102-1.606.375-1.726 1.093-.034.307-.119.649-.119 1.076v11.224h-.666l.017-.017zM330.373 88.577c-3.16-3.742-6.44-7.654-9.686-11.48v8.798c0 .41.068.751.119 1.059.103.717.786 1.008 2.084 1.093v.513h-4.868v-.513c.956-.085 1.606-.376 1.708-1.093.034-.325.12-.65.12-1.06v-9.361c-.547-.718-1.179-1.35-2.307-1.35v-.512h3.622c2.973 3.604 6.048 7.26 9.02 10.865h.034V77.37c0-.427-.068-.769-.102-1.076-.103-.718-.786-.991-2.102-1.093v-.513h4.869v.513c-.939.102-1.606.375-1.708 1.093-.051.307-.137.649-.137 1.076v11.224h-.666v-.017zM343.322 77.61c-.154-1.384-.922-2.512-2.511-2.512-1.145 0-2.187.598-2.187 2.067 0 1.47 1.401 2.221 3.383 3.724 2.101 1.572 2.784 2.597 2.784 4.237 0 2.358-2.409 3.673-4.817 3.673a9.34 9.34 0 01-3.4-.632c-.068-.034-.136-.12-.136-.273v-2.87h.512c.222 2.203 1.674 3.092 3.212 3.092 1.4 0 2.562-1.077 2.562-2.529 0-1.281-.683-2.34-3.673-4.322-1.076-.717-2.409-1.486-2.409-3.656 0-1.793 1.982-3.211 4.288-3.211.855 0 1.982.102 2.768.376.119.034.137.12.137.204v2.614h-.513v.017zM351.334 88.047c1.794-.222 1.708-.12 1.708-1.965v-3.057l-3.057-6.065c-.65-1.298-1.213-1.794-2.119-1.794v-.512h5.057v.512c-1.503 0-1.367.752-.871 1.794l2.408 4.988 2.734-4.988c.683-1.213.051-1.794-1.128-1.794v-.512h4.1v.512c-.547 0-1.093.257-1.623 1.213l-3.314 6.03c-.188.393-.239.957-.239 1.453v2.22c0 1.846-.085 1.743 1.708 1.965v.513h-5.347v-.513h-.017zM363.6 88.047c1.794-.222 1.708-.12 1.708-1.965v-8.951c0-1.845.069-1.76-1.708-1.965v-.512h5.347v.512c-1.794.205-1.708.12-1.708 1.965v9.276c0 1.384.769 1.538 2.545 1.538 2.887 0 2.768-.82 3.673-2.939h.496l-.598 3.57h-9.772v-.512l.017-.017zM379.761 75.166c-1.094 0-1.897.308-1.23 2.221.785 2.358 1.93 5.757 2.972 8.798 1.264-3.04 2.477-6.116 3.707-9.14.496-1.264 0-1.879-1.366-1.879v-.512h4.287v.512c-.58 0-1.23.188-1.64 1.196a2610.34 2610.34 0 01-5.039 12.198h-1.008c-1.213-3.434-2.563-7.278-3.775-10.643-.735-2.136-1.35-2.75-2.307-2.75v-.513h5.416v.512h-.017zM391.77 83.964l-.922 2.665c-.256.77.119 1.435.991 1.435v.513h-3.622v-.513c.547 0 1.128-.341 1.435-.99.854-1.76 3.178-8.252 4.835-12.66h1.11c1.35 3.998 3.382 10.131 4.066 11.89.444 1.111.751 1.743 1.606 1.743v.513h-4.63v-.513c1.247 0 1.367-.649 1.042-1.52l-.854-2.58h-5.057v.017zm4.818-.751l-2.118-6.458h-.035l-2.374 6.458h4.527zM416.268 88.577c-3.178-3.742-6.441-7.654-9.687-11.48v8.798c0 .41.069.751.12 1.059.102.717.786 1.008 2.084 1.093v.513h-4.869v-.513c.957-.085 1.606-.376 1.709-1.093.051-.325.119-.65.119-1.06v-9.361c-.546-.718-1.161-1.35-2.306-1.35v-.512h3.622c2.955 3.604 6.047 7.26 9.003 10.865h.034V77.37c0-.427-.069-.769-.12-1.076-.102-.718-.786-.991-2.084-1.093v-.513h4.869v.513c-.94.102-1.606.375-1.709 1.093-.034.307-.119.649-.119 1.076v11.224h-.666v-.017zM425.664 86.082c0 1.846-.086 1.743 1.708 1.965v.513h-5.347v-.513c1.794-.222 1.708-.12 1.708-1.965v-8.951c0-1.845.086-1.743-1.708-1.965v-.53h5.347v.53c-1.794.205-1.708.12-1.708 1.965v8.951zM433.983 83.964l-.922 2.665c-.257.77.119 1.435 1.007 1.435v.513h-3.621v-.513c.546 0 1.11-.341 1.435-.99.854-1.76 3.177-8.252 4.834-12.66h1.111c1.349 3.998 3.382 10.131 4.066 11.89.444 1.111.751 1.743 1.605 1.743v.513h-4.629v-.513c1.247 0 1.366-.649 1.059-1.52l-.854-2.58h-5.057l-.034.017zm4.8-.751l-2.101-6.458h-.034l-2.375 6.458h4.51zM101.116 6.201h-5.689v20.654c1.537.53 3.434.786 5.689.786 3.451 0 6.184-.888 8.183-2.665 1.998-1.777 3.006-4.22 3.006-7.295 0-3.314-.991-6.064-2.989-8.217-1.999-2.152-4.715-3.245-8.2-3.245m-17.032-1.76h16.81c5.5 0 9.84 1.213 13.051 3.656 3.212 2.443 4.818 5.569 4.818 9.43 0 3.86-1.401 6.765-4.203 8.815-2.801 2.05-6.816 3.075-12.061 3.075-2.015 0-4.373-.154-7.072-.479v12.898c0 2.785.376 4.698 1.11 5.74.752 1.042 2.119 1.572 4.1 1.572v1.332h-16.57v-1.332c1.981 0 3.348-.547 4.1-1.657.751-1.093 1.11-2.938 1.11-5.501V13.12c0-2.75-.376-4.664-1.11-5.74-.752-1.076-2.119-1.606-4.1-1.606V4.442l.017.017zM119.6 31.758h15.511v-.547c0-2.545-.717-4.561-2.169-6.047-1.452-1.487-3.263-2.238-5.433-2.238-2.306 0-4.151.785-5.552 2.357-1.4 1.572-2.186 3.724-2.34 6.475m21.388 11.428v2.084c-1.725 2.204-3.485 3.776-5.279 4.715-1.793.94-3.946 1.418-6.457 1.418-4.442 0-8.115-1.4-11.019-4.185-2.887-2.785-4.339-6.32-4.339-10.626 0-4.305 1.384-7.96 4.134-10.916 2.768-2.955 6.15-4.442 10.148-4.442 3.297 0 6.167 1.11 8.627 3.332 2.46 2.22 3.69 4.885 3.69 7.978v.58h-20.927v.393c0 3.144.478 5.86 1.435 8.183.956 2.323 2.357 4.134 4.185 5.433 1.828 1.315 3.741 1.964 5.74 1.964 1.862 0 3.451-.393 4.766-1.162 1.316-.768 3.075-2.357 5.279-4.766" }), h("path", { fill: "#011F5B", d: "M151.118 21.234v5.69c3.332-3.793 6.748-5.69 10.284-5.69 2.751 0 5.04.94 6.868 2.82 1.828 1.878 2.75 4.338 2.75 7.413v12.847c0 1.964.325 3.263.991 3.895.649.632 1.931.94 3.844.94v1.332h-15.187v-1.333c1.879 0 3.177-.239 3.861-.734.683-.496 1.042-1.418 1.042-2.819V30.7c0-2-.598-3.57-1.777-4.767-1.196-1.178-2.716-1.776-4.578-1.776-2.665 0-5.364 1.862-8.081 5.569v13.923c0 2.357.308 3.86.923 4.51.615.649 1.896.956 3.827.956v1.333h-15v-1.333c2.17 0 3.503-.341 3.998-1.042.495-.7.752-2.17.752-4.424V27.589c0-1.708-.308-2.818-.906-3.365-.598-.53-1.879-.803-3.844-.803v-1.332l8.867-.872h1.366v.017z" }), h("path", { fill: "#011F5B", d: "M185.695 21.234v5.69c3.331-3.793 6.748-5.69 10.284-5.69 2.751 0 5.04.94 6.868 2.82 1.828 1.878 2.75 4.338 2.75 7.413v12.847c0 1.964.325 3.263.991 3.895.649.632 1.93.94 3.844.94v1.332h-15.187v-1.333c1.879 0 3.177-.239 3.86-.734.684-.496 1.042-1.418 1.042-2.819V30.7c0-2-.597-3.57-1.776-4.767-1.196-1.178-2.716-1.776-4.578-1.776-2.665 0-5.365 1.862-8.081 5.569v13.923c0 2.357.308 3.86.923 4.51.615.649 1.896.956 3.826.956v1.333h-14.999v-1.333c2.17 0 3.502-.341 3.998-1.042.495-.7.751-2.17.751-4.424V27.589c0-1.708-.307-2.818-.905-3.365-.598-.53-1.879-.803-3.844-.803v-1.332l8.866-.872h1.367v.017zM251.466 40.436h1.366l-2.818 10.045H216.65V49.15c1.879 0 3.229-.598 4.032-1.777.802-1.179 1.195-3.16 1.195-5.928v-28.99c0-2.494-.375-4.22-1.11-5.21-.752-.974-2.118-1.47-4.1-1.47V4.442h16.485v1.332c-1.828 0-3.143.564-3.946 1.692-.803 1.127-1.196 2.99-1.196 5.569v30.767c0 1.708.359 2.87 1.077 3.502.717.632 2.101.94 4.134.94h9.139c2.819 0 4.801-.496 5.928-1.47 1.128-.974 2.187-3.092 3.178-6.338zM261.203 6.509c.974 0 1.777.341 2.46 1.008.683.666 1.008 1.486 1.008 2.46 0 .973-.342 1.793-1.025 2.494-.683.7-1.486 1.042-2.426 1.042a3.474 3.474 0 01-2.511-1.042c-.7-.7-1.059-1.52-1.059-2.494 0-.974.341-1.794 1.042-2.46a3.534 3.534 0 012.528-1.008m1.247 14.726h1.367v23.984c0 1.572.342 2.631 1.025 3.144.683.53 1.93.786 3.724.786v1.332h-15.58V49.15c2.272 0 3.741-.257 4.391-.77.649-.512.973-1.57.973-3.177V27.675c0-1.726-.307-2.87-.905-3.434-.598-.546-2.101-.82-4.476-.82V22.09l9.464-.871.017.017zM276.851 27.555v16.246c0 2.119.359 3.57 1.076 4.357.718.785 1.965 1.178 3.759 1.178 3.707 0 6.628-1.195 8.781-3.57 2.152-2.374 3.228-5.723 3.228-10.01 0-3.588-.939-6.51-2.801-8.799-1.862-2.272-4.1-3.416-6.697-3.416-2.733 0-5.176 1.332-7.363 3.997M275.467-.017h1.367V25.47c1.213-1.315 2.665-2.34 4.39-3.109 1.726-.752 3.451-1.145 5.211-1.145 3.69 0 6.816 1.35 9.379 4.015 2.562 2.682 3.826 5.98 3.826 9.874 0 4.578-1.725 8.337-5.159 11.275-3.451 2.938-8.2 4.39-14.247 4.39-2.358 0-5.313-.29-8.849-.87V7.225c0-2.22-.274-3.604-.838-4.117-.563-.53-1.964-.786-4.219-.786V.991L275.467 0v-.017z" }), h("path", { fill: "#011F5B", d: "M310.198 21.234v6.167c2.614-2.272 4.646-3.878 6.099-4.783 1.452-.922 2.665-1.366 3.621-1.366 1.811 0 3.553.751 5.228 2.237l-2.153 5.057c-3.041-1.674-5.296-2.511-6.748-2.511-1.623 0-3.638 1.144-6.047 3.45v15.649c0 1.572.324 2.63.991 3.194.649.547 1.913.82 3.775.82v1.333h-15.033v-1.333c1.981 0 3.297-.307 3.912-.94.615-.631.922-2.135.922-4.526V28.119c0-1.965-.341-3.246-1.008-3.827-.666-.58-2.289-.871-4.885-.871v-1.332l9.976-.872h1.367l-.017.017zM341.341 44.707v-9.652c-.803.341-1.982.769-3.537 1.298-2.853.974-4.68 1.93-5.483 2.887-.803.957-1.196 2.238-1.196 3.861 0 1.418.427 2.63 1.281 3.673.854 1.042 1.862 1.554 3.041 1.554 1.076 0 2.204-.341 3.382-1.042 1.179-.7 2.016-1.554 2.512-2.58zm-7.654 6.68c-2.221 0-4.134-.735-5.74-2.221-1.588-1.487-2.391-3.263-2.391-5.365 0-2.1.683-3.638 2.067-4.92 1.366-1.298 4.168-2.528 8.371-3.707 2.647-.734 4.424-1.366 5.347-1.879v-2.118c0-2.067-.581-3.741-1.726-5.006-1.144-1.264-2.699-1.896-4.629-1.896-1.76 0-3.315.547-4.664 1.64-1.367 1.094-2.323 2.597-2.87 4.476L326 29.998c.581-2.648 1.828-4.766 3.741-6.355 1.93-1.589 4.185-2.392 6.765-2.392 3.058 0 5.535.923 7.448 2.768 1.897 1.845 2.853 4.407 2.853 7.67v12.215c0 1.725.12 2.904.342 3.519.222.615.649.922 1.281.922.41 0 .752-.17 1.025-.53.256-.358.564-1.092.906-2.22h1.366c-.136 1.777-.683 3.195-1.674 4.237-.991 1.042-2.272 1.571-3.861 1.571-2.323 0-3.946-1.35-4.834-4.048-1.418 1.537-2.665 2.596-3.776 3.177-1.093.581-2.391.871-3.878.871M362.421 21.234v6.167c2.614-2.272 4.647-3.878 6.099-4.783 1.452-.922 2.665-1.366 3.622-1.366 1.811 0 3.553.751 5.227 2.237l-2.152 5.057c-3.041-1.674-5.296-2.511-6.748-2.511-1.623 0-3.639 1.144-6.048 3.45v15.649c0 1.572.325 2.63.991 3.194.649.547 1.914.82 3.776.82v1.333h-15.034v-1.333c1.982 0 3.297-.307 3.912-.94.615-.631.923-2.135.923-4.526V28.119c0-1.965-.342-3.246-1.008-3.827-.666-.58-2.289-.871-4.886-.871v-1.332l9.977-.872h1.366l-.017.017zM387.141 6.509c.974 0 1.777.341 2.46 1.008.683.666 1.008 1.486 1.008 2.46 0 .973-.342 1.793-1.025 2.494-.684.7-1.486 1.042-2.426 1.042-.94 0-1.811-.342-2.511-1.042-.701-.7-1.059-1.52-1.059-2.494 0-.974.341-1.794 1.042-2.46a3.534 3.534 0 012.528-1.008m1.247 14.726h1.367v23.984c0 1.572.341 2.631 1.025 3.144.683.53 1.93.786 3.724.786v1.332h-15.58V49.15c2.272 0 3.741-.257 4.39-.77.649-.512.974-1.57.974-3.177V27.675c0-1.726-.307-2.87-.905-3.434-.598-.546-2.102-.82-4.476-.82V22.09l9.464-.871.017.017zM399.988 31.758h15.511v-.547c0-2.545-.734-4.561-2.169-6.047-1.452-1.487-3.263-2.238-5.433-2.238-2.306 0-4.151.785-5.552 2.357-1.401 1.572-2.187 3.724-2.34 6.475m21.388 11.428v2.084c-1.726 2.204-3.485 3.776-5.279 4.715-1.794.94-3.946 1.418-6.457 1.418-4.459 0-8.115-1.4-11.019-4.185-2.887-2.785-4.339-6.32-4.339-10.626 0-4.305 1.384-7.96 4.134-10.916 2.767-2.955 6.15-4.442 10.147-4.442 3.298 0 6.167 1.11 8.627 3.332 2.46 2.22 3.69 4.885 3.69 7.978v.58H399.97v.393c0 3.144.479 5.86 1.435 8.183.957 2.323 2.341 4.134 4.186 5.433 1.828 1.315 3.741 1.964 5.74 1.964 1.862 0 3.451-.393 4.766-1.162 1.315-.768 3.075-2.357 5.279-4.766M442.678 21.234v8.747h-1.606c-.256-2.204-1.042-3.946-2.357-5.245-1.316-1.298-2.887-1.947-4.749-1.947-1.418 0-2.546.359-3.417 1.06-.854.7-1.298 1.64-1.298 2.818 0 1.179.393 2.17 1.196 3.04.802.872 2.528 1.931 5.193 3.161 3.451 1.572 5.74 3.075 6.85 4.51 1.111 1.435 1.674 3.16 1.674 5.176 0 2.375-.888 4.442-2.665 6.184-1.776 1.743-3.877 2.614-6.32 2.614-1.265 0-2.922-.461-4.989-1.366-1.127-.496-1.879-.752-2.238-.752-.495 0-.922.188-1.247.547-.341.358-.529.82-.598 1.366h-1.366v-9.703h1.366c.496 2.545 1.589 4.578 3.297 6.081 1.709 1.504 3.656 2.256 5.86 2.256 1.418 0 2.597-.479 3.553-1.418.957-.94 1.435-2.102 1.435-3.502 0-1.401-.444-2.495-1.315-3.485-.888-.991-2.785-2.119-5.723-3.4-3.297-1.452-5.467-2.785-6.509-4.049-1.042-1.264-1.571-2.767-1.571-4.561 0-2.22.854-4.151 2.579-5.757 1.709-1.606 3.741-2.409 6.099-2.409 1.093 0 2.289.256 3.57.786.923.359 1.657.547 2.238.547.769 0 1.316-.445 1.691-1.333h1.367v.034z" })), h("defs", null, h("clipPath", { id: "clip0_10377_15535" }, h("path", { fill: "#fff", d: "M0 0H444.165V95H0z" })))));
 };
 
-const pennlibsHeaderCss = ":host{font-family:var(--pl-font-family);font-size:var(--pl-font-size);color:var(--pl-color-fg-default)}*,*:before,*:after{box-sizing:inherit}.viewport-margins{width:100%;max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}a{color:var(--color-fg-menu)}*:focus{box-shadow:0 0 0 2px var(--pl-color-bg-accent), 0 0 0 4px var(--pl-color-bg-accent-emphasis);outline:none}.website-header{--color-fg-service:var(--pl-color-penn-blue);--color-fg-menu:var(--pl-color-fg-default);--color-bg-menu:var(--pl-color-bg-default)}.website-header--dark{--color-fg-service:var(--pl-color-fg-on-emphasis);--color-fg-menu:var(--pl-color-fg-on-emphasis);--color-bg-menu:var(--pl-color-penn-blue)}.website-header__logo-name-container{display:flex;align-items:stretch;margin-right:auto}@media (max-width: 620px){.website-header__logo-name-container{margin-right:6em;flex-direction:column;gap:0.5rem}}.website-header_logo-link{line-height:0}.website-header__logo{max-width:260px;margin-right:1em}@media (max-width: 1000px){.website-header__logo{max-width:200px}}@media (max-width: 620px){.website-header__logo{max-width:190px}}.website-header__service-link{display:flex;justify-content:center;flex-direction:column;text-decoration:none;line-height:1;color:var(--color-fg-service)}@media (min-width: 1001px){.website-header__service-link{padding-left:0.5em}}.website-header__hero .website-header__service-link{border-left:none}.website-header__service-link:hover .website-header__service-name{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:0.1em;text-decoration-color:var(--color-fg-service)}.website-header__service-name{font-size:1.5em;font-weight:500}.website-header__service-lede{font-size:1em}.website-header__inner-container{display:flex;justify-content:space-between;align-items:center;position:relative;padding:1em 0}@media (max-width: 1000px){.website-header__inner-container{flex-direction:column;align-items:flex-start}}@media (max-width: 1000px){.website-header__navigation{width:100%}}.website-header__navigation-list{list-style:none;display:flex;margin:0;padding:0}@media (max-width: 1000px){.website-header__navigation-list{display:none}}@media (max-width: 1000px){.website-header__navigation-list--visible{display:block;margin-top:1rem}.website-header__navigation-list--visible a{display:inline-block}}.website-header__navigation-list button{background-color:transparent;border-width:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;padding:0;color:inherit}.website-header__navigation-list a,.website-header__navigation-list button{display:block;text-decoration:none;cursor:pointer}@media (max-width: 1000px){.website-header__navigation-list a,.website-header__navigation-list button{padding:0.75em 0}}.website-header__navigation-list--visible a,.website-header__navigation-list--visible button{padding:0.5em 0}@media (min-width: 1001px){.website-header__navigation-list a,.website-header__navigation-list button{padding:0.5em}}.website-header__navigation-list a:hover,.website-header__navigation-list button:hover{text-decoration:underline;text-underline-offset:var(--pl-link-text-underline-offset)}.website-header__navigation-button{all:unset;text-transform:uppercase;font-size:0.75em;letter-spacing:0.075em;font-weight:600;padding:0.5em;border-radius:0.25em;position:absolute;right:0;top:1.5em;display:flex;align-items:center;color:var(--color-fg-service);cursor:pointer}@media (min-width: 1001px){.website-header__navigation-button{display:none}}.website-header__navigation-button[aria-expanded=true] svg{rotate:180deg}@media print{.website-header__inner-container>*:not(.website-header__logo-name-container){display:none}}";
+const pennlibsHeaderCss = ":host{font-family:var(--pl-font-family);font-size:var(--pl-font-size);color:var(--pl-color-fg-default)}*,*:before,*:after{box-sizing:inherit}.viewport-margins{width:100%;max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}a{color:var(--color-fg-menu)}*:focus{box-shadow:0 0 0 2px var(--pl-color-bg-accent), 0 0 0 4px var(--pl-color-bg-accent-emphasis);outline:none}.website-header{--color-fg-service:var(--pl-color-penn-blue);--color-fg-menu:var(--pl-color-fg-default);--color-bg-menu:var(--pl-color-bg-default)}.website-header--dark{--color-fg-service:var(--pl-color-fg-on-emphasis);--color-fg-menu:var(--pl-color-fg-on-emphasis);--color-bg-menu:var(--pl-color-penn-blue)}.website-header__logo-name-container{display:flex;align-items:stretch;gap:var(--pl-space-xs) var(--pl-space-m)}.website-header__logo-name-container--has-switcher{column-gap:var(--pl-space-2xs)}slot[name=\"service-switcher\"],slot[name=\"name-end\"]{display:contents}.website-header__name-group{display:flex;align-items:baseline;align-self:center;column-gap:var(--pl-space-xs)}@media (max-width: 620px){.website-header__logo-name-container{margin-right:4.5em;flex-wrap:wrap;align-items:center}}.website-header_logo-link{line-height:0}::slotted([slot=\"service-switcher\"]){display:flex;align-items:center}.website-header__logo{max-width:260px}@media (max-width: 620px){.website-header__logo{max-width:220px}}.website-header__service-link{display:flex;justify-content:center;flex-direction:column;text-decoration:none;line-height:1;color:var(--color-fg-service)}.website-header__hero .website-header__service-link{border-left:none}.website-header__service-link:hover .website-header__service-name{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:0.1em;text-decoration-color:var(--color-fg-service)}.website-header__service-name{font-size:clamp(1.5rem, 1.5cqi + 1.25rem, 1.65rem);font-weight:500}.website-header__service-lede{font-size:1em}.website-header__inner-container{display:flex;justify-content:space-between;align-items:center;position:relative;padding:1em 0}@media (max-width: 1000px){.website-header__inner-container{flex-direction:column;align-items:flex-start}}.website-header__navigation{margin-left:auto}@media (max-width: 1000px){.website-header__navigation{width:100%}}.website-header__navigation-list{list-style:none;display:flex;margin:0;padding:0}@media (max-width: 1000px){.website-header__navigation-list{display:none}}@media (max-width: 1000px){.website-header__navigation-list--visible{display:block;margin-top:1rem}.website-header__navigation-list--visible a{display:inline-block}}.website-header__navigation-list button{background-color:transparent;border-width:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;padding:0;color:inherit}.website-header__navigation-list a,.website-header__navigation-list button{display:block;text-decoration:none;cursor:pointer}@media (max-width: 1000px){.website-header__navigation-list a,.website-header__navigation-list button{padding:0.75em 0}}.website-header__navigation-list--visible a,.website-header__navigation-list--visible button{padding:0.5em 0}@media (min-width: 1001px){.website-header__navigation-list a,.website-header__navigation-list button{padding:0.5em}}.website-header__navigation-list a:hover,.website-header__navigation-list button:hover{text-decoration:underline;text-underline-offset:var(--pl-link-text-underline-offset)}.website-header__navigation-button{all:unset;text-transform:uppercase;font-size:0.75em;letter-spacing:0.075em;font-weight:600;padding:0.5em;border-radius:0.25em;position:absolute;right:0;top:1.5em;display:flex;align-items:center;color:var(--color-fg-service);cursor:pointer}@media (min-width: 1001px){.website-header__navigation-button{display:none}}.website-header__navigation-button[aria-expanded=true] svg{rotate:180deg}@media print{.website-header__inner-container>*:not(.website-header__logo-name-container){display:none}}";
 
 const Header = /*@__PURE__*/ proxyCustomElement(class Header extends HTMLElement {
     constructor(registerHost) {
@@ -29,11 +29,13 @@ const Header = /*@__PURE__*/ proxyCustomElement(class Header extends HTMLElement
         this.theme = 'light';
         this.isMenuOpen = false;
         this.navigation = [];
+        this.hasServiceSwitcher = false;
     }
     componentWillLoad() {
         if (this.navigation.length === 0) {
             this.setNavigation();
         }
+        this.hasServiceSwitcher = !!this.hostElement.querySelector('[slot="service-switcher"]');
     }
     handleToggleMenu() {
         this.isMenuOpen = !this.isMenuOpen;
@@ -55,7 +57,7 @@ const Header = /*@__PURE__*/ proxyCustomElement(class Header extends HTMLElement
         return (h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24", viewBox: "0 -960 960 960", width: "24" }, h("path", { fill: "currentColor", d: "M480-345 240-585l56-56 184 184 184-184 56 56-240 240Z" })));
     }
     render() {
-        return (h("header", { key: '5b9d608f76d32ea50d377d251c2c2153a53b1875', class: `viewport-margins website-header ${this.theme === 'dark' && 'website-header--dark'}` }, h("div", { key: 'b15e4a006b6a29f671df20e8bb65d2e9e71c25f3', class: "website-header__inner-container" }, h("div", { key: '5c3e13c63b317a44dee3b07c2dbcbdc4e33fb40a', class: "website-header__logo-name-container" }, h("a", { key: 'aa2d4a9b55fe73eac1b433da51db7e70c2a9100d', href: "https://www.library.upenn.edu/", class: "website-header_logo-link", "aria-label": "Penn Libraries" }, this.theme === 'dark' ? h(LogoWhite, null) : h(LogoBlue, null)), this.serviceName && (h("a", { key: 'bff559907d2e26bb2e9f055645a68d7b35558ef5', href: "/", class: "website-header__service-link" }, h("span", { key: '30376d9a13d24c78dd10f11c74acc017bb7ef9ee', class: "website-header__service-name" }, this.serviceName), this.serviceLede && h("span", { key: '6bb01b158d0205a4d534b186379c0e00cb1cb076', class: "website-header__service-lede" }, this.serviceLede))), h("slot", { key: 'bff814b020b3a7c4eee900c19a871e47bebbfac7', name: "name-end" })), this.navigation.length > 0 && (h("nav", { key: 'f1949adb87868902885d65a65504f4ee4eb9c799', class: "website-header__navigation" }, h("button", { key: '7cd866c7dfb52caa705a74c8af5bba443c55257e', class: "website-header__navigation-button", "aria-expanded": `${this.isMenuOpen}`, onClick: () => this.handleToggleMenu() }, this.renderMenuIcon(), " Menu"), this.navigation && (h("ol", { key: '84270b993db01e2c46ce8a94be6c61a95c59f40a', class: `website-header__navigation-list ${this.isMenuOpen && 'website-header__navigation-list--visible'}` }, this.navigation.map(element => h("li", { innerHTML: element.outerHTML })))))), h("slot", { key: 'ff3234593474b8f5a63836a6f519d85a5fe73ba2', name: "end" }))));
+        return (h("header", { key: 'f0ff86f1399d53fc31472cd26d69daa6192b6449', class: `viewport-margins website-header ${this.theme === 'dark' && 'website-header--dark'}` }, h("div", { key: 'e364a3aeca7431eb5f95a8289cac2b413fde1ace', class: "website-header__inner-container" }, h("div", { key: 'e5dbed50a04f5081fe3f0e807c3e573a3f62e5c7', class: `website-header__logo-name-container ${this.hasServiceSwitcher ? 'website-header__logo-name-container--has-switcher' : ''}` }, h("a", { key: '22e80653fecd513a90e53c4f9dd86ccfc5d358b5', href: "https://www.library.upenn.edu/", class: "website-header_logo-link", "aria-label": "Penn Libraries" }, this.theme === 'dark' ? h(LogoWhite, null) : h(LogoBlue, null)), h("slot", { key: '89c15b9ceea79bfcb9d0781503119897d677ea81', name: "service-switcher" }), h("div", { key: 'fdc7a319beb5fc9f7dd8efa721c8409f97c4fe0a', class: "website-header__name-group" }, this.serviceName && (h("a", { key: '282bea8d131e3f1f3ed21e4506511e00b6e4283c', href: "/", class: "website-header__service-link" }, h("span", { key: 'c6fb3c1102630ab0dc5063435fd3d9e22db8d7ce', class: "website-header__service-name" }, this.serviceName), this.serviceLede && h("span", { key: '9a5179b2294b0a595f719975acdf3b5e7fda35ed', class: "website-header__service-lede" }, this.serviceLede))), h("slot", { key: '2a4b493eb372dd77c5d6037fdcbad2caaa27eb9f', name: "name-end" }))), this.navigation.length > 0 && (h("nav", { key: '16d0038dcfb95ba8dea9964a285bd9646b4d2b04', class: "website-header__navigation" }, h("button", { key: '5ac1ed990d9c44faa4fcd72e650363784dc9a869', class: "website-header__navigation-button", "aria-expanded": `${this.isMenuOpen}`, onClick: () => this.handleToggleMenu() }, this.renderMenuIcon(), " Menu"), this.navigation && (h("ol", { key: '2e2593193d64a0d28c566ecdd7d633194030c4c9', class: `website-header__navigation-list ${this.isMenuOpen && 'website-header__navigation-list--visible'}` }, this.navigation.map(element => h("li", { innerHTML: element.outerHTML })))))), h("slot", { key: 'a4e98b286e05bc76088dc74997163d39e556df63', name: "end" }))));
     }
     static get assetsDirs() { return ["assets"]; }
     get hostElement() { return this; }
@@ -66,7 +68,8 @@ const Header = /*@__PURE__*/ proxyCustomElement(class Header extends HTMLElement
         "serviceHref": [1, "service-href"],
         "theme": [1],
         "isMenuOpen": [32],
-        "navigation": [32]
+        "navigation": [32],
+        "hasServiceSwitcher": [32]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {