@import url("https://use.typekit.net/gbh8cmg.css");

@font-face {
  font-family: 'Perpetua';
  src: url('assets/fonts/perpetua.woff2') format('woff2'),
       url('assets/fonts/perpetua.woff') format('woff');
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'Perpetua Fallback';
  src: local('Times New Roman'), local('Times'), local('Liberation Serif');
  size-adjust: 88.76%;
  font-weight: 400;
}

:root {
  --pl-color-penn-red: #990000;
  --pl-color-penn-blue: #011F5B;
  --pl-color-gray-dark: #2D3545;
  --pl-color-gray: #595F6A;
  --pl-color-gray-light: #F5F5F6;
  --pl-color-gray-blue-light: #EEEEF4;
  --pl-color-white: #FFFFFF;
  --pl-color-blue: #0E5696;
  --pl-color-blue-light: #D4E4F2;
  --pl-color-green: #267434;
  --pl-color-green-light: #F1F7E1;
  --pl-color-orange: #BD4718;
  --pl-color-orange-light: #FEEDDD;
  --pl-color-purple: #80317F;
  --pl-color-purple-light: #F2DFED;
  --pl-color-bg-gradient-1: linear-gradient(45deg, rgba(200, 219, 232, 0.8), rgba(239, 210, 215, 0.8));
  --pl-color-bg-gradient-2: linear-gradient(45deg, #dbe9f5, #feefdf);
  --pl-font-size: 16px;
  --pl-font-sans-serif: proxima-nova, system-ui, sans-serif;
  --pl-font-serif: 'Perpetua', 'Perpetua Fallback', serif;
  --pl-link-text-underline-offset: 0.2em;
  --pl-link-text-decoration-thickness: 1px;
  --pl-link-hover-text-decoration-thickness: 2px;
  --pl-viewport-margins-max-width: 1440px;
  --pl-viewport-margins-gutter: 1em;
  --pl-color-fg-default: var(--pl-color-gray-dark);
  --pl-color-fg-subtle: var(--pl-color-gray);
  --pl-color-fg-subtle-on-emphasis: var(--pl-color-gray-light);
  --pl-color-fg-on-emphasis: var(--pl-color-white);
  --pl-color-fg-accent: var(--pl-color-blue);
  --pl-color-fg-success: var(--pl-color-green);
  --pl-color-fg-attention: var(--pl-color-orange);
  --pl-color-fg-info: var(--pl-color-purple);
  --pl-color-bg-default: var(--pl-color-white);
  --pl-color-bg-subtle: var(--pl-color-gray-light);
  --pl-color-bg-subtle-brand: var(--pl-color-gray-blue-light);
  --pl-color-bg-emphasis: var(--pl-color-gray-dark);
  --pl-color-bg-accent: var(--pl-color-blue-light);
  --pl-color-bg-success: var(--pl-color-green-light);
  --pl-color-bg-attention: var(--pl-color-orange-light);
  --pl-color-bg-info: var(--pl-color-purple-light);
  --pl-color-bg-accent-emphasis: var(--pl-color-blue);
  --pl-color-bg-success-emphasis: var(--pl-color-green);
  --pl-color-bg-attention-emphasis: var(--pl-color-orange);
  --pl-color-bg-info-emphasis: var(--pl-color-purple);
  --pl-font-family: var(--pl-font-sans-serif);
  --pl-link-text-underline-offset: 0.2em;
  --pl-link-text-decoration-thickness: 1px;
  --pl-link-hover-text-decoration-thickness: 2px;
  --pl-font-size-5xl: 3.5rem;
  --pl-font-size-4xl: 2.5rem;
  --pl-font-size-3xl: 2rem;
  --pl-font-size-2xl: 1.5rem;
  --pl-font-size-xl: 1.25rem;
  --pl-font-size-l: 1.125rem;
  --pl-font-size-m: 1rem;
  --pl-font-size-s: 0.875rem;
  --pl-font-size-xs: 0.75rem;
  --pl-space-3xs: 0.125rem;
  --pl-space-2xs: 0.25rem;
  --pl-space-xs: 0.5rem;
  --pl-space-s: 0.75rem;
  --pl-space-m: 1rem;
  --pl-space-l: 1.5rem;
  --pl-space-xl: 2rem;
  --pl-space-2xl: 3rem;
  --pl-space-3xl: 4rem;
  --pl-border-radius-subtle: 0.25rem;
  --pl-border-radius: 1rem;
  --pl-focus-box-shadow: 0 0 0 2px var(--pl-color-bg-accent), 0 0 0 4px var(--pl-color-fg-default);
}

body {
  margin: 0;
}

@media (min-width: 768px) {
  :root {
    --pl-viewport-margins-gutter: 3em;
  }
}

@media print {
  body {
    zoom: 80%;
  }
}

.pl-viewport-margins {
  max-width: var(--pl-viewport-margins-max-width);
  margin: 0 auto;
  padding: 0 var(--pl-viewport-margins-gutter, 1rem);
  width: 100%;
}

:not(:defined) {
  visibility: hidden;
}

.hydrated:not(:defined) {
  visibility: visible;
}

:where(.pl-reset) {
  font-weight: 400;
  line-height: 1.5;
  color: var(--pl-color-fg-default);
  accent-color: var(--pl-color-fg-accent);
  overflow-wrap: break-word;

  & :is(*, *::before, *::after) {
    box-sizing: border-box;
    margin: 0;
  }

  & :is(img, picture, video, canvas, svg) {
    display: block;
    max-width: 100%;
  }

  & :is(input, button, textarea, select) {
    font: var(--pl-font-family);
  }

  & input[type="checkbox"] {
    width: var(--pl-space-m);
    height: var(--pl-space-m);
  }

  & :is(h1) {
    text-wrap: pretty;
  }

  & a {
    color: var(--pl-color-fg-accent);
    text-decoration: underline;
    text-underline-offset: var(--pl-link-text-underline-offset);
    text-decoration-thickness: var(--pl-link-text-decoration-thickness);
    font-weight: 500;

    &:hover {
      text-decoration-thickness: 3px;
    }
  }
}

:where(.pl-typeset) {
  font-family: var(--pl-font-family);
  container-type: inline-size;

  & :is(p, .pl-p) {
    font-family: var(--pl-font-family);
  }

  & :is(h1, .pl-h1, h2, .pl-h2) {
    font-family: var(--pl-font-serif);
    font-weight: 400;
  }

  & :is(h3, .pl-h3, h4, .pl-h4, h5, .pl-h5, h6, .pl-h6) {
    font-weight: 600;
  }

  & *+:is(h2) {
    margin-block-start: var(--pl-space-2xl);
  }

  & *+:is(h3, h4, h5, h5) {
    margin-block-start: var(--pl-space-xl);
  }

  & .pl-caps:where(:has(+ :is(h1, h2, h3, h4, h5, h6))) {
    margin-block-start: var(--pl-space-2xl);
  }

  & :where(.pl-caps) + :is(h1, h2, h3, h4, h5, h6) {
    margin-block-start: 0;
  }

  & :is(h1, .pl-h1, h2, .pl-h2) {
    line-height: 1;
    font-family: var(--pl-font-serif);
    color: var(--pl-color-penn-blue);
    background-repeat: no-repeat;
    background-size: 2.25rem 4px;
    background-position: left bottom;
    padding-bottom: var(--pl-space-3xs);
  }

  & :is(h1, .pl-h1) {
    font-size: var(--pl-font-size-5xl);
    font-size: clamp(var(--pl-font-size-4xl), 3cqi + 1rem, var(--pl-font-size-5xl));
    margin-bottom: calc(var(--pl-space-l) - var(--pl-space-xs));
    margin-top: 0;
    background-image: linear-gradient(var(--pl-color-penn-red), var(--pl-color-penn-red));
  }

  & :is(h2, .pl-h2) {
    font-size: var(--pl-font-size-4xl);
    font-size: clamp(var(--pl-font-size-3xl), 1.5cqi + 1.25rem, var(--pl-font-size-4xl));
    margin-bottom: var(--pl-space-m);
    background-image: linear-gradient(#d6d6dc, #d6d6dc);
  }

  & :is(h3, .pl-h3) {
    font-size: var(--pl-font-size-xl);
    font-size: clamp(var(--pl-font-size-l), 0.5cqi + 0.875rem, var(--pl-font-size-xl));
    font-family: var(--pl-font-sans-serif);
    color: var(--pl-color-fg-default);
    margin-bottom: var(--pl-space-m);
    background-image: none;
    padding-bottom: 0;
  }

  & :is(h4, .pl-h4) {
    font-size: var(--pl-font-size-m);
    margin-bottom: var(--pl-space-s);
    background-image: none;
    padding-bottom: 0;
  }
}

.pl-caps,
.pl-caps--subtle {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  vertical-align: middle;
}

.pl-caps--subtle {
  color: var(--pl-color-fg-subtle);
}

.pl-line-length {
  max-width: 60ch;
}

.pl-line-clamp {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--pl-line-clamp, 2);
  line-clamp: var(--pl-line-clamp, 2);
  overflow: hidden;
}

.pl-prose {
  --pl-prose-measure: 60ch;
  --pl-prose-flow: 1.125em;
  --pl-prose-list-flow: 0.5em;
}

.pl-prose > :where(p, ul, ol, dl, blockquote, h2, h3, h4, h5, h6) {
  max-width: var(--pl-prose-measure);
}

.pl-prose > :where(.pl-cards, .pl-grid, .pl-inline-grid, .pl-flex, .pl-inline-flex) {
  max-width: none;
}

.pl-prose > :where(p, ul, ol, dl, blockquote, table, pre, figure) {
  margin-bottom: var(--pl-prose-flow);
}

.pl-prose :where(ul, ol):not(:where(.pl-cards, .pl-grid, .pl-inline-grid, .pl-flex, .pl-inline-flex)) > :where(li) {
  margin-block: var(--pl-prose-list-flow);
}

.pl-prose > :where(.pl-caps, .pl-caps--subtle):where(:has(+ :is(h1, h2, h3, h4, h5, h6))) {
  margin-bottom: var(--pl-space-xs);
}

.pl-border-radius-subtle {
  border-radius: var(--pl-border-radius-subtle);
}

.pl-border-radius {
  border-radius: var(--pl-border-radius);
}

.pl-dl:where(:not(.pl-dl--inline)) {
  display: grid;
  grid-row-gap: 0.25rem;

  & :where(dt) {
    font-weight: 600;
    margin-top: 0.5rem;
  }
}

@media (min-width: 720px) {
  .pl-dl:where(:not(.pl-dl--inline))  {
    grid-template-columns: 12rem 1fr;

    & :where(dt) {
      grid-column: 1 / 2;
      margin-top: 0;
      padding-right: 1rem;
    }

    & :where(dd) {
      grid-column: 2 / 3;
      margin-bottom: 0;
    }
  }
}

@media (min-width: 720px) {
  .pl-dl:where(:not(.pl-dl--inline)) :where(dt:not(:first-of-type)),
  .pl-dl:where(:not(.pl-dl--inline)) :where(dt:not(:first-of-type) + dd) {
    padding-top: 0.75rem;
    margin-top: 0.5rem;
    border-top: solid 1px var(--pl-color-bg-subtle-brand);
  }
}

.pl-dl--inline {
  display: block;

  & :where(dt, dd) {
    display: inline;
    padding-right: 0.5rem;
    margin-bottom: 0;
  }

  & :where(dt) {
    font-weight: 600;
  }

  & :where(dt:not(:first-of-type))::before {
    content: "";
    display: block;
    margin-bottom: 0.25rem;
  }

  & :where(dd)::after {
    content: " ·";
    padding-left: var(--pl-space-xs);
  }

  & :where(dd:has(+ dt))::after {
    all: unset;
  }

  & > :where(*:last-child)::after {
    all: unset;
  }

  & :where(a) {
    color: var(--pl-color-fg-default);
    text-decoration-style: dotted;
    font-weight: 400;

    &:hover {
      text-decoration-style: solid;
      text-decoration-thickness: 2px;
    }
  }
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: none;
  box-shadow: var(--pl-focus-box-shadow);
}

.pl-button {
  border: none;
  outline: none;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--pl-space-2xs);
  padding: var(--pl-space-xs) var(--pl-space-m);
  font-size: 1rem;
  line-height: 1.5;
  font-family: var(--pl-font-family);
  border-radius: var(--pl-border-radius);
  background: var(--pl-color-bg-subtle);
  color: var(--pl-color-fg-default);
}

