@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
}

a {
  color: currentColor;
}

button {
  background: none;
  outline: none;
  border: none;
}

:root {
  --font: "Yetson Sans", sans-serif;
  --font-w: 600;
  --serif: "Recife";
  --font-size: 12px;
  --font-size-sm: 10px;
}

sup {
  line-height: 0;
}

.authors {
  list-style-type: none;
}
.authors li {
  display: inline;
}
.authors li::after {
  content: ", ";
}
.authors li:last-of-type::after {
  content: "";
}
.authors li .name {
  text-transform: uppercase;
}

:root {
  --yellow: rgb(255, 210, 48);
  --orange:	rgb(255, 171, 48);
  --coral:	rgb(255, 112, 48);
  --pink:	rgb(255, 82, 131);
  --magenta:	rgb(240, 100, 255);
  --lavender: rgb(195, 115, 255);
  --blue-sky: rgb(80, 185, 255);
  --aqua:	rgb(48, 232, 210);
  --lime:	rgb(175, 232, 48);
  --green: rgb(130, 210, 48);
  --amber-gold: rgb(225, 155, 40);
  --amber-gold_light: rgb(255, 243, 210);
  --apricot: rgb(255, 163, 108);
  --apricot_light: rgb(255, 232, 215);
  --burnt-sienna: rgb(240, 106, 80);
  --burnt-sienna_medium: rgb(252, 183, 165);
  --burnt-sienna_light: rgb(255, 222, 215);
  --rosewood-pink: rgb(238, 95, 134);
  --rosewood-pink_light: rgb(255, 225, 235);
  --orchid: rgb(215, 100, 218);
  --orchid_light: rgb(245, 223, 248);
  --periwinkle: rgb(170, 130, 255);
  --periwinkle_light: rgb(234, 227, 255);
  --cool-cyan: rgb(100, 195, 235);
  --cool-cyan_light: rgb(221, 243, 255);
  --mint-teal: rgb(88, 220, 200);
  --mint-teal_light: rgb(212, 250, 244);
  --wasabi-green: rgb(185, 220, 80);
  --wasabi-green_light: rgb(245, 255, 210);
  --olive-lime: rgb(145, 200, 60);
  --olive-lime_light: rgb(236, 251, 200);
  --color-primary: rgb(245, 180, 20);
  --color-primary_bg: rgb(255, 210, 48);
  --color-primary_light: rgb(255, 235, 180);
  --color-primary_light: rgb(255, 245, 210);
  --color-secondary: rgb(125, 90, 200);
  --color-secondary_dark: rgb(85, 65, 128);
  --neutral-0: var(--background);
  --neutral-50: oklch(98% 0 0);
  --neutral-100: oklch(97% 0 0);
  --neutral-200: oklch(92.2% 0 0);
  --neutral-300: oklch(87% 0 0);
  --neutral-400: oklch(70.8% 0 0);
  --neutral-500: oklch(55.6% 0 0);
  --neutral-600: oklch(43.9% 0 0);
  --neutral-700: oklch(37.1% 0 0);
  --neutral-800: oklch(26.9% 0 0);
  --neutral-900: oklch(20.5% 0 0);
  --neutral-950: oklch(14.5% 0 0);
  --color-text: rgb(0, 40, 80);
  --color-text: var(--neutral-900);
  --background: white;
  --background-light: #f6f5f5;
  --background-light: rgb(251, 251, 250);
  --color-text-light: var(--neutral-600);
  --color-text-medium: #6B655E;
  --color-text-light: #6B7280;
  --color-border: rgb(225, 225, 239);
}
:root [data-type=revue] {
  --color-accent: var(--amber-gold)!important;
  --color-accent_light: var(--amber-gold_light)!important;
}
:root [data-type=encyclopedie] {
  --color-accent: var(--periwinkle);
  --color-accent_light: var(--periwinkle_light);
}
:root [data-type=bulletin] {
  --color-accent: var(--rosewood-pink);
  --color-accent_light: var(--rosewood-pink_light);
}

:root {
  --unit: 20px;
  --header-h: calc(var(--unit)*3.5);
  --folder-h: calc(var(--unit)*2.5);
  --reco-w: 28vw;
  --margin-main: 20px;
  --padding-main: 30px;
  --padding-icon: 6px;
  --padding: 6px;
  --w-border: 1px;
  --radius-block: 30px;
  --padding-block: 20px;
  --padding-button: 16px;
  --gap-block: 10px;
  --h-button: calc(var(--unit)*1.75);
}

body {
  color: var(--color-text);
  background-color: var(--background);
  background-color: var(--background-light);
  font-family: var(--font);
  font-size: var(--font-size);
  font-weight: var(--font-w);
  line-height: 1.2em;
  --radius: 3px;
}

html, body {
  scroll-behavior: smooth;
}

.link-block {
  position: absolute;
  display: block;
  inset: 0;
  width: auto;
  z-index: 20;
}

.btn {
  color: var(--color-text);
  font-family: var(--font);
  font-weight: var(--font-w);
  font-size: 1em;
  white-space: nowrap;
  height: calc(var(--unit) * 1);
  min-width: calc(var(--unit) * 1);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn svg {
  fill: var(--color-text);
  width: calc(var(--unit) * 0.75);
}
.btn .icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn .nbr {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-left: 1ch;
  background-color: var(--neutral-100);
  color: var(--neutral-600);
  font-weight: 800;
  min-width: var(--unit);
  height: var(--unit);
  border-radius: calc(var(--unit) * 0.5);
  padding-inline: 4px;
  font-size: var(--font-size-sm);
}
.btn a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: currentColor;
}
.btn .icon + .text {
  padding-left: 1ch;
}
.btn .text + .icon {
  padding-left: 1ch;
}
.btn .icon + .icon {
  padding-left: 4px;
}
.btn .icon-arrow-right {
  position: relative;
}
.btn .icon-arrow-right svg {
  width: 10px;
}
.btn .icon-bookmark-filled svg,
.btn .icon-bookmark svg {
  width: calc(var(--unit) * 0.5);
}
.btn .icon-read-filled svg,
.btn .icon-read-outline svg {
  width: calc(var(--unit) * 0.85);
}
.btn .icon-folder svg {
  width: calc(var(--unit) * 0.7) !important;
}
.btn .icon-arrow-bottom {
  position: relative;
  top: 1px;
}
.btn .icon-arrow-bottom svg {
  width: calc(var(--unit) * 0.5);
}

.btn-transparent:hover {
  color: var(--neutral-500);
}
.btn-transparent:hover svg {
  fill: var(--neutral-500);
}

.btn-outline,
.btn-color-outline,
.btn-color {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
}

.btn-outline {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-500);
}
.btn-outline:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
.btn-outline:hover svg {
  fill: var(--neutral-600);
}

