/****************************************
  Tags Page (or other term listings)
/****************************************/

.term-listing {
   width: 100%;
   max-width: 800px;
}

   .term-listing details summary {
      display: flex;
      align-items: center;
      font-variant: small-caps;
      font-family: Helvetica, Arial, sans-serif;
      font-weight: bold;
      text-align: left;
   }

      .term-listing details summary .marker::before {
         display: inline-block;
         content: " ";
         min-width: 1ch;
      }

      .term-listing details summary .marker::after {
         display: inline-block;
         content: "◮";
         min-width: 2ch;
         transition: transform .2s;
         transform: rotate(90deg) translate(0em, 0.5em);
      }

   .term-listing details[open] summary .marker::after {
      transform: rotate(180deg) translate(0.75em, 0.125ch);
      transition: transform .2s;
   }

   .term-listing details summary h2 {
      display: inline;
      margin-top: initial;
      margin-left: initial;
      margin-bottom: initial;
   }

   .term-listing details summary .badge {
      min-width: 2em;
      font-size: 1.75rem;
      text-align: center;
      white-space: nowrap;
      border-radius: .5em;
      color: var(--color-box-background);
      background-color: var(--color-border);
   }

      .term-listing details summary .badge::selection,
      .term-listing details summary .badge::-moz-selection {
         color: var(--color-highlight-background);
         background-color: var(--color-highlight-text);
      }

div.panel-collapse ul > li {
   list-style: none;
}