.pl-button:hover {
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: var(--pl-link-text-underline-offset);
  text-decoration-thickness: var(--pl-link-text-decoration-thickness);
}

a.pl-button:hover {
  text-decoration-thickness: var(--pl-link-hover-text-decoration-thickness);
}

.pl-button:focus {
  box-shadow: var(--pl-focus-box-shadow);
}

.pl-button--accent {
  background: var(--pl-color-bg-accent-emphasis);
  color: var(--pl-color-fg-on-emphasis);
}

.pl-button--success {
  background: var(--pl-color-bg-success-emphasis);
  color: var(--pl-color-fg-on-emphasis);
}

.pl-button--attention {
  background: var(--pl-color-bg-attention-emphasis);
  color: var(--pl-color-fg-on-emphasis);
}

.pl-callout {
  padding: var(--pl-space-m) var(--pl-space-l);
  margin-bottom: var(--pl-space-l);
  border: 1px solid var(--pl-color-fg-subtle);
  border-left-width: 0.25rem;
  border-radius: var(--pl-border-radius-subtle);
  border-left-color: var(--pl-color-fg-accent);
}

.pl-details {
  border-radius: var(--pl-border-radius);
  background: var(--pl-color-bg-subtle);
  border: solid 1px transparent;
}

.pl-details:where([open]) {
  border-color: var(--pl-color-fg-subtle);
}