.btn-color {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-200);
  background-color: var(--color-primary_bg);
  color: var(--neutral-900);
}
.btn-color svg {
  fill: var(--neutral-700);
}
.btn-color:hover {
  border: 1px solid var(--neutral-900);
  background-color: var(--color-primary_light);
}

.btn-color-outline {
  border: 1px solid var(--color-primary);
}
.btn-color-outline .text {
  color: var(--color-primary);
}
.btn-color-outline svg {
  fill: var(--color-primary);
}

#section-folder {
  --bg-folder: var(--background-light);
  margin-top: calc(var(--header-h) * 1);
  padding-right: calc(var(--padding-main) * 1);
  --right: 36px;
  height: var(--folder-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
#section-folder::after {
  content: "";
  display: block;
  width: 40px;
  height: calc(var(--unit) * 2);
  position: absolute;
  top: 10px;
  right: calc(var(--right) + var(--unit));
  background: linear-gradient(to right, transparent, var(--bg-folder));
}
#section-folder .container {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 1.75em;
  overflow-x: scroll;
  height: 100%;
  width: calc(100% - var(--right));
  padding-left: var(--padding-main);
  scrollbar-width: none;
}
#section-folder .container::-webkit-scrollbar {
  display: none;
}
#section-folder .container .btn {
  flex-shrink: 0;
}

.search-bar {
  flex-grow: 1;
  --button-w: 20px;
  display: grid;
  grid-template-columns: calc(var(--button-w) * 3) 1fr calc(var(--button-w) * 1.5);
  place-items: center;
  border: var(--border);
  height: calc(var(--unit) * 2);
  background-color: var(--background);
  border-radius: var(--radius);
}
.search-bar .btn-history {
  height: 100%;
  width: 100%;
  border-right: var(--border);
  align-self: center;
}
.search-bar .btn-history .icon-history svg {
  width: calc(var(--unit) * 1);
}
.search-bar .bar-search__input {
  grid-column: 2/end;
  grid-row: 1;
  display: block;
  outline: none;
  width: 100%;
  border: none;
  padding-left: 16px;
  padding-right: calc(var(--button-w) * 3);
  flex-grow: 1;
  font-size: 1rem;
}
.search-bar .bar-search__input::-moz-placeholder {
  font-family: var(--font);
}
.search-bar .bar-search__input::placeholder {
  font-family: var(--font);
}
.search-bar .bar-search__btn {
  grid-column: 3;
  grid-row: 1;
  width: var(--button-w);
  height: var(--button-w);
  margin-left: calc(var(--button-w) * -1);
}

#home__hero {
  --top: calc(var(--unit)*2.5);
  margin-top: var(--top);
  padding-left: 360px;
}
#home__hero p {
  position: absolute;
  top: var(--top);
  color: var(--color-primary);
}
#home__hero p,
#home__hero span {
  font-family: var(--serif);
  font-variation-settings: "opsz" 100, "wght" 200;
  font-variation-settings: "opsz" 100, "wght" 200;
  font-size: 36px;
  line-height: 1.2em;
}
#home__hero .resource-count-container {
  margin-left: 39ch;
}
#home__hero span {
  display: block;
}

.resource-count-container {
  position: relative;
  height: 3rem;
  overflow: hidden;
}

.resource-count-item {
  position: absolute;
  opacity: 0;
  transition: all 0.3s ease-in-out;
}

.resource-count-item.prev {
  transform: translateY(-3rem);
}

.resource-count-item.current {
  opacity: 1;
  transform: translateY(0rem);
}

.resource-count-item.next {
  transform: translateY(3rem);
}

.card {
  --padding-card: 10px;
  font-size: var(--font-size-sm);
  min-width: 340px;
  display: flex;
  flex-direction: column;
}
.card .article-infos {
  flex-grow: 1;
}
.card .group-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: calc(var(--unit) * 1.5);
  border-bottom: 1px solid var(--neutral-200);
  padding-bottom: calc(var(--unit) * 0.25);
}
.card .group-top .type {
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 700;
  background-color: var(--color-accent_light);
  color: var(--color-accent);
  fill: var(--color-accent);
  height: calc(var(--unit) * 1.25);
  padding-inline: 0.5em;
  padding-right: 1ch;
  border-radius: var(--radius);
}
.card .group-top .type .text {
  padding-left: 1ch;
}
.card .group-top .type svg {
  fill: var(--color-accent);
  width: calc(var(--unit) * 0.75);
}
.card .group-top .type:hover {
  cursor: pointer;
}
.card .group-top .type:hover .text, .card .group-top .type:hover .icon {
  opacity: 0.7;
}
.card .group-bottom {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0.25em var(--padding-card);
  height: calc(var(--unit) * 1.5);
  padding: 0em var(--padding-card);
  border-top: 1px solid var(--neutral-100);
}
.card .btn-go-to {
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.75em;
}
.card .context, .card .actions {
  z-index: 10;
}
.card .context {
  display: flex;
  align-items: center;
}
.card .actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 3px;
}
.card .type {
  display: flex;
  align-items: center;
  font-weight: 700;
  padding-right: 1ch;
  font-size: var(--font-size-sm);
}
.card .type .text {
  padding-left: 0.75ch;
}
.card .type svg {
  position: relative;
  top: 1px;
  height: 1em;
  fill: currentColor;
}
.card .editor {
  padding-left: 1ch;
  font-size: var(--font-size-sm);
}
.card .article-infos {
  z-index: 10;
  position: relative;
  grid-column: span 2;
  position: relative;
  padding: var(--padding-card) 0px;
}
.card .article-infos h1, .card .article-infos .details, .card .article-infos .start-abstract {
  z-index: 10;
}
.card .article-infos::after {
  display: none;
  ---padding: 10px;
  z-index: 0;
  content: "";
  width: calc(100% + var(--padding) * 1);
  height: calc(100% + var(--padding) * 1.5);
  top: 0px;
  left: calc(var(--padding) * -0.5);
  position: absolute;
  background-color: var(--neutral-50);
  border-radius: 3px;
}
.card .article-infos:hover {
  cursor: pointer;
}
.card .details {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  align-items: center;
}
.card .authors, .card .date, .card .source {
  height: calc(var(--unit) * 1.25);
  padding-inline: 0.5rem;
  display: inline-flex;
  align-items: center;
  font-weight: var(--font-w);
  font-size: var(--font-size-sm);
  border: 1px solid var(--neutral-100);
  color: var(--neutral-500);
  text-overflow: ellipsis;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--font-size-sm);
}
.card .lock {
  border-radius: 3px;
  background-color: var(--neutral-200);
  margin-right: 1ch;
  width: calc(var(--unit) * 1.25);
  display: flex;
  align-items: center;
  justify-content: center;
}
.card .lock svg {
  width: 15px;
  position: relative;
  left: -8px;
  top: 3px;
}
.card .lock .icon-lock {
  position: relative;
  left: 8px;
  top: -1px;
}
.card [data-lock=false] {
  display: none !important;
}
.card .abstract {
  display: none;
}

