@layer utility {

  .scroll-container {
    overflow: auto;
    margin: 2px;
    &.-vlimit {
      max-height: 60vh;
    }
  }

  .reset,
  .styleless {
    display: inlihe-block;
    margin: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    background: transparent;
    border: none;
  }

  .no-data {
    display: block;
    width: min(100vw, 100cqw);
    font-size: 1.4em;
    color: #747474;
    background: #fff;
  }

  .ta-l { text-align: left; }
  .ta-c { text-align: center; }
  .ta-r { text-align: right; }
  .va-t { vertical-align: top; }
  .va-m { vertical-align: middle; }
  .va-b { vertical-align: bottom; }
  .va-bl { vertical-align: baseline; }
  .ws-nw, .nowrap { white-space: nowrap; }
  .mb-0 { margin-bottom: 0px; }
  .mb-1 { margin-bottom: 5px; }
  .mb-2 { margin-bottom: 10px; }
  .mb-3 { margin-bottom: 15px; }
  .mb-4 { margin-bottom: 20px; }
  .mb-5 { margin-bottom: 30px; }
  .m-0 { margin: 0px; }
  .p-0 { padding: 0px; }

  @media print {
    .no-print {
      display: none;
      visibility: hidden;
      font-size: 1px;
    }

    .no-split {
      break-inside: avoid;
      display: block;
    }
  }

  @media screen and (max-width:700px) {
    .hide-xs {
      display: none;
    }
  }

  .flex {
    display: flex;
    align-items: center;
    justify-content: start;
    flex-wrap: wrap;
    row-gap: 8px;

    &.-nowrap {
      flex-wrap: nowrap;
    }

    .push {
      flex: 1;
      min-width: 0;
      height: 0;
      margin-bottom: 0;
    }
  }

  .flex-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 0 4px;
  }

  .flex-row {
    display: flex;
    align-items: end;
    justify-content: start;
    flex-wrap: wrap;
    row-gap: 15px;
    &.-compact {
      row-gap: 15px;
    }
    &.-nowrap {
      flex-wrap: nowrap;
    }
  }

  .pipe-separated + .pipe-separated::before {
    content: "|";
    padding-left: 4px;
    padding-right: 4px;
  }

  .hanging-indent {
    text-indent: -13px;
    padding-left: 13px;
  }

  ul.undecorated {
    list-style-type: none;
    padding: 0;
    margin: 0;
    position: relative;
  }

  ul.item-list,
  .table ul {
    margin-top: 2px;
    margin-bottom: 0px;
    padding-left: 0px;
  }

  ul.item-list.columns,
  .table ul.columns {
    column-width: 22rem;
    column-fill: balance;
    column-rule: 1px solid var(--ts-table-cell-border);
  }

  ul.item-list > li,
  .table ul > li {
    list-style-type: none;
    padding: 0px;
    line-height: 1.4;
  }

  .bold {
    font-weight: bold;
  }

  .page {
    visibility: hidden;
  }

  .do-not-display {
    display: none;
  }

  body .svg {
    &:not(.-right)::before,
    &.-right::after {
      content: "";
      display: inline-block;
      width: .9em;
      height: .9em;
      background: currentColor;
      vertical-align: text-top;
      /*margin-top: 1px;*/
      mask-image: var(--svg);
      mask-repeat: no-repeat;
      mask-size: contain;
      -webkit-mask-image: var(--svg);
      -webkit-mask-repeat: no-repeat;
    }

    &.-triangle-right { --svg: var(--svg-triangle-right); }
    &.-external-link { --svg: var(--svg-external-link); }
    &.-chevron-left { --svg: var(--svg-chevron-left); }
    &.-chevron-right { --svg: var(--svg-chevron-right); }
    &.-plus { --svg: var(--svg-plus); }
    &.-minus { --svg: var(--svg-minus); }
  }
}

:root {
  --svg-triangle-left: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M9,1 L2,6 L9,11 Z'/%3E%3C/svg%3E");
  --svg-triangle-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3,1 L10,6 L3,11 Z'/%3E%3C/svg%3E");
  --svg-triangle-up: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M1,9 L6,2 L11,9 Z'/%3E%3C/svg%3E");
  --svg-triangle-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M1,3 L6,10 L11,3 Z'/%3E%3C/svg%3E");
  --svg-external-link: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");
  --svg-chevron-left: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M8,2 L4,6 L8,10'/%3E%3C/svg%3E");
  --svg-chevron-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4,2 L8,6 L4,10'/%3E%3C/svg%3E");
  --svg-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6,2 L6,10 M2,6 L10,6'/%3E%3C/svg%3E");
  --svg-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M2,6 L10,6'/%3E%3C/svg%3E");
}