.pl-details:where([open]) > :where(.pl-details__summary) {
  border-bottom: solid 1px var(--pl-color-fg-subtle);
}

.pl-details__summary :where(h1, h2, h3, h4, h5, h6) {
  margin-bottom: 0;
}

.pl-details__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pl-space-s);
  cursor: pointer;
  list-style: none;
  padding: var(--pl-space-xs) var(--pl-space-m);
}

.pl-details__summary:hover {
  text-decoration: underline;
  text-underline-offset: var(--pl-link-text-underline-offset);
}

.pl-details__summary:focus-visible {
  outline: none;
  box-shadow: var(--pl-focus-box-shadow);
}

.pl-details__summary::-webkit-details-marker {
  display: none;
}

.pl-details__summary::after {
  content: '';
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;
  transition: transform 0.2s ease;
}

.pl-details:where([open]) > :where(.pl-details__summary)::after {
  transform: rotate(180deg);
}

.pl-details__content {
  padding: var(--pl-space-m);
  background: var(--pl-color-bg-default);
  border-radius: 0 0 var(--pl-border-radius) var(--pl-border-radius);

  & > :where(.pl-details:first-of-type, pennlibs-accordion) {
    margin-top: var(--pl-space-m);
  }
}

@media (prefers-reduced-motion: reduce) {
  .pl-details__summary::after {
    transition: none;
  }
}