.card .icon-read-filled {
  display: none;
}
.card .icon-bookmark-filled {
  display: none;
}
.card .btn-read {
  display: none;
}

.card[data-read=true] .article-infos {
  opacity: 0.5;
}

.card[data-bookmark=true] .icon-bookmark {
  display: none;
}
.card[data-bookmark=true] .icon-bookmark-filled {
  display: block;
}

.card .text-results {
  margin-top: calc(var(--unit) * 0.5);
}
.card .text-results p {
  color: var(--neutral-500);
  max-width: 100ch;
  font-family: var(--serif);
  font-variation-settings: "opsz" 0, "wght" 300;
  font-size: 1.2em;
  line-height: 1.4em;
}
.card .text-results p .hightlight {
  background-color: var(--color-primary_light);
  font-variation-settings: "opsz" 0, "wght" 700;
  padding: 2px 0.2ch;
}

.card__block:hover {
  box-shadow: 1px 1px 0px 0px var(--neutral-400) !important;
  background-color: var(--neutral-50) !important;
}
.card__block .details .lock {
  display: none;
}
.card__block .group-right {
  display: none;
}
.card__block .text-results {
  display: none;
}
.card__block .actions .lock {
  display: none;
}
.card__block [data-lock=false] {
  display: none !important;
}
.card__block .authors, .card__block .date, .card__block .source {
  border-color: var(--neutral-200);
}
.card__block .article-infos h1 {
  font-size: 1.4em;
  font-weight: 700;
  line-height: 1.2em;
  font-family: var(--font);
  margin-top: calc(var(--unit) * 0.25);
  margin-bottom: calc(var(--unit) * 0.5);
}
.card__block .article-infos .start-abstract {
  color: var(--neutral-400);
  margin-top: calc(var(--unit) * 0.5);
}
.card__block .article-infos figure {
  width: 100%;
  aspect-ratio: 16/9;
  display: block;
  margin-top: calc(var(--unit) * 0.25);
  margin-bottom: calc(var(--unit) * 0.75);
}
.card__block .article-infos figure img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.card__block .article-infos:hover h1 {
  -webkit-text-decoration: underline var(--neutral-300);
          text-decoration: underline var(--neutral-300);
}
.card__block .article-infos:hover figure {
  opacity: 0.7;
}

.card__inline {
  display: grid;
  grid-template-columns: 1fr 150px;
  grid-template-rows: calc(var(--unit) * 1.5) auto auto;
  -moz-column-gap: calc(var(--unit) * 2);
       column-gap: calc(var(--unit) * 2);
  margin-bottom: calc(var(--unit) * 1.5);
}
.card__inline [data-lock=false] {
  display: none !important;
}
.card__inline .actions .btn-bookmark,
.card__inline .actions .btn-read {
  display: none;
}
.card__inline .group-top {
  grid-column: 1;
  grid-row: 1;
  flex-direction: row-reverse;
  justify-content: flex-end;
}
.card__inline .article-infos {
  grid-column: 1;
  grid-row: 2;
}
.card__inline .article-infos h1 {
  font-size: 1.9em;
  font-weight: 600;
  line-height: 1.2em;
  font-family: var(--font);
  margin-bottom: calc(var(--unit) * 0.75);
}
.card__inline .article-infos .start-abstract {
  display: none;
}
.card__inline .group-right {
  grid-column: 2;
  grid-row: 1/3;
}
.card__inline .text-results {
  grid-column: 1;
  grid-row: 3;
  padding-bottom: var(--unit);
  border-bottom: 1px solid var(--neutral-100);
}
.card__inline .group-right {
  padding-top: calc(var(--unit) * 1.5);
}
.card__inline .group-right .btn-go-to {
  margin-bottom: calc(var(--unit) * 0.5);
}
.card__inline .group-right .btn-folder .text {
  color: var(--neutral-300);
}
.card__inline .group-right .btn-folder svg {
  fill: var(--neutral-300);
}
.card__inline .btn-go-to,
.card__inline .btn-bookmark {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-200);
  width: 100%;
  justify-content: flex-start;
}
.card__inline .btn-go-to:hover,
.card__inline .btn-bookmark:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
.card__inline .btn-go-to:hover svg,
.card__inline .btn-bookmark:hover svg {
  fill: var(--neutral-600);
}
.card__inline .btn-go-to a,
.card__inline .btn-bookmark a {
  justify-content: flex-start;
}
.card__inline .btn-bookmark {
  padding-inline: 1em;
}
.card__inline .abstract {
  display: none;
  justify-content: flex-end;
  --color: var(--neutral-400);
  margin-top: calc(var(--unit) * -0.5);
  padding-bottom: calc(var(--unit) * 0.5);
  border-bottom: 1px solid var(--neutral-100);
}
.card__inline .abstract svg {
  fill: var(--color);
}
.card__inline .abstract .text {
  color: var(--color);
  font-size: var(--font-size);
}
.card__inline .article-infos:hover h1 {
  -webkit-text-decoration: underline var(--neutral-400);
          text-decoration: underline var(--neutral-400);
}
.card__inline .group-right .icon {
  padding-left: 0px !important;
}
.card__inline .group-right .icon-bookmark-filled {
  display: none;
}

.title-filter {
  border-bottom: 1px solid var(--neutral-200);
  display: flex;
  justify-content: space-between;
}
.title-filter p {
  line-height: 1.2em;
  padding: 10px 0px;
}
.title-filter svg {
  width: 10px;
}

.nav-pages {
  display: flex;
  align-items: center;
  gap: 6px;
}
.nav-pages .left {
  transform: rotate(180deg);
  transform-origin: center center;
}
.nav-pages .arrow-double span + span {
  position: relative;
  left: -10px;
}

