/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.HomeHeroArticlePrimary {
  display: flex;
  height: 100%;
  flex-direction: column;
  background-color: #faf8f6; }
  @media only screen and (min-width: 672px) {
    .HomeHeroArticlePrimary {
      flex-direction: row; } }
  @media only screen and (min-width: 672px) {
    .HomeHeroArticlePrimary {
      position: relative;
      display: grid !important;
      grid-template-columns: repeat(12, minmax(0, 1fr));
      grid-gap: 32px !important; } }
  @media only screen and (min-width: 672px) and (min-width: 456px) and (max-width: 671px) {
    .HomeHeroArticlePrimary {
      grid-gap: 24px !important; } }
  @media only screen and (min-width: 672px) and (max-width: 455px) {
    .HomeHeroArticlePrimary {
      grid-gap: 16px !important; } }
  @media only screen and (min-width: 672px) {
      @supports (display: -ms-grid) {
        .HomeHeroArticlePrimary {
          display: -ms-grid !important;
          -ms-grid-columns: 1fr [12]; } } }
  .HomeHeroArticlePrimary__imageContainer {
    display: flex;
    height: 100%;
    min-height: 224px;
    max-height: 450px;
    cursor: pointer; }
    @media only screen and (min-width: 672px) {
      .HomeHeroArticlePrimary__imageContainer {
        min-height: 300px;
        max-height: 450px;
        grid-column: span 6; } }
    @media only screen and (min-width: 1028px) {
      .HomeHeroArticlePrimary__imageContainer {
        grid-column: span 8;
        min-height: 380px;
        max-height: 500px; } }
    .HomeHeroArticlePrimary__imageContainer > img {
      display: block;
      min-width: 100%;
      min-height: 100%;
      object-fit: cover; }
  .HomeHeroArticlePrimary__content {
    display: flex;
    flex-direction: column;
    padding: 24px; }
    @media only screen and (min-width: 672px) {
      .HomeHeroArticlePrimary__content {
        grid-column: span 6;
        padding: 24px 24px 24px 0; } }
    @media only screen and (min-width: 1028px) {
      .HomeHeroArticlePrimary__content {
        grid-column: span 4; } }
  .HomeHeroArticlePrimary__headline {
    padding-bottom: 16px; }
    @media only screen and (min-width: 456px) and (max-width: 671px) {
      .HomeHeroArticlePrimary__headline {
        padding-bottom: 24px; } }
    @media only screen and (min-width: 672px) and (max-width: 1027px) {
      .HomeHeroArticlePrimary__headline {
        padding-bottom: 16px; } }
    @media only screen and (min-width: 1028px) {
      .HomeHeroArticlePrimary__headline {
        padding-bottom: 24px; } }
    .Elevation:hover .HomeHeroArticlePrimary__headline {
      text-decoration: underline; }
  .HomeHeroArticlePrimary__excerpt {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin-bottom: 16px; }
    .HomeHeroArticlePrimary__excerpt a {
      pointer-events: none;
      text-decoration: none;
      color: var(--color-text-body-standard); }
    .HomeHeroArticlePrimary__excerpt img {
      display: none; }
    .HomeHeroArticlePrimary__excerpt br {
      display: none; }
    .HomeHeroArticlePrimary__excerpt .bookBlurbFloat {
      display: none; }
    @media only screen and (min-width: 456px) and (max-width: 671px) {
      .HomeHeroArticlePrimary__excerpt {
        margin-bottom: 24px; } }
    @media only screen and (min-width: 672px) {
      .HomeHeroArticlePrimary__excerpt {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        -webkit-line-clamp: 4;
        overflow: hidden; } }
    @media only screen and (min-width: 672px) and (max-width: 1027px) {
      .HomeHeroArticlePrimary__excerpt {
        margin-bottom: 16px; } }
    @media only screen and (min-width: 1028px) {
      .HomeHeroArticlePrimary__excerpt {
        margin-bottom: 32px; } }
  .HomeHeroArticlePrimary__counts {
    display: flex;
    flex-grow: 1;
    align-items: flex-end;
    color: var(--color-text-subdued); }
  .HomeHeroArticlePrimary__additionalCount::before {
    padding: 4px;
    content: "\B7"; }

.HomeHeroArticleSecondary {
  padding-bottom: 32px; }
  .HomeHeroArticleSecondary__link:focus {
    text-decoration: underline; }

.HomeHeroSection {
  display: block; }
  @media only screen and (min-width: 672px) and (max-width: 1027px) {
    .HomeHeroSection {
      position: relative;
      display: grid !important;
      grid-template-columns: repeat(8, minmax(0, 1fr));
      grid-gap: 32px !important; } }
  @media only screen and (min-width: 672px) and (max-width: 1027px) and (min-width: 456px) and (max-width: 671px) {
    .HomeHeroSection {
      grid-gap: 24px !important; } }
  @media only screen and (min-width: 672px) and (max-width: 1027px) and (max-width: 455px) {
    .HomeHeroSection {
      grid-gap: 16px !important; } }
  @media only screen and (min-width: 672px) and (max-width: 1027px) {
      @supports (display: -ms-grid) {
        .HomeHeroSection {
          display: -ms-grid !important;
          -ms-grid-columns: 1fr [8]; } } }
  @media only screen and (min-width: 1028px) and (max-width: 1311px) {
    .HomeHeroSection {
      position: relative;
      display: grid !important;
      grid-template-columns: repeat(12, minmax(0, 1fr));
      grid-gap: 32px !important; } }
  @media only screen and (min-width: 1028px) and (max-width: 1311px) and (min-width: 456px) and (max-width: 671px) {
    .HomeHeroSection {
      grid-gap: 24px !important; } }
  @media only screen and (min-width: 1028px) and (max-width: 1311px) and (max-width: 455px) {
    .HomeHeroSection {
      grid-gap: 16px !important; } }
  @media only screen and (min-width: 1028px) and (max-width: 1311px) {
      @supports (display: -ms-grid) {
        .HomeHeroSection {
          display: -ms-grid !important;
          -ms-grid-columns: 1fr [12]; } } }
  @media only screen and (min-width: 1312px) {
    .HomeHeroSection {
      position: relative;
      display: grid !important;
      grid-template-columns: repeat(16, minmax(0, 1fr));
      grid-gap: 32px !important; } }
  @media only screen and (min-width: 1312px) and (min-width: 456px) and (max-width: 671px) {
    .HomeHeroSection {
      grid-gap: 24px !important; } }
  @media only screen and (min-width: 1312px) and (max-width: 455px) {
    .HomeHeroSection {
      grid-gap: 16px !important; } }
  @media only screen and (min-width: 1312px) {
      @supports (display: -ms-grid) {
        .HomeHeroSection {
          display: -ms-grid !important;
          -ms-grid-columns: 1fr [16]; } } }
  @media only screen and (max-width: 671px) {
    .HomeHeroSection__primaryContent {
      padding: 16px 0; } }
  @media only screen and (min-width: 456px) and (max-width: 671px) {
    .HomeHeroSection__primaryContent {
      padding: 24px 0; } }
  @media only screen and (min-width: 672px) {
    .HomeHeroSection__primaryContent {
      grid-column: span 8; }
      .HomeHeroSection__primaryContent,
      .HomeHeroSection__primaryContent .Elevation,
      .HomeHeroSection__primaryContent .Elevation__contents,
      .HomeHeroSection__primaryContent .Elevation__contents-inner {
        height: 100%; } }
  @media only screen and (min-width: 1028px) {
    .HomeHeroSection__primaryContent {
      grid-column: span 12; } }
  .HomeHeroSection__relatedContent {
    -ms-grid-column: 1;
    -ms-grid-column-span: -2;
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column; }
    @media only screen and (min-width: 672px) {
      .HomeHeroSection__relatedContent {
        padding: 32px 0; } }
    @media only screen and (min-width: 1312px) {
      .HomeHeroSection__relatedContent {
        grid-column: span 4;
        flex-grow: 1;
        justify-content: space-between; } }
  .HomeHeroSection__links {
    display: none; }
    @media only screen and (min-width: 1312px) {
      .HomeHeroSection__links {
        display: block; } }
  .HomeHeroSection__link {
    padding-bottom: 32px; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
@keyframes waitToHide {
  0% {
    visibility: visible; }
  99% {
    visibility: visible; }
  100% {
    visibility: hidden; } }

.ReviewCardSmall {
  padding: 16px 8px 0 8px;
  transform: translate3d(0, 0, 0); }
  .ReviewCardSmall__ElevationCard {
    display: inline-block;
    width: 100%;
    visibility: visible; }
    @media only screen and (min-width: 672px) {
      .ReviewCardSmall__ElevationCard {
        transition: visibility 0.3s linear; }
        .ReviewCardSmall__ElevationCard--hidden {
          animation: 0.1s linear 1s forwards waitToHide; } }
  .ReviewCardSmall__ElevationCardContent {
    overflow: hidden;
    position: relative;
    border-radius: 8px;
    padding: 0 12px;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.2);
    background-color: var(--color-background-body-base); }
  .ReviewCardSmall__swooshSvg {
    transform: translate(-50%, -35px);
    position: absolute;
    z-index: 0;
    top: 0;
    left: 50%;
    width: 100%;
    min-width: 400px;
    height: 100%; }
  .ReviewCardSmall__swooshPath {
    fill: #faf8f6; }
  .ReviewCardSmall__book {
    display: flex;
    padding-bottom: 16px; }
  .ReviewCardSmall__bookInfo {
    width: 72%;
    height: 160px;
    padding: 0 0 12px 12px; }
  .ReviewCardSmall__bookCoverColumn {
    width: 90px; }
    .ReviewCardSmall__bookCoverColumn > .BookCover {
      display: block; }
      .ReviewCardSmall__bookCoverColumn > .BookCover:focus {
        filter: brightness(0.9); }
  .ReviewCardSmall__bookTitleLink {
    display: block;
    color: var(--color-text-action-primary-base);
    font-family: Copernicus, "Libre Baskerville", Georgia, serif;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-weight: 600;
    text-decoration: none; }
    .ReviewCardSmall__bookTitleLink:hover, .ReviewCardSmall__bookTitleLink:focus {
      text-decoration: underline;
      color: var(--color-text-action-primary-hover); }
  .ReviewCardSmall__bookAuthorLink {
    color: var(--color-text-action-primary-base);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-decoration: none;
    padding: 0 12px 0 0; }
    .ReviewCardSmall__bookAuthorLink:hover, .ReviewCardSmall__bookAuthorLink:focus {
      text-decoration: underline;
      color: var(--color-text-action-primary-hover); }
  .ReviewCardSmall__genres {
    padding-top: 8px;
    height: 78px;
    -webkit-line-clamp: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis; }
    .ReviewCardSmall__genres:hover, .ReviewCardSmall__genres:focus {
      color: var(--color-text-action-primary-hover); }
  .ReviewCardSmall__bookGenreLink {
    text-decoration: none;
    color: var(--color-text-subdued); }
    .ReviewCardSmall__bookGenreLink:not(:first-child)::before {
      padding: 4px;
      content: "\B7"; }
    .ReviewCardSmall__bookGenreLink:hover, .ReviewCardSmall__bookGenreLink:focus {
      color: var(--color-text-action-primary-hover); }
  .ReviewCardSmall__content {
    height: 210px;
    position: relative;
    padding: 16px 8px 16px 0; }
    .ReviewCardSmall__content img {
      display: none; }
    .ReviewCardSmall__content br {
      display: none; }
  .ReviewCardSmall__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px; }
  .ReviewCardSmall__reviewArea {
    max-height: 75px;
    overflow: hidden; }
  .ReviewCardSmall__footer {
    position: absolute;
    bottom: 16px;
    left: 0;
    width: 100%; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.BookPage__gridContainer {
  position: relative;
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-gap: 32px !important;
  margin-bottom: 40px; }
  @media only screen and (min-width: 456px) and (max-width: 671px) {
    .BookPage__gridContainer {
      grid-gap: 24px !important; } }
  @media only screen and (max-width: 455px) {
    .BookPage__gridContainer {
      grid-gap: 16px !important; } }
  @supports (display: -ms-grid) {
    .BookPage__gridContainer {
      display: -ms-grid !important;
      -ms-grid-columns: 1fr [12]; } }

.BookPage__leftColumn {
  grid-column: span 3; }
  @media only screen and (min-width: 672px) and (max-width: 1027px) {
    .BookPage__leftColumn {
      grid-column: span 4; }
      .BookPage__leftColumn .BookPage__bookCover {
        width: 75%;
        margin: auto; } }
  @media only screen and (max-width: 671px) {
    .BookPage__leftColumn {
      display: none; } }

.BookPage__rightColumn {
  -ms-grid-column: 5;
  -ms-grid-column-span: 8;
  grid-column: 5 / 13;
  display: inline-grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  grid-auto-rows: auto; }
  @media only screen and (max-width: 671px) {
    .BookPage__rightColumn {
      -ms-grid-column: 1;
      -ms-grid-column-span: 12;
      grid-column: 1 / 13; } }

.BookPage__reviewsSection, .BookPage__relatedTopContent {
  -ms-grid-column: 1;
  -ms-grid-column-span: 8;
  grid-column: 1 / 9; }

.BookPage__relatedBottomContent > * {
  margin-bottom: 40px; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.BetaFeedbackButton {
  display: inline-block;
  position: fixed;
  right: 5%;
  z-index: 50;
  bottom: 5%; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.ArticleCard .Elevation__contents-inner {
  isolation: isolate; }

.ArticleCard__imageContainer {
  overflow: hidden; }

.ArticleCard__img {
  transition: transform 0.2s ease-out;
  transform: translateZ(0);
  backface-visibility: hidden; }
  .Elevation:hover .ArticleCard__img {
    transform: scale(1.025); }

.ArticleCard__content {
  padding: 16px;
  height: 115px;
  background-color: #faf8f6; }

.ArticleCard__headline {
  max-height: 47px;
  overflow: hidden; }
  .Elevation:hover .ArticleCard__headline {
    text-decoration: underline; }

.ArticleCard__tags {
  width: 100%;
  padding: 16px 0 0 0;
  -webkit-line-clamp: 1;
  overflow: hidden;
  white-space: nowrap; }

.ArticleCard__tag {
  color: var(--color-text-subdued);
  display: inline; }
  .ArticleCard__tag--strong {
    color: var(--color-text-body-standard);
    font-weight: 700; }
  .ArticleCard__tag::before {
    padding: 4px;
    content: "\B7"; }
  .ArticleCard__tag:first-child::before {
    display: none; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.MyReviewCardCarousel {
  margin-top: 32px; }
  .MyReviewCardCarousel__header {
    margin-bottom: 16px; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.MyReviewCardSmall {
  padding: 24px 8px 40px 8px;
  transform: translate3d(0, 0, 0);
  height: 100%; }
  .MyReviewCardSmall--no-footer {
    padding-bottom: 8px; }
  .MyReviewCardSmall__ElevationCard {
    display: inline-block;
    width: 100%;
    height: 100%; }
  .MyReviewCardSmall__ElevationCardContent {
    overflow: hidden;
    position: relative;
    height: 100%;
    border-radius: 8px;
    padding: 0 12px;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.2);
    background-color: var(--color-background-body-base); }
  .MyReviewCardSmall__swooshSvg {
    transform: translate(-50%, -40px);
    position: absolute;
    z-index: 0;
    top: -36px;
    left: 50%;
    width: 100%;
    min-width: 400px;
    height: 100%; }
  .MyReviewCardSmall__swooshPath {
    fill: #faf8f6; }
  .MyReviewCardSmall__book {
    display: flex;
    min-height: 90px; }
  .MyReviewCardSmall__bookCoverColumn {
    width: 22%; }
    .MyReviewCardSmall__bookCoverColumn > .BookCover {
      display: block; }
  .MyReviewCardSmall__bookInfo {
    display: flex;
    flex-direction: column;
    margin: 0 12px; }
    .MyReviewCardSmall__bookInfo > span {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -moz-box-orient: vertical;
      -webkit-line-clamp: 1;
      overflow: hidden; }
  .MyReviewCardSmall__button {
    margin: 8px 0; }
  .MyReviewCardSmall__content {
    height: 100%;
    position: relative;
    padding: 16px 0 16px 0; }
  .MyReviewCardSmall__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px; }
  .MyReviewCardSmall__reviewArea {
    max-height: 75px;
    overflow: hidden; }
  .MyReviewCardSmall__tags {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px; }
  .MyReviewCardSmall__footer {
    position: absolute;
    bottom: 64px;
    left: 0;
    width: 100%; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.ReviewsSection__listHeader {
  margin: 12px 0; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.BookDiscussions {
  padding-bottom: 32px; }
  .BookDiscussions__list {
    padding-top: 32px;
    display: flex; }
    @media only screen and (max-width: 671px) {
      .BookDiscussions__list {
        flex-direction: column; } }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.DiscussionCard {
  border-radius: 8px;
  text-decoration: none;
  flex: 1;
  display: flex;
  margin-bottom: 24px;
  padding: 12px;
  align-items: center; }
  .DiscussionCard:hover .DiscussionCard__metaRow,
  .DiscussionCard:hover .DiscussionCard__stats {
    text-decoration: underline; }
  .DiscussionCard:focus {
    box-shadow: 0 0 0 2px var(--color-shadow-button-focus);
    transition: transform 0.2s ease-out; }
  .DiscussionCard__stats {
    font-family: Copernicus, "Libre Baskerville", Georgia, serif;
    flex: 1;
    line-height: normal;
    padding-top: 1vw;
    font-size: clamp(36px, 4vw, 64px); }
  .DiscussionCard__icon {
    display: flex;
    flex-direction: column;
    width: clamp(64px, 6vw, 128px);
    height: clamp(64px, 6vw, 128px); }
    .DiscussionCard__icon svg {
      width: 100%;
      height: 100%; }
  .DiscussionCard__metaRow {
    word-break: break-all;
    margin-left: 4px; }
  .DiscussionCard__middle {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding-left: clamp(12px, 2vw, 64px); }
  .DiscussionCard__rightIndicator {
    display: none;
    width: 24px;
    height: 24px;
    justify-self: flex-end;
    align-self: center; }
  .DiscussionCard__metaRow {
    flex: 1;
    display: inline-flex; }
  .DiscussionCard__metaIndicator {
    flex: 0 0 24px;
    height: 24px; }
  @media only screen and (max-width: 671px) {
    .DiscussionCard__rightIndicator {
      display: block; }
    .DiscussionCard__metaIndicator {
      display: none; } }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.FollowButton {
  width: 90px; }

.AuthorPreview__avatar, .AuthorPreview__info {
  margin-right: 12px; }

.AuthorPreview__info {
  flex: 1;
  overflow: hidden; }

.AuthorPreview__profile {
  display: flex;
  align-items: center;
  margin-bottom: 12px; }

.AuthorPreview__nameRow {
  display: flex;
  flex: 1; }

.AuthorPreview__meta, .AuthorPreview__name {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.FeaturedDetails {
  margin-bottom: 32px; }
  .FeaturedDetails a {
    text-decoration: underline; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.MoreEditions__meta > span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.EditionDetails {
  margin-bottom: 32px; }
  .EditionDetails .DescList {
    margin: 16px 0; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.WorkDetails {
  margin-bottom: 32px; }
  .WorkDetails a {
    text-decoration: underline; }
  .WorkDetails__url {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.BookDetails p {
  margin: 12px 0; }

.BookDetails__list {
  margin-bottom: 32px; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.SocialSignalsSection__container {
  display: flex;
  flex-direction: row;
  justify-content: space-between; }

.SocialSignalsSection__widget {
  margin-right: 12px;
  display: flex;
  align-items: center; }

@media only screen and (min-width: 672px) and (max-width: 1311px) {
  .SocialSignalsSection {
    display: flex;
    align-items: flex-end; }
    .SocialSignalsSection__container {
      display: block;
      margin: auto; }
    .SocialSignalsSection__caption {
      width: 200px; }
    .SocialSignalsSection__widget {
      display: flex;
      justify-content: flex-end; }
      .SocialSignalsSection__widget:not(:last-child) {
        padding-bottom: 24px; } }

@media only screen and (max-width: 455px) {
  .SocialSignalsSection {
    display: flex;
    align-items: flex-end; }
    .SocialSignalsSection__container {
      display: block;
      margin: auto; }
    .SocialSignalsSection__caption {
      width: 200px; }
    .SocialSignalsSection__widget {
      display: flex;
      justify-content: flex-end; }
      .SocialSignalsSection__widget:not(:last-child) {
        padding-bottom: 24px; } }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.SponsoredAdAction__label {
  color: var(--color-text-body-standard); }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.SeriesTitle__seriesLink {
  font-family: Copernicus, "Libre Baskerville", Georgia, serif;
  color: var(--color-text-subdued);
  font-style: italic;
  text-decoration: none; }
  .SeriesTitle__seriesLink:hover {
    text-decoration: underline; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.BookListItem {
  display: flex;
  padding-bottom: 12px;
  margin: 16px 16px 16px 0; }
  .BookListItem__cover {
    flex: none; }
    .BookListItem__cover--small {
      min-width: 80px;
      padding-top: 16px;
      margin-left: 16px; }
  .BookListItem__body {
    max-width: 679px;
    margin-left: 32px; }
    @media only screen and (max-width: 671px) {
      .BookListItem__body {
        margin-left: 16px; } }
  .BookListItem__authors {
    padding: 4px 0 8px 0; }
  .BookListItem__beneathTitle {
    padding-bottom: 12px; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.NativeBookAd__sponsored {
  margin-bottom: 8px; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.NativeFlexAd__sponsored {
  margin-bottom: 8px; }

.NativeFlexAd__header {
  margin-bottom: 24px; }

.NativeFlexAd__bodyImage {
  margin-bottom: 16px; }
  @media only screen and (min-width: 1028px) {
    .NativeFlexAd__bodyImage {
      margin: 0 32px 0 0; } }

@media only screen and (min-width: 1028px) {
  .NativeFlexAd__container {
    display: flex; } }

.NativeFlexAd__container img {
  width: 100%; }
  @media only screen and (min-width: 1028px) {
    .NativeFlexAd__container img {
      object-fit: contain;
      object-position: 0 0;
      max-width: 300px;
      width: 300px; } }

.NativeFlexAd__title {
  margin-bottom: 16px; }
  @media only screen and (min-width: 1028px) {
    .NativeFlexAd__title {
      margin-bottom: 8px; }
      .NativeFlexAd__title h3 {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden; } }
  .NativeFlexAd__title h3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden; }

.NativeFlexAd__description {
  margin-bottom: 16px; }

.NativeFlexAd__cta {
  max-width: 260px;
  margin: auto; }
  @media only screen and (min-width: 1028px) {
    .NativeFlexAd__cta {
      margin: initial; } }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.Ad {
  overflow: hidden;
  text-align: center; }
  .Ad > * {
    margin: 0 auto;
    width: 100%;
    height: 100%; }
  .Ad:empty {
    display: none; }
  .Ad__topBanner {
    width: 100%; }
    .Ad__topBanner iframe {
      margin-bottom: 32px; }
      @media only screen and (max-width: 455px) {
        .Ad__topBanner iframe {
          margin-bottom: 24px; } }
  .Ad__inlineAd, .Ad__nativeAd {
    padding: 40px 0; }
  .Ad__bottomBanner iframe {
    margin: 40px auto; }
    @media only screen and (max-width: 671px) {
      .Ad__bottomBanner iframe {
        margin: 32px auto; } }
  .Ad--showDividers {
    border-bottom: 1px solid var(--color-background-divider);
    margin-top: -25px;
    margin-bottom: 24px; }
  @media only screen and (min-width: 456px) {
    .Ad--showDividers.Ad__inlineAd {
      border-top: 1px solid var(--color-background-divider); } }
  .Ad--debug {
    display: block !important; }
    .Ad--debug > * {
      background-color: var(--color-background-alert-caution);
      display: block !important;
      height: 240px !important;
      width: 240px !important; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.NativeAdWrapper {
  position: relative;
  text-align: left; }
  .NativeAdWrapper .Ad--nonProgAd {
    top: auto;
    overflow: hidden;
    position: absolute;
    z-index: -1;
    border-bottom: 0; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.LibrarianActionsWidget {
  display: flex;
  padding-bottom: 12px; }
  .LibrarianActionsWidget__editDetailsButton {
    padding-right: 12px; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
@media only screen and (min-width: 456px) {
  .HomePage {
    padding-top: 16px; } }

.HomePage__widgetsArea {
  padding-bottom: 40px; }
  .HomePage__widgetsArea .Carousel {
    padding-top: 40px; }

.HomePage__sectionTitle {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden; }

.HomePage__sectionTitleLink {
  font-style: italic; }
  .HomePage__sectionTitleLink:hover, .HomePage__sectionTitleLink:focus {
    text-decoration: underline; }

/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Sep 2021 18:49:24 GMT
*/
/*
These mixins and functions use the semantic tokens generated by StyleDictionary
and output errors about incorrect usage.

These maps are imported automatically in every stylesheet thanks to our
webpack config/sass-resources-loader.
*/
/**
	weblit-line-clamp only works if display is set to -webkit-box and webkit-box-orient is set to vertical
	because this feature was built on -webkit-box display. 
	This hack is approved by CSSWG and recommended by multiple sources
	* https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp
	* https://css-tricks.com/line-clampin/#weird-webkit-flexbox-way
*/
/*
  Function for converting px font-size values to rem.

  FMI:
  https://dev.to/cogoo/sizing-units-in-css-rem-and-em-4ea2
  https://css-tricks.com/is-it-better-to-use-ems-rems-than-px-for-font-size/
*/
/*

This mixin uses the $tokens map generated by StyleDictionary, which is
imported automatically in every stylesheet thanks to our webpack config/
sass-resources-loader.
 
*/
.BookPageMetadataSection {
  -ms-grid-column: 1;
  -ms-grid-column-span: 7;
  grid-column: 1 / 8; }
  @media only screen and (max-width: 1027px) {
    .BookPageMetadataSection {
      -ms-grid-column: 1;
      -ms-grid-column-span: 8;
      grid-column: 1 / 9; } }
  .BookPageMetadataSection__title {
    margin-bottom: 16px; }
    .BookPageMetadataSection__title > * {
      margin-top: 4px; }
  .BookPageMetadataSection__bookCover {
    width: 40%;
    margin: auto; }
  .BookPageMetadataSection__genres {
    margin: 32px 0; }
    .BookPageMetadataSection__genres a {
      text-decoration: none; }
  .BookPageMetadataSection__description {
    margin-bottom: 16px;
    line-height: 1.37; }
  @media only screen and (max-width: 671px) {
    .BookPageMetadataSection__title {
      text-align: center;
      margin-bottom: 12px; } }