.pl-cards {
  all: unset;
  --pl-cards-min-width: 22rem;
  display: grid;
  gap: var(--pl-space-l);
  grid-template-columns: repeat(auto-fill, minmax(min(var(--pl-cards-min-width), 100%), 1fr));
}

.pl-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--pl-space-2xs);
}

.pl-card__img {
  border-radius: var(--pl-border-radius-subtle);
  overflow: hidden;
}

.pl-card__heading {
  font-size: var(--pl-font-size-l);
  font-size: clamp(var(--pl-font-size-l), 0.5cqi + 0.875rem, var(--pl-font-size-xl));
  font-weight: 600;
  margin: 0;
  line-height: 1.4;
  text-wrap: pretty;
}

.pl-card__link {
  text-underline-offset: var(--pl-link-text-underline-offset);
  text-decoration-thickness: var(--pl-link-text-decoration-thickness);

  &&::after {
    content: '';
    position: absolute;
    inset: 0;
  }
}

.pl-card__description {
  margin: 0;
  color: var(--pl-color-fg-subtle);
}

.pl-card--callout {
  background-color: var(--pl-color-bg-default);
  border: 1px solid var(--pl-color-fg-default);
  box-shadow: calc(-1 * var(--pl-space-2xs)) var(--pl-space-2xs) 0 var(--pl-color-fg-accent);
  color: var(--pl-color-fg-default);
  padding: var(--pl-space-m) var(--pl-space-l);
  border-radius: var(--pl-border-radius-subtle);

  & :where(.pl-card__link) {
    text-decoration: none;
    color: var(--pl-color-fg-default);

    &:hover {
      text-decoration: underline;
    }
  }
}

