@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap");
.libreon {
  --lr-bg: #fff;
  --lr-children: #19a974;
  --lr-youth: #357edd;
  --lr-teen: #8247d7;
  --lr-mature: #ff9855;
  --lr-explicit: #e95148;
  --lr-rating-letter: 4rem;
  --lr-rating-head: 0.5rem;
  --lr-rating-border: 0.2rem;
  --lr-rating-border-radius: 0.5rem;
  --lr-label-margin: 1rem;
  --lr-rating-width: 5rem;
  --lr-box-width: 26rem;
  --lr-main-line-height: 3.5rem;
  --lr-info-fsize: smaller;
  --lr-info-padding: 0.5rem 1rem; }
  @media (prefers-color-scheme: dark) {
    .libreon {
      --lr-bg: #18191;
      --lr-children: #3ba07b;
      --lr-youth: #558dd5;
      --lr-teen: #a675eb;
      --lr-mature: #dbaa2e;
      --lr-explicit: #d9433a; } }
  .libreon.lr-small, .libreon.lr-tiny {
    --lr-label-margin: .25rem;
    --lr-rating-letter: 2rem;
    --lr-rating-head: .25rem;
    --lr-rating-border: .1rem;
    --lr-rating-border-radius: .25rem;
    --lr-rating-width: 2.5rem;
    --lr-box-width: 13rem;
    --lr-main-line-height: 1.75rem;
    --lr-info-padding: 0.25rem .5rem; }
  .libreon.lr-tiny {
    --lr-box-width: unset;
    --lr-rating-width: 1.2rem; }

.libreon.lr-children {
  border-color: var(--lr-children) !important;
  color: var(--lr-children) !important; }

.libreon.lr-youth {
  border-color: var(--lr-youth) !important;
  color: var(--lr-youth) !important; }

.libreon.lr-teen {
  border-color: var(--lr-teen) !important;
  color: var(--lr-teen) !important; }

.libreon.lr-mature {
  border-color: var(--lr-mature) !important;
  color: var(--lr-mature) !important; }

.libreon.lr-explicit {
  border-color: var(--lr-explicit) !important;
  color: var(--lr-explicit) !important; }

.libreon .lr-label {
  margin-left: var(--lr-label-margin);
  font-weight: 600;
  font-size: larger;
  color: inherit; }

.libreon .lr-box {
  max-width: var(--lr-box-width);
  display: flex;
  background-color: var(--lr-bg);
  border-radius: var(--lr-rating-border-radius);
  border-width: var(--lr-rating-border);
  border-style: solid; }

.libreon .lr-rating {
  font-family: EB Garamond;
  font-weight: 800;
  min-width: var(--lr-rating-width);
  text-transform: uppercase;
  display: flex;
  flex-direction: column; }
  .libreon .lr-rating .lr-head, .libreon .lr-rating .lr-foot, .libreon .lr-rating .lr-main {
    display: flex;
    justify-content: center;
    align-items: center; }
  .libreon .lr-rating .lr-head, .libreon .lr-rating .lr-foot {
    font-size: var(--lr-rating-head);
    text-align: center;
    letter-spacing: 0.2rem;
    padding-left: 0 0 0 0.2rem; }
  .libreon .lr-rating .lr-foot {
    margin-top: auto;
    border-top: solid var(--lr-rating-border);
    border-color: inherit; }
  .libreon .lr-rating .lr-head {
    margin-bottom: auto;
    border-bottom: solid var(--lr-rating-border);
    border-color: inherit; }
  .libreon .lr-rating .lr-main {
    height: 100%;
    padding: 0;
    line-height: var(--lr-main-line-height);
    display: flex;
    font-size: var(--lr-rating-letter); }

.libreon .lr-info {
  padding: var(--lr-info-padding);
  border-left: solid var(--lr-rating-border);
  font-size: var(--lr-info-fsize);
  color: inherit;
  display: flex;
  flex-direction: column;
  justify-content: center; }

.libreon .lr-head {
  font-weight: 600;
  color: inherit; }

.libreon .lr-list {
  font-size: smaller;
  color: inherit; }

.libreon.lr-rating-box {
  display: flex;
  align-items: start; }

.libreon.lr-small .lr-box, .libreon.lr-tiny .lr-box {
  border-top-width: calc(var(--lr-rating-border)*2);
  border-bottom-width: calc(var(--lr-rating-border)*2); }

.libreon.lr-small .lr-rating .lr-head, .libreon.lr-small .lr-rating .lr-foot, .libreon.lr-tiny .lr-rating .lr-head, .libreon.lr-tiny .lr-rating .lr-foot {
  display: none; }

.libreon.lr-small .lr-list, .libreon.lr-tiny .lr-list {
  display: none; }

.libreon.lr-tiny .lr-main {
  font-size: smaller;
  line-height: unset;
  margin-bottom: -4px;
  padding: 0 0.25rem; }

.libreon.lr-tiny .lr-info {
  display: none; }