.tabs {
  margin-bottom: calc(var(--unit) * 2);
  height: calc(var(--unit) * 1);
  border-bottom: 1px solid var(--neutral-200);
  display: flex;
  gap: calc(var(--unit) * 1);
  align-items: center;
}
.tabs .btn-tab {
  color: var(--color-text);
  font-family: var(--font);
  font-weight: var(--font-w);
  font-size: 1em;
  white-space: nowrap;
  height: calc(var(--unit) * 1);
  min-width: calc(var(--unit) * 1);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: calc(var(--unit) * 1);
  padding-inline: calc(var(--unit) * 0.5);
  border-bottom: 2px solid transparent;
}
.tabs .btn-tab svg {
  fill: var(--color-text);
  width: calc(var(--unit) * 0.75);
}
.tabs .btn-tab .icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.tabs .btn-tab .nbr {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-left: 1ch;
  background-color: var(--neutral-100);
  color: var(--neutral-600);
  font-weight: 800;
  min-width: var(--unit);
  height: var(--unit);
  border-radius: calc(var(--unit) * 0.5);
  padding-inline: 4px;
  font-size: var(--font-size-sm);
}
.tabs .btn-tab a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: currentColor;
}
.tabs .btn-tab .icon + .text {
  padding-left: 1ch;
}
.tabs .btn-tab .text + .icon {
  padding-left: 1ch;
}
.tabs .btn-tab .icon + .icon {
  padding-left: 4px;
}
.tabs .btn-tab .icon-arrow-right {
  position: relative;
}
.tabs .btn-tab .icon-arrow-right svg {
  width: 10px;
}
.tabs .btn-tab .icon-bookmark-filled svg,
.tabs .btn-tab .icon-bookmark svg {
  width: calc(var(--unit) * 0.5);
}
.tabs .btn-tab .icon-read-filled svg,
.tabs .btn-tab .icon-read-outline svg {
  width: calc(var(--unit) * 0.85);
}
.tabs .btn-tab .icon-folder svg {
  width: calc(var(--unit) * 0.7) !important;
}
.tabs .btn-tab .icon-arrow-bottom {
  position: relative;
  top: 1px;
}
.tabs .btn-tab .icon-arrow-bottom svg {
  width: calc(var(--unit) * 0.5);
}
.tabs .btn-tab .text {
  font-weight: 800;
}
.tabs .btn-tab.selected {
  border-color: var(--color-primary);
}
.tabs .btn-tab:not(.selected):hover {
  border-color: var(--neutral-300);
}
.tabs aside {
  flex-grow: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: relative;
  top: calc(var(--unit) * -0.5);
}
.tabs aside .btn-filter {
  color: var(--color-text);
  font-family: var(--font);
  font-weight: var(--font-w);
  font-size: 1em;
  white-space: nowrap;
  height: calc(var(--unit) * 1);
  min-width: calc(var(--unit) * 1);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-200);
}
.tabs aside .btn-filter svg {
  fill: var(--color-text);
  width: calc(var(--unit) * 0.75);
}
.tabs aside .btn-filter .icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.tabs aside .btn-filter .nbr {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-left: 1ch;
  background-color: var(--neutral-100);
  color: var(--neutral-600);
  font-weight: 800;
  min-width: var(--unit);
  height: var(--unit);
  border-radius: calc(var(--unit) * 0.5);
  padding-inline: 4px;
  font-size: var(--font-size-sm);
}
.tabs aside .btn-filter a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: currentColor;
}
.tabs aside .btn-filter .icon + .text {
  padding-left: 1ch;
}
.tabs aside .btn-filter .text + .icon {
  padding-left: 1ch;
}
.tabs aside .btn-filter .icon + .icon {
  padding-left: 4px;
}
.tabs aside .btn-filter .icon-arrow-right {
  position: relative;
}
.tabs aside .btn-filter .icon-arrow-right svg {
  width: 10px;
}
.tabs aside .btn-filter .icon-bookmark-filled svg,
.tabs aside .btn-filter .icon-bookmark svg {
  width: calc(var(--unit) * 0.5);
}
.tabs aside .btn-filter .icon-read-filled svg,
.tabs aside .btn-filter .icon-read-outline svg {
  width: calc(var(--unit) * 0.85);
}
.tabs aside .btn-filter .icon-folder svg {
  width: calc(var(--unit) * 0.7) !important;
}
.tabs aside .btn-filter .icon-arrow-bottom {
  position: relative;
  top: 1px;
}
.tabs aside .btn-filter .icon-arrow-bottom svg {
  width: calc(var(--unit) * 0.5);
}
.tabs aside .btn-filter:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
.tabs aside .btn-filter:hover svg {
  fill: var(--neutral-600);
}

.breadcrumb {
  font-size: var(--font-size-sm);
  color: var(--neutral-400);
  margin-top: calc(var(--unit) * 1);
  margin-bottom: calc(var(--unit) * 1);
}
.breadcrumb a {
  text-decoration: none;
}
.breadcrumb a:hover {
  text-decoration: underline;
}
.breadcrumb .actual {
  font-weight: 800;
  color: var(--neutral-600);
}

#page-article__toolbox {
  background-color: var(--background);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: calc(var(--unit) * 1);
  padding-bottom: calc(var(--unit) * 1);
  z-index: 200;
  position: sticky;
  top: var(--header-h);
}
#page-article__toolbox .btn {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-200);
}
#page-article__toolbox .btn:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
#page-article__toolbox .btn:hover svg {
  fill: var(--neutral-600);
}
#page-article__toolbox .group-btn {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: calc(var(--unit) * 0.25);
}

#page-article__search,
#page-article__toc {
  display: none;
}

#group-label-aside {
  display: flex;
  align-items: center;
}
#group-label-aside label {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-200);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
#group-label-aside label:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
#group-label-aside label:hover svg {
  fill: var(--neutral-600);
}
#group-label-aside label svg {
  width: calc(var(--unit) * 0.8);
  height: calc(var(--unit) * 0.8);
  position: relative;
  top: 1px;
}
#group-label-aside label[for=input_aside-null] {
  display: none;
  z-index: 100;
  background-color: transparent !important;
  border: none !important;
  position: absolute;
  width: calc(var(--unit) * 1.5);
}

input[name=aside] {
  display: none;
}

#input_aside-toc:checked ~ #page-article__toolbox #group-label-aside label[for=input_aside-null] {
  display: block !important;
  left: 0px;
}
#input_aside-toc:checked ~ #page-article__toolbox #group-label-aside label[for=input_aside-toc] {
  border-color: var(--color-primary);
}
#input_aside-toc:checked ~ #page-article__toolbox #group-label-aside label[for=input_aside-toc] svg {
  fill: var(--color-primary);
}

#input_aside-search:checked ~ #page-article__toolbox #group-label-aside label[for=input_aside-null] {
  left: calc(var(--unit) * 1.75);
  display: block !important;
}
#input_aside-search:checked ~ #page-article__toolbox #group-label-aside label[for=input_aside-search] {
  border-color: var(--color-primary);
}
#input_aside-search:checked ~ #page-article__toolbox #group-label-aside label[for=input_aside-search] svg {
  fill: var(--color-primary);
}

#aside__toc,
#aside__search {
  display: none;
}