.pl-block { display: block; }
.pl-inline { display: inline; }
.pl-inline-block { display: inline-block; }
.pl-flex { display: flex; }
.pl-inline-flex { display: inline-flex; }
.pl-grid { display: grid; }
.pl-inline-grid { display: inline-grid; }
.pl-none { display: none; }

.pl-flex-row { flex-direction: row; }
.pl-flex-col { flex-direction: column; }

.pl-margin-0 { margin: 0; }
.pl-margin-2xs { margin: var(--pl-space-2xs); }
.pl-margin-xs { margin: var(--pl-space-xs); }
.pl-margin-s { margin: var(--pl-space-s); }
.pl-margin-m { margin: var(--pl-space-m); }
.pl-margin-l { margin: var(--pl-space-l); }
.pl-margin-xl { margin: var(--pl-space-xl); }
.pl-margin-2xl { margin: var(--pl-space-2xl); }
.pl-margin-3xl { margin: var(--pl-space-3xl); }

.pl-margin-t-0 { margin-top: 0; }
.pl-margin-t-2xs { margin-top: var(--pl-space-2xs); }
.pl-margin-t-xs { margin-top: var(--pl-space-xs); }
.pl-margin-t-s { margin-top: var(--pl-space-s); }
.pl-margin-t-m { margin-top: var(--pl-space-m); }
.pl-margin-t-l { margin-top: var(--pl-space-l); }
.pl-margin-t-xl { margin-top: var(--pl-space-xl); }
.pl-margin-t-2xl { margin-top: var(--pl-space-2xl); }
.pl-margin-t-3xl { margin-top: var(--pl-space-3xl); }

.pl-margin-b-0 { margin-bottom: 0; }
.pl-margin-b-2xs { margin-bottom: var(--pl-space-2xs); }
.pl-margin-b-xs { margin-bottom: var(--pl-space-xs); }
.pl-margin-b-s { margin-bottom: var(--pl-space-s); }
.pl-margin-b-m { margin-bottom: var(--pl-space-m); }
.pl-margin-b-l { margin-bottom: var(--pl-space-l); }
.pl-margin-b-xl { margin-bottom: var(--pl-space-xl); }
.pl-margin-b-2xl { margin-bottom: var(--pl-space-2xl); }
.pl-margin-b-3xl { margin-bottom: var(--pl-space-3xl); }

.pl-margin-l-0 { margin-left: 0; }
.pl-margin-l-2xs { margin-left: var(--pl-space-2xs); }
.pl-margin-l-xs { margin-left: var(--pl-space-xs); }
.pl-margin-l-s { margin-left: var(--pl-space-s); }
.pl-margin-l-m { margin-left: var(--pl-space-m); }
.pl-margin-l-l { margin-left: var(--pl-space-l); }
.pl-margin-l-xl { margin-left: var(--pl-space-xl); }
.pl-margin-l-2xl { margin-left: var(--pl-space-2xl); }
.pl-margin-l-3xl { margin-left: var(--pl-space-3xl); }

.pl-margin-r-0 { margin-right: 0; }
.pl-margin-r-2xs { margin-right: var(--pl-space-2xs); }
.pl-margin-r-xs { margin-right: var(--pl-space-xs); }
.pl-margin-r-s { margin-right: var(--pl-space-s); }
.pl-margin-r-m { margin-right: var(--pl-space-m); }
.pl-margin-r-l { margin-right: var(--pl-space-l); }
.pl-margin-r-xl { margin-right: var(--pl-space-xl); }
.pl-margin-r-2xl { margin-right: var(--pl-space-2xl); }
.pl-margin-r-3xl { margin-right: var(--pl-space-3xl); }