.aside-reco {
  width: var(--reco-w);
  border-left: 1px solid var(--neutral-200);
  position: fixed;
  top: var(--header-h);
  right: 0px;
  height: calc(100vh - var(--header-h));
  top: var(--header-h);
  overflow-y: scroll;
  scrollbar-width: none;
  background-color: var(--background);
  padding-inline: calc(var(--unit) * 1);
  padding-top: calc(var(--unit) * 1.5);
  padding-bottom: 30vh;
}
.aside-reco::-webkit-scrollbar {
  display: none;
}
.aside-reco .section-title {
  font-weight: 800;
  font-size: 1rem;
  line-height: 1.2em;
  color: var(--color-text);
  display: flex;
  align-items: center;
  margin-bottom: calc(var(--unit) * 1.5);
}
.aside-reco .section-title .icon {
  align-items: center;
  position: relative;
  top: 1px;
  padding-right: 1ch;
}
.aside-reco .section-title .icon svg {
  width: calc(var(--unit) * 0.75);
}
.aside-reco .card__block {
  --border: 1px solid var(--neutral-200);
  background-color: var(--background-light);
  border-radius: 10px;
  box-shadow: 1px 1px 0px 0px var(--neutral-200);
  padding: calc(var(--unit) * 0.75);
  margin-bottom: calc(var(--unit) * 1);
  padding-bottom: calc(var(--unit) * 0.25);
}
.aside-reco .card__block .group-bottom {
  display: none;
}

#header {
  height: var(--header-h);
  width: 100vw;
  --gap: 24px;
  background-color: var(--background);
  box-shadow: var(--neutral-50) 0px 3px 5px 0px;
  position: fixed;
  top: 0px;
  left: 0px;
  display: flex;
  align-items: center;
  gap: var(--gap);
  padding: 0px var(--padding-main);
  border-bottom: 1px solid var(--color-border);
  z-index: 1000;
}
#header #logo {
  display: inline-block;
  height: 100%;
  width: auto;
}

.header__logo {
  height: 100%;
  flex-grow: 1;
}
.header__logo #logo svg {
  width: 140px;
  fill: var(--color-text);
}

.header__menu {
  height: 100%;
  flex-grow: 1;
}

.header__connexion {
  display: flex;
  align-items: center;
  gap: 10px;
  gap: var(--gap);
}

.header__about {
  display: flex;
  align-items: center;
  gap: var(--gap);
}

body {
  display: flex;
  flex-direction: column;
}

main {
  background-color: var(--background);
  padding-inline: var(--padding-main);
  padding-bottom: 20vh;
  margin-top: var(--header-h);
  position: relative;
}

body {
  --margin-hero: 240px;
}

.home__section .title-container {
  display: flex;
  align-items: center;
  gap: 30px;
  justify-content: space-between;
}
.home__section .title-container .consultation {
  color: var(--neutral-200);
  flex-grow: 1;
}
.home__section .title-container .btn {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-200);
}
.home__section .title-container .btn:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
.home__section .title-container .btn:hover svg {
  fill: var(--neutral-600);
}
.home__section .section-title {
  font-weight: 800;
  font-size: 1rem;
  line-height: 1.2em;
  color: var(--color-text);
  display: flex;
  align-items: center;
  font-size: 1.2em;
}
.home__section .section-title .icon {
  align-items: center;
  position: relative;
  top: 1px;
  padding-right: 1ch;
}
.home__section .section-title .icon svg {
  width: calc(var(--unit) * 0.75);
}

#home-search {
  padding-top: calc(var(--unit) * 2);
}
#home-search .container-section {
  --border: 1px solid var(--neutral-200);
  background-color: var(--background-light);
  border-radius: 10px;
  box-shadow: 1px 1px 0px 0px var(--neutral-200);
  padding: calc(var(--unit) * 0.75);
  padding: calc(var(--unit) * 2) calc(var(--unit) * 1);
  display: flex;
  align-items: center;
  gap: calc(var(--unit) * 1.5);
}
#home-search .search-bar {
  flex-grow: 1;
}

#home-search__folder {
  height: calc(var(--unit) * 2);
}

#home-search__avanced {
  display: flex;
  justify-content: flex-end;
  padding: calc(var(--unit) * 0.5) calc(var(--unit) * 0.75);
}
#home-search__avanced .btn {
  text-decoration: underline;
}

#home__quick-nav {
  margin-top: calc(var(--unit) * 3);
}

.home-reco {
  margin-top: calc(var(--unit) * 1);
  display: grid;
  row-gap: calc(var(--unit) * 1);
  grid-template-columns: auto calc(var(--unit) * 1);
  grid-template-rows: auto auto;
}
.home-reco + .home-reco {
  margin-top: calc(var(--unit) * 2);
}
.home-reco .blur-left,
.home-reco .blur-right {
  z-index: 100;
  grid-column: 1;
  grid-row: 2;
  height: 100%;
  width: calc(var(--unit) * 1);
}
.home-reco .blur-left {
  background: linear-gradient(to left, transparent, var(--background), var(--background));
  position: relative;
  left: calc(var(--padding-main) * -1);
}
.home-reco .blur-right {
  justify-self: end;
  background: linear-gradient(to right, transparent, var(--background), var(--background));
}
.home-reco .title-container {
  grid-column: 1/3;
  grid-row: 1;
}
.home-reco .container {
  z-index: 50;
  grid-column: 1;
  grid-row: 2;
  display: flex;
  gap: calc(var(--unit) * 0.5);
  position: relative;
  width: calc(100% + var(--padding-main));
  left: calc(var(--padding-main) * -1);
  padding-left: var(--padding-main);
  overflow-x: scroll;
  overflow-y: hidden;
  padding-bottom: 4px; /* for box-shadow */
  scrollbar-width: none;
}
.home-reco .container::-webkit-scrollbar {
  display: none;
}
.home-reco .container .card__block {
  --border: 1px solid var(--neutral-200);
  background-color: var(--background-light);
  border-radius: 10px;
  box-shadow: 1px 1px 0px 0px var(--neutral-200);
  padding: calc(var(--unit) * 0.75);
  width: 26vw;
  flex-shrink: 0;
}
.home-reco .container .card__block .group-bottom {
  display: none;
}
.home-reco .btn-scroll {
  width: 100%;
  height: 100%;
  grid-column: 2;
  grid-row: 2;
}

#results {
  display: grid;
  grid-template-columns: 1fr 4fr;
  grid-gap: calc(var(--unit) * 3);
  padding-top: calc(var(--unit) * 2);
}
#results .section-title {
  font-weight: 800;
  font-size: 1rem;
  line-height: 1.2em;
}

#results-filters .section-title {
  margin-bottom: calc(var(--unit) * 1.5);
}

#results-list #results-list__header {
  display: flex;
  align-items: center;
  margin-bottom: calc(var(--unit) * 1.5);
}
#results-list .section-title {
  white-space: nowrap;
}
#results-list .nbr-results {
  flex-grow: 1;
  margin-left: calc(var(--unit) * 2);
  color: var(--neutral-400);
  font-weight: 800;
}
#results-list .nav-pages {
  justify-self: end;
}
#results-list .sort-container {
  display: flex;
  justify-content: space-between;
}
#results-list .sort-container .sort {
  display: flex;
  align-items: center;
}
#results-list .sort-container .sort p {
  margin-right: 2ch;
}
#results-list .sort-container .sort .btn {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-200);
}
#results-list .sort-container .sort .btn:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
#results-list .sort-container .sort .btn:hover svg {
  fill: var(--neutral-600);
}
#results-list .sort-container .sort.sort-by .btn {
  justify-content: space-between;
  min-width: 20ch;
}
#results-list .sort-container .sort.sort-pages {
  opacity: 0.4;
}
#results-list .sort-container .sort.sort-pages .btn {
  min-width: 3ch;
}
#results-list .card__block {
  margin-bottom: calc(var(--unit) * 1.5);
}
#results-list .card__block h1 {
  font-size: 2em;
  margin-top: 0.5em;
}

#results__folder {
  position: relative;
}
#results__folder h1 {
  --border: 1px solid var(--neutral-200);
  background-color: var(--background-light);
  border-radius: 10px;
  box-shadow: 1px 1px 0px 0px var(--neutral-200);
  padding: calc(var(--unit) * 0.75);
  color: var(--color-primary);
  padding-top: calc(var(--unit) * 0.5);
  padding-bottom: calc(var(--unit) * 1);
  margin-bottom: calc(var(--unit) * 0.5);
  font-weight: 800;
  font-size: 1rem;
  line-height: 1.2em;
  width: 100%;
}
#results__folder h1 svg {
  fill: var(--color-primary);
}
#results__folder h1 .icon-folder {
  position: relative;
  top: 5px;
  margin-right: 0.75ch;
}
#results__folder h1 .icon-folder svg {
  width: calc(var(--unit) * 0.9);
}
#results__folder .btn {
  color: var(--neutral-400);
  width: 100%;
  justify-content: flex-end;
}
#results__folder .btn svg {
  fill: var(--neutral-400);
}
#results__folder .btn:hover {
  color: var(--neutral-500);
}
#results__folder .btn:hover svg {
  fill: var(--neutral-500);
}

#results__header {
  --border: 1px solid var(--neutral-200);
  background-color: var(--background-light);
  border-radius: 10px;
  box-shadow: 1px 1px 0px 0px var(--neutral-200);
  padding: calc(var(--unit) * 0.75);
  position: relative;
  padding-bottom: calc(var(--unit) * 1.5);
}
#results__header .title-container {
  display: flex;
  justify-content: space-between;
  margin-bottom: calc(var(--unit) * 1);
  gap: var(--unit);
}
#results__header .title-container .section-title {
  flex-grow: 1;
}
#results__header .request {
  margin-top: calc(var(--unit) * 0.75);
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
#results__header .request .btn-request {
  color: var(--neutral-400);
  font-family: var(--font);
  font-weight: var(--font-w);
  font-size: 1em;
  white-space: nowrap;
  height: calc(var(--unit) * 1);
  min-width: calc(var(--unit) * 1);
  border: 1px solid var(--neutral-400);
  border-radius: var(--radius);
  padding-inline: 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
#results__header .request .btn-request .text {
  color: var(--neutral-400);
}
#results__header .request .btn-request svg {
  fill: var(--neutral-400);
  width: calc(var(--unit) * 0.4);
}
#results__header .request .btn-request .icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
#results__header .request .btn-request .icon + .text {
  padding-left: 10px;
}
#results__header .request .btn-request .text + .icon {
  padding-left: 6px;
}
#results__header .request .btn-request .icon + .icon {
  padding-left: 4px;
}
#results__header .request .btn-request:hover {
  color: var(--neutral-500);
  border-color: var(--neutral-500);
}
#results__header .request .btn-request:hover .text {
  color: var(--neutral-500);
}
#results__header .request .btn-request:hover svg {
  fill: var(--neutral-500);
}
#results__header .request .clear {
  color: var(--neutral-400);
  margin-left: 1.5ch;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
}
#results__header .request .clear:hover {
  color: var(--neutral-500);
}

#folder__breadcrumb,
#folder__header,
#folder__content {
  --left: 0px;
  margin-left: var(--left);
  max-width: 960px;
  margin-right: calc(var(--left) + var(--reco-w));
}

#folder__header {
  margin-top: calc(var(--unit) * 1);
  margin-bottom: calc(var(--unit) * 4);
}
#folder__header h1 {
  --border: 1px solid var(--neutral-200);
  background-color: var(--background-light);
  border-radius: 10px;
  box-shadow: 1px 1px 0px 0px var(--neutral-200);
  padding: calc(var(--unit) * 0.75);
  padding-top: calc(var(--unit) * 1);
  padding-bottom: calc(var(--unit) * 1.5);
  color: var(--color-primary);
  margin-top: calc(var(--unit) * 1);
  font-size: 1.8em;
}
#folder__header h1 svg {
  fill: var(--color-primary);
}
#folder__header h1 svg {
  width: 18px;
}
#folder__header h1 .icon {
  position: relative;
  top: 3px;
  padding-right: 0.5ch;
}

#folder__tab {
  margin-bottom: calc(var(--unit) * 2);
}

#folder__content {
  margin-top: calc(var(--unit) * 1.75);
  padding-bottom: 30vh;
}
#folder__content .card .text-results {
  display: none;
}
#folder__content .card .abstract {
  display: flex;
}
#folder__content .card .abstract .text {
  font-size: var(--font-size-sm);
}
#folder__content .card .abstract .icon svg {
  width: 8px !important;
}
#folder__content .card .group-right .icon-bookmark-filled {
  display: block;
}
#folder__content .card .group-right .icon-bookmark {
  display: none;
}
#folder__content .content-nav {
  display: flex;
  justify-content: center;
}

#page-article {
  --left: 40px;
  --left-content: 80px;
}

#page-article .breadcrumb {
  margin-bottom: calc(var(--unit) * 2);
}

#page-article__breadcrumb,
#page-article__content,
#page-article__header,
#page-article__highlight,
#page-article__toolbox {
  margin-left: var(--left);
  max-width: 960px;
  margin-right: calc(var(--left) + var(--reco-w));
}