.pl-margin-x-0 { margin-left: 0; margin-right: 0; }
.pl-margin-x-2xs { margin-left: var(--pl-space-2xs); margin-right: var(--pl-space-2xs); }
.pl-margin-x-xs { margin-left: var(--pl-space-xs); margin-right: var(--pl-space-xs); }
.pl-margin-x-s { margin-left: var(--pl-space-s); margin-right: var(--pl-space-s); }
.pl-margin-x-m { margin-left: var(--pl-space-m); margin-right: var(--pl-space-m); }
.pl-margin-x-l { margin-left: var(--pl-space-l); margin-right: var(--pl-space-l); }
.pl-margin-x-xl { margin-left: var(--pl-space-xl); margin-right: var(--pl-space-xl); }
.pl-margin-x-2xl { margin-left: var(--pl-space-2xl); margin-right: var(--pl-space-2xl); }
.pl-margin-x-3xl { margin-left: var(--pl-space-3xl); margin-right: var(--pl-space-3xl); }

.pl-margin-y-0 { margin-top: 0; margin-bottom: 0; }
.pl-margin-y-2xs { margin-top: var(--pl-space-2xs); margin-bottom: var(--pl-space-2xs); }
.pl-margin-y-xs { margin-top: var(--pl-space-xs); margin-bottom: var(--pl-space-xs); }
.pl-margin-y-s { margin-top: var(--pl-space-s); margin-bottom: var(--pl-space-s); }
.pl-margin-y-m { margin-top: var(--pl-space-m); margin-bottom: var(--pl-space-m); }
.pl-margin-y-l { margin-top: var(--pl-space-l); margin-bottom: var(--pl-space-l); }
.pl-margin-y-xl { margin-top: var(--pl-space-xl); margin-bottom: var(--pl-space-xl); }
.pl-margin-y-2xl { margin-top: var(--pl-space-2xl); margin-bottom: var(--pl-space-2xl); }
.pl-margin-y-3xl { margin-top: var(--pl-space-3xl); margin-bottom: var(--pl-space-3xl); }

.pl-padding-0 { padding: 0; }
.pl-padding-2xs { padding: var(--pl-space-2xs); }
.pl-padding-xs { padding: var(--pl-space-xs); }
.pl-padding-s { padding: var(--pl-space-s); }
.pl-padding-m { padding: var(--pl-space-m); }
.pl-padding-l { padding: var(--pl-space-l); }
.pl-padding-xl { padding: var(--pl-space-xl); }
.pl-padding-2xl { padding: var(--pl-space-2xl); }
.pl-padding-3xl { padding: var(--pl-space-3xl); }

.pl-padding-t-0 { padding-top: 0; }
.pl-padding-t-2xs { padding-top: var(--pl-space-2xs); }
.pl-padding-t-xs { padding-top: var(--pl-space-xs); }
.pl-padding-t-s { padding-top: var(--pl-space-s); }
.pl-padding-t-m { padding-top: var(--pl-space-m); }
.pl-padding-t-l { padding-top: var(--pl-space-l); }
.pl-padding-t-xl { padding-top: var(--pl-space-xl); }
.pl-padding-t-2xl { padding-top: var(--pl-space-2xl); }
.pl-padding-t-3xl { padding-top: var(--pl-space-3xl); }

.pl-padding-b-0 { padding-bottom: 0; }
.pl-padding-b-2xs { padding-bottom: var(--pl-space-2xs); }
.pl-padding-b-xs { padding-bottom: var(--pl-space-xs); }
.pl-padding-b-s { padding-bottom: var(--pl-space-s); }
.pl-padding-b-m { padding-bottom: var(--pl-space-m); }
.pl-padding-b-l { padding-bottom: var(--pl-space-l); }
.pl-padding-b-xl { padding-bottom: var(--pl-space-xl); }
.pl-padding-b-2xl { padding-bottom: var(--pl-space-2xl); }
.pl-padding-b-3xl { padding-bottom: var(--pl-space-3xl); }

.pl-padding-l-0 { padding-left: 0; }
.pl-padding-l-2xs { padding-left: var(--pl-space-2xs); }
.pl-padding-l-xs { padding-left: var(--pl-space-xs); }
.pl-padding-l-s { padding-left: var(--pl-space-s); }
.pl-padding-l-m { padding-left: var(--pl-space-m); }
.pl-padding-l-l { padding-left: var(--pl-space-l); }
.pl-padding-l-xl { padding-left: var(--pl-space-xl); }
.pl-padding-l-2xl { padding-left: var(--pl-space-2xl); }
.pl-padding-l-3xl { padding-left: var(--pl-space-3xl); }