#page-article__content {
  padding-left: var(--left-content);
}
#page-article__content p, #page-article__content li {
  font-family: var(--serif);
  font-size: 16px;
  line-height: 1.4em;
  font-weight: normal;
  font-variation-settings: "opsz" 0, "wght" 300;
}
#page-article__content ul {
  margin-left: 3ch;
}
#page-article__content blockquote {
  margin-left: calc(var(--unit) * 1);
  padding-left: calc(var(--unit) * 1);
  padding-top: 1px;
  padding-bottom: calc(var(--unit) * 0.75);
  border-left: 4px solid var(--neutral-100);
  color: var(--neutral-500);
}
#page-article__content blockquote cite {
  font-style: normal;
  color: var(--neutral-400);
  font-weight: 600;
}
#page-article__content h1, #page-article__content h2, #page-article__content h3, #page-article__content h4, #page-article__content h5, #page-article__content h6 {
  margin-top: calc(var(--unit) * 1);
  margin-bottom: calc(var(--unit) * 0.5);
  position: relative;
  font-weight: 800;
}
#page-article__content h1::before, #page-article__content h2::before, #page-article__content h3::before, #page-article__content h4::before, #page-article__content h5::before, #page-article__content h6::before {
  content: attr(data-count) ". ";
  position: absolute;
  width: 8ch;
  left: calc((8ch + 10px) * -1);
  display: flex;
  justify-content: flex-end;
  color: var(--neutral-300);
}
#page-article__content h1:target, #page-article__content h2:target, #page-article__content h3:target, #page-article__content h4:target, #page-article__content h5:target, #page-article__content h6:target {
  padding-top: calc(var(--header-h) + var(--unit) * 2);
}
#page-article__content ul, #page-article__content p {
  margin-top: calc(var(--unit) * 0.75);
  margin-bottom: calc(var(--unit) * 0.75);
}
#page-article__content h2 {
  margin-top: calc(var(--unit) * 4);
  margin-bottom: calc(var(--unit) * 1.5);
  font-size: 2em;
  border-bottom: 1px solid var(--neutral-200);
  padding-bottom: calc(var(--unit) * 0.5);
}
#page-article__content .nav + h2 {
  margin-top: calc(var(--unit) * 3);
}
#page-article__content h3 {
  font-size: 1.6em;
  margin-top: calc(var(--unit) * 3);
  margin-bottom: calc(var(--unit) * 1.5);
}
#page-article__content .nav + h3 {
  margin-top: calc(var(--unit) * 2);
}
#page-article__content h4 {
  font-size: 1.3em;
  margin-top: calc(var(--unit) * 2);
  margin-bottom: calc(var(--unit) * 1);
}
#page-article__content .nav + h4 {
  margin-top: calc(var(--unit) * 1.5);
}
#page-article__content h5 {
  font-size: 1.1em;
  margin-top: calc(var(--unit) * 2);
  margin-bottom: calc(var(--unit) * 1);
  color: var(--neutral-600);
}
#page-article__content .nav {
  display: flex;
  align-items: center;
  gap: 2ch;
}
#page-article__content .nav .icon-arrow {
  position: relative;
  top: 5px;
  padding-right: 0.5ch;
}
#page-article__content .nav .icon-arrow svg {
  width: 8px;
  fill: var(--neutral-300);
}
#page-article__content .nav a {
  display: inline-block;
  font-family: var(--font);
  text-decoration: none;
  font-size: var(--font-size);
  color: var(--neutral-300);
  font-weight: var(--font-w);
  font-variation-settings: "wght" var(--font-w);
}
#page-article__content .nav a::before {
  font-weight: 700;
  content: attr(data-count) ". ";
}
#page-article__content .nav a:hover {
  text-decoration: underline;
}
#page-article__content .nav .back-top {
  flex-grow: 1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  position: relative;
  top: calc(var(--unit) * 0.25);
}
#page-article__content .nav .back-top .link {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-200);
  border-color: var(--neutral-100);
}
#page-article__content .nav .back-top .link:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
#page-article__content .nav .back-top .link:hover svg {
  fill: var(--neutral-600);
}
#page-article__content .nav .back-top .link a {
  color: var(--neutral-300);
}
#page-article__content .nav .back-top .link svg {
  fill: var(--neutral-200);
}
#page-article__content .nav .back-top .link a::before {
  content: "";
}
#page-article__content .nav .back-top .link a:hover {
  text-decoration: none;
}
#page-article__content .nav.nav-last {
  margin-top: calc(var(--unit) * 2);
  margin-bottom: calc(var(--unit) * 2);
}
#page-article__content .nav.nav-last .back-top .link {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-500);
  border-color: var(--color-text);
}
#page-article__content .nav.nav-last .back-top .link:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
#page-article__content .nav.nav-last .back-top .link:hover svg {
  fill: var(--neutral-600);
}
#page-article__content .nav.nav-last .back-top .link a {
  color: var(--color-text);
}
#page-article__content .nav.nav-last .back-top .link svg {
  fill: var(--color-text);
}

#page-article__header {
  margin-bottom: calc(var(--unit) * 2.5);
}
#page-article__header h1 {
  font-size: 2.6em;
  line-height: 1.1em;
  margin-bottom: calc(var(--unit) * 1.5);
}
#page-article__header .group-top {
  display: flex;
  align-items: center;
  margin-bottom: calc(var(--unit) * 1.5);
  gap: calc(var(--unit) * 0.25);
}
#page-article__header .editor {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-500);
}
#page-article__header .editor:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
#page-article__header .editor:hover svg {
  fill: var(--neutral-600);
}
#page-article__header .type {
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 700;
  background-color: var(--color-accent_light);
  color: var(--color-accent);
  fill: var(--color-accent);
  height: calc(var(--unit) * 1.25);
  padding-inline: 0.5em;
  padding-right: 1ch;
  border-radius: var(--radius);
  display: inline-flex;
  padding-inline: 1ch;
  height: calc(var(--unit) * 1.5);
}
#page-article__header .type .text {
  padding-left: 1ch;
}
#page-article__header .type svg {
  fill: var(--color-accent);
  width: calc(var(--unit) * 0.75);
}
#page-article__header .type:hover {
  cursor: pointer;
}
#page-article__header .type:hover .text, #page-article__header .type:hover .icon {
  opacity: 0.7;
}
#page-article__header .type svg {
  width: calc(var(--unit) * 0.5);
  position: relative;
  top: 1px;
}
#page-article__header .source {
  font-size: 1.2em;
  line-height: 1.2em;
  margin-bottom: calc(var(--unit) * 0.75);
}
#page-article__header .source:hover {
  text-decoration: underline;
  cursor: pointer;
}
#page-article__header .dates {
  margin-top: calc(var(--unit) * 1);
  margin-bottom: calc(var(--unit) * 0.75);
  color: var(--neutral-400);
  display: flex;
}
#page-article__header .dates p {
  padding-right: 1ch;
}
#page-article__header .dates p + p {
  padding-left: 1ch;
  border-left: 2px solid var(--neutral-200);
}
#page-article__header .authors dl {
  margin-bottom: calc(var(--unit) * 0.75);
}
#page-article__header .authors dt {
  font-size: 1.2em;
  font-weight: 800;
  margin-bottom: calc(var(--unit) * 0.25);
}
#page-article__header .authors dd {
  color: var(--neutral-400);
}

#page-article__highlight {
  --border: 1px solid var(--neutral-200);
  background-color: var(--background-light);
  border-radius: 10px;
  box-shadow: 1px 1px 0px 0px var(--neutral-200);
  padding: calc(var(--unit) * 0.75);
  margin-bottom: calc(var(--unit) * 3);
  padding: calc(var(--unit) * 1.5);
  padding-bottom: calc(var(--unit) * 1);
}
#page-article__highlight h1 {
  font-weight: 800;
  font-size: 1rem;
  line-height: 1.2em;
  color: var(--color-text);
  display: flex;
  align-items: center;
  color: var(--color-primary);
  margin-bottom: calc(var(--unit) * 1.5);
}
#page-article__highlight h1 .icon {
  align-items: center;
  position: relative;
  top: 1px;
  padding-right: 1ch;
}
#page-article__highlight h1 .icon svg {
  width: calc(var(--unit) * 0.75);
}
#page-article__highlight .container p, #page-article__highlight .container li {
  font-family: var(--serif);
  font-size: 16px;
  line-height: 1.4em;
  font-weight: normal;
  font-variation-settings: "opsz" 0, "wght" 300;
}
#page-article__highlight .container ul {
  margin-left: 3ch;
}
#page-article__highlight .container blockquote {
  margin-left: calc(var(--unit) * 1);
  padding-left: calc(var(--unit) * 1);
  padding-top: 1px;
  padding-bottom: calc(var(--unit) * 0.75);
  border-left: 4px solid var(--neutral-100);
  color: var(--neutral-500);
}
#page-article__highlight .container blockquote cite {
  font-style: normal;
  color: var(--neutral-400);
  font-weight: 600;
}
#page-article__highlight .container h1, #page-article__highlight .container h2, #page-article__highlight .container h3, #page-article__highlight .container h4, #page-article__highlight .container h5, #page-article__highlight .container h6 {
  margin-top: calc(var(--unit) * 1);
  margin-bottom: calc(var(--unit) * 0.5);
  position: relative;
  font-weight: 800;
}
#page-article__highlight .container h1::before, #page-article__highlight .container h2::before, #page-article__highlight .container h3::before, #page-article__highlight .container h4::before, #page-article__highlight .container h5::before, #page-article__highlight .container h6::before {
  content: attr(data-count) ". ";
  position: absolute;
  width: 8ch;
  left: calc((8ch + 10px) * -1);
  display: flex;
  justify-content: flex-end;
  color: var(--neutral-300);
}
#page-article__highlight .container h1:target, #page-article__highlight .container h2:target, #page-article__highlight .container h3:target, #page-article__highlight .container h4:target, #page-article__highlight .container h5:target, #page-article__highlight .container h6:target {
  padding-top: calc(var(--header-h) + var(--unit) * 2);
}
#page-article__highlight .container ul, #page-article__highlight .container p {
  margin-top: calc(var(--unit) * 0.75);
  margin-bottom: calc(var(--unit) * 0.75);
}
#page-article__highlight .container h2 {
  margin-top: calc(var(--unit) * 4);
  margin-bottom: calc(var(--unit) * 1.5);
  font-size: 2em;
  border-bottom: 1px solid var(--neutral-200);
  padding-bottom: calc(var(--unit) * 0.5);
}
#page-article__highlight .container .nav + h2 {
  margin-top: calc(var(--unit) * 3);
}
#page-article__highlight .container h3 {
  font-size: 1.6em;
  margin-top: calc(var(--unit) * 3);
  margin-bottom: calc(var(--unit) * 1.5);
}
#page-article__highlight .container .nav + h3 {
  margin-top: calc(var(--unit) * 2);
}
#page-article__highlight .container h4 {
  font-size: 1.3em;
  margin-top: calc(var(--unit) * 2);
  margin-bottom: calc(var(--unit) * 1);
}
#page-article__highlight .container .nav + h4 {
  margin-top: calc(var(--unit) * 1.5);
}
#page-article__highlight .container h5 {
  font-size: 1.1em;
  margin-top: calc(var(--unit) * 2);
  margin-bottom: calc(var(--unit) * 1);
  color: var(--neutral-600);
}
#page-article__highlight .container .nav {
  display: flex;
  align-items: center;
  gap: 2ch;
}
#page-article__highlight .container .nav .icon-arrow {
  position: relative;
  top: 5px;
  padding-right: 0.5ch;
}
#page-article__highlight .container .nav .icon-arrow svg {
  width: 8px;
  fill: var(--neutral-300);
}
#page-article__highlight .container .nav a {
  display: inline-block;
  font-family: var(--font);
  text-decoration: none;
  font-size: var(--font-size);
  color: var(--neutral-300);
  font-weight: var(--font-w);
  font-variation-settings: "wght" var(--font-w);
}
#page-article__highlight .container .nav a::before {
  font-weight: 700;
  content: attr(data-count) ". ";
}
#page-article__highlight .container .nav a:hover {
  text-decoration: underline;
}
#page-article__highlight .container .nav .back-top {
  flex-grow: 1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  position: relative;
  top: calc(var(--unit) * 0.25);
}
#page-article__highlight .container .nav .back-top .link {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-200);
  border-color: var(--neutral-100);
}
#page-article__highlight .container .nav .back-top .link:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
#page-article__highlight .container .nav .back-top .link:hover svg {
  fill: var(--neutral-600);
}
#page-article__highlight .container .nav .back-top .link a {
  color: var(--neutral-300);
}
#page-article__highlight .container .nav .back-top .link svg {
  fill: var(--neutral-200);
}
#page-article__highlight .container .nav .back-top .link a::before {
  content: "";
}
#page-article__highlight .container .nav .back-top .link a:hover {
  text-decoration: none;
}
#page-article__highlight .container .nav.nav-last {
  margin-top: calc(var(--unit) * 2);
  margin-bottom: calc(var(--unit) * 2);
}
#page-article__highlight .container .nav.nav-last .back-top .link {
  border-radius: var(--radius);
  height: calc(var(--unit) * 1.5);
  padding-inline: 0.5em;
  border: 1px solid var(--neutral-500);
  border-color: var(--color-text);
}
#page-article__highlight .container .nav.nav-last .back-top .link:hover {
  color: var(--neutral-700);
  border-color: var(--neutral-400);
  background-color: var(--neutral-50);
}
#page-article__highlight .container .nav.nav-last .back-top .link:hover svg {
  fill: var(--neutral-600);
}
#page-article__highlight .container .nav.nav-last .back-top .link a {
  color: var(--color-text);
}
#page-article__highlight .container .nav.nav-last .back-top .link svg {
  fill: var(--color-text);
}
#page-article__highlight .container ul li {
  margin-bottom: calc(var(--unit) * 0.5);
}/*# sourceMappingURL=style.css.map */