.pl-padding-r-0 { padding-right: 0; }
.pl-padding-r-2xs { padding-right: var(--pl-space-2xs); }
.pl-padding-r-xs { padding-right: var(--pl-space-xs); }
.pl-padding-r-s { padding-right: var(--pl-space-s); }
.pl-padding-r-m { padding-right: var(--pl-space-m); }
.pl-padding-r-l { padding-right: var(--pl-space-l); }
.pl-padding-r-xl { padding-right: var(--pl-space-xl); }
.pl-padding-r-2xl { padding-right: var(--pl-space-2xl); }
.pl-padding-r-3xl { padding-right: var(--pl-space-3xl); }

.pl-padding-x-0 { padding-left: 0; padding-right: 0; }
.pl-padding-x-2xs { padding-left: var(--pl-space-2xs); padding-right: var(--pl-space-2xs); }
.pl-padding-x-xs { padding-left: var(--pl-space-xs); padding-right: var(--pl-space-xs); }
.pl-padding-x-s { padding-left: var(--pl-space-s); padding-right: var(--pl-space-s); }
.pl-padding-x-m { padding-left: var(--pl-space-m); padding-right: var(--pl-space-m); }
.pl-padding-x-l { padding-left: var(--pl-space-l); padding-right: var(--pl-space-l); }
.pl-padding-x-xl { padding-left: var(--pl-space-xl); padding-right: var(--pl-space-xl); }
.pl-padding-x-2xl { padding-left: var(--pl-space-2xl); padding-right: var(--pl-space-2xl); }
.pl-padding-x-3xl { padding-left: var(--pl-space-3xl); padding-right: var(--pl-space-3xl); }

.pl-padding-y-0 { padding-top: 0; padding-bottom: 0; }
.pl-padding-y-2xs { padding-top: var(--pl-space-2xs); padding-bottom: var(--pl-space-2xs); }
.pl-padding-y-xs { padding-top: var(--pl-space-xs); padding-bottom: var(--pl-space-xs); }
.pl-padding-y-s { padding-top: var(--pl-space-s); padding-bottom: var(--pl-space-s); }
.pl-padding-y-m { padding-top: var(--pl-space-m); padding-bottom: var(--pl-space-m); }
.pl-padding-y-l { padding-top: var(--pl-space-l); padding-bottom: var(--pl-space-l); }
.pl-padding-y-xl { padding-top: var(--pl-space-xl); padding-bottom: var(--pl-space-xl); }
.pl-padding-y-2xl { padding-top: var(--pl-space-2xl); padding-bottom: var(--pl-space-2xl); }
.pl-padding-y-3xl { padding-top: var(--pl-space-3xl); padding-bottom: var(--pl-space-3xl); }

.pl-gap-0 { gap: 0; }
.pl-gap-2xs { gap: var(--pl-space-2xs); }
.pl-gap-xs { gap: var(--pl-space-xs); }
.pl-gap-s { gap: var(--pl-space-s); }
.pl-gap-m { gap: var(--pl-space-m); }
.pl-gap-l { gap: var(--pl-space-l); }
.pl-gap-xl { gap: var(--pl-space-xl); }
.pl-gap-2xl { gap: var(--pl-space-2xl); }
.pl-gap-3xl { gap: var(--pl-space-3xl); }

.pl-font-size-xs {
  font-size: var(--pl-font-size-xs);
}

.pl-font-size-s {
  font-size: var(--pl-font-size-s);
}

.pl-font-size-m {
  font-size: var(--pl-font-size-m);
}

.pl-font-size-l {
  font-size: var(--pl-font-size-l);
}

.pl-font-size-xl {
  font-size: var(--pl-font-size-xl);
}

.pl-font-size-2xl {
  font-size: var(--pl-font-size-2xl);
}

.pl-font-size-3xl {
  font-size: var(--pl-font-size-3xl);
}

.pl-font-size-4xl {
  font-size: var(--pl-font-size-4xl);
}

.pl-font-size-5xl {
  font-size: var(--pl-font-size-5xl);
}