/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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 {
  overflow-anchor: none; }
  .BookPage__jumpNav {
    display: inline-block;
    margin-bottom: 0.8rem; }
  .BookPage__gridContainer {
    position: relative;
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-gap: 3.2rem !important;
    margin-bottom: 4rem; }
    @media only screen and (min-width: 40em) and (max-width: 47.9375em) {
      .BookPage__gridContainer {
        grid-gap: 2.4rem !important; } }
    @media only screen and (max-width: 39.9375em) {
      .BookPage__gridContainer {
        grid-gap: 1.6rem !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: 48em) and (max-width: 63.9375em) {
      .BookPage__leftColumn {
        grid-column: span 4; }
        .BookPage__leftColumn .BookPage__bookCover {
          width: 75%;
          margin: auto; } }
  .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: 47.9375em) {
      .BookPage__rightColumn {
        -ms-grid-column: 1;
        -ms-grid-column-span: 12;
        grid-column: 1 / 13; } }
    .BookPage__rightColumn .BookPage__bookCover {
      -ms-grid-column: 1;
      -ms-grid-column-span: 8;
      grid-column: 1 / 9;
      width: 40%;
      margin: auto; }
  .BookPage__reviewsSection, .BookPage__relatedTopContent {
    -ms-grid-column: 1;
    -ms-grid-column-span: 8;
    grid-column: 1 / 9; }
  .BookPage__relatedBottomContent > * {
    margin-bottom: 4rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
html {
  overflow-y: scroll;
  scroll-padding-top: 11.4rem;
  scroll-behavior: smooth; }

body {
  overflow: initial; }

.PageFrame {
  position: relative;
  min-width: 32rem;
  max-width: 128rem;
  padding: 0 3.2rem;
  margin: 0 auto;
  padding-top: 6.6rem; }
  @media only screen and (min-width: 64em) and (max-width: 79.9375em) {
    .PageFrame {
      max-width: 102.4rem; } }
  @media only screen and (min-width: 40em) and (max-width: 47.9375em) {
    .PageFrame {
      padding: 0 2.4rem; } }
  @media only screen and (max-width: 39.9375em) {
    .PageFrame {
      padding: 0 1.6rem; } }
  @media only screen and (max-width: 79.9375em) {
    .PageFrame {
      padding-top: 11.6rem; } }
  .PageFrame--siteHeaderBanner {
    padding-top: 10.6rem; }
    @media only screen and (max-width: 79.9375em) {
      .PageFrame--siteHeaderBanner {
        padding-top: 15.6rem; } }
  .PageFrame--webView {
    padding-top: 1.6rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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 (max-width: 47.9375em) {
  .HeaderPrimaryNav {
    width: 100%; } }

.HeaderPrimaryNav__dropDown {
  position: relative; }
  .HeaderPrimaryNav__dropDown:focus-within .HeaderNavDropdown {
    display: block; }
    .HeaderPrimaryNav__dropDown:focus-within .HeaderNavDropdown--browse {
      display: flex; }

.HeaderPrimaryNav__list {
  display: flex;
  list-style-type: none;
  margin: 0;
  padding: 0; }
  @media only screen and (max-width: 47.9375em) {
    .HeaderPrimaryNav__list {
      width: 100%;
      display: flex; } }
  @media only screen and (max-width: 47.9375em) {
    .HeaderPrimaryNav__list > li {
      position: static;
      flex: 1 1 auto; } }
  .HeaderPrimaryNav__list > li > a {
    font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 1.6rem;
    display: flex;
    justify-content: center;
    height: 5rem;
    text-decoration: none;
    line-height: 5rem;
    padding: 0 1.6rem; }
    @media only screen and (max-width: 47.9375em) {
      .HeaderPrimaryNav__list > li > a {
        padding: 0;
        white-space: nowrap; } }
    @media only screen and (min-width: 48em) and (max-width: 79.9375em) {
      .HeaderPrimaryNav__list > li > a {
        padding: 0 3.2rem; } }
  .HeaderPrimaryNav__list > li > a:hover,
  .HeaderPrimaryNav__list > li > a:focus,
  .HeaderPrimaryNav__list > li:hover > a,
  .HeaderPrimaryNav__list > li:focus-within > a {
    color: var(--color-background-body-base);
    background: #382110;
    outline: none; }
  .HeaderPrimaryNav__list ul {
    width: 16rem;
    margin: 0; }
    @media only screen and (max-width: 47.9375em) {
      .HeaderPrimaryNav__list ul {
        width: 100%; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.Spotlight {
  font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
  border-left: 0.1rem solid #d8d8d8;
  background: #f6f6f6;
  padding: 0.8rem 0; }
  @media only screen and (max-width: 47.9375em) {
    .Spotlight {
      display: none; } }
  .Spotlight__loadingState {
    background: #f6f6f6;
    width: 41rem; }
  .Spotlight__listTitle {
    color: var(--color-text-heading-base);
    font-size: 1.4rem;
    font-weight: bold;
    text-transform: uppercase;
    padding-left: 1.6rem;
    display: block;
    width: 100%;
    line-height: 2.4;
    padding: 0 1.6rem; }
  .Spotlight__basicGenresList.Spotlight__basicGenresList {
    width: 41rem;
    columns: 3;
    column-gap: 0; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.SpotlightPane {
  font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
  background: #f6f6f6;
  border-left: 0.1rem solid #d8d8d8;
  padding: 0.8rem 0;
  width: 60rem;
  text-align: center;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; }
  @media only screen and (max-width: 39.9375em) {
    .SpotlightPane {
      justify-content: center; } }
  .SpotlightPane__title {
    font-size: 1.6rem;
    color: #333;
    font-weight: bold;
    margin-bottom: 0.8rem; }
  .SpotlightPane__description {
    font-size: 1.4rem;
    color: #181818;
    margin-bottom: 0.8rem; }
  .SpotlightPane__browseGenres {
    font-size: 1.4rem;
    color: #333;
    text-decoration: none;
    margin-top: 0.8rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.LoadingCard {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 1.6rem; }
  .LoadingCard > * {
    margin-bottom: 1.2rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.HeaderSecondaryNav {
  position: absolute;
  right: 0; }
  .HeaderSecondaryNav__list {
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 0; }
    .HeaderSecondaryNav__list > li {
      position: relative; }
    .HeaderSecondaryNav__list--signedOut a {
      display: flex;
      justify-content: center;
      height: 5rem;
      text-decoration: none;
      font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
      color: #382110;
      font-size: 1.6rem;
      line-height: 5rem;
      padding: 0 1.6rem; }
      .HeaderSecondaryNav__list--signedOut a:hover, .HeaderSecondaryNav__list--signedOut a:focus {
        background: #382110;
        color: #fff;
        outline: none; }
      @media only screen and (max-width: 47.9375em) {
        .HeaderSecondaryNav__list--signedOut a {
          display: inline;
          padding: 0.8rem 1.2rem;
          font-size: 1.4rem;
          margin: 0 0.8rem 0 0;
          background-color: #382110;
          border: 0.1rem solid #382110;
          border-radius: 0.3rem;
          color: #fff; }
          .HeaderSecondaryNav__list--signedOut a:hover {
            background-color: #58371f; } }
    .HeaderSecondaryNav__list > li {
      position: relative; }
      .HeaderSecondaryNav__list > li .HeaderNavDropdown {
        display: block; }
  .HeaderSecondaryNav__topDivider {
    border-top: 0.1rem solid #ebebeb;
    margin-top: 0.4rem;
    padding-top: 0.4rem; }
  .HeaderSecondaryNav__desktopNotification {
    position: relative; }
    @media only screen and (min-width: 48em) {
      .HeaderSecondaryNav__desktopNotification.HeaderSecondaryNav__desktopNotification {
        display: inline-block; } }
  .HeaderSecondaryNav__mobileNotificationLinks.HeaderSecondaryNav__mobileNotificationLinks {
    display: inline-block; }
    .HeaderSecondaryNav__mobileNotificationLinks.HeaderSecondaryNav__mobileNotificationLinks > li {
      position: relative;
      display: inline-block; }
      .HeaderSecondaryNav__mobileNotificationLinks.HeaderSecondaryNav__mobileNotificationLinks > li > a {
        padding: 0 0.8rem; }
  .HeaderSecondaryNav .Overlay__window {
    padding: 0;
    min-width: 25rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    border-radius: 0; }
  .HeaderSecondaryNav .Overlay .DropdownMenu {
    padding: 0;
    margin: 0; }
  .HeaderSecondaryNav .Overlay__content {
    padding: 0; }
  @media only screen and (max-width: 79.9375em) {
    .HeaderSecondaryNav {
      position: relative;
      right: auto; }
      .HeaderSecondaryNav__list > li:last-child {
        display: block; }
      .HeaderSecondaryNav__list--signedOut > li {
        display: flex; } }
  @media only screen and (max-width: 47.9375em) {
    .HeaderSecondaryNav__list--signedOut > li {
      display: none; }
    .HeaderSecondaryNav__list--signedOut > li:last-child {
      display: block; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ToggleEditViewInput {
  border-radius: 0.8rem;
  display: inline-flex;
  align-items: center;
  position: relative;
  padding: 1.2rem 0.8rem;
  height: 1.6rem;
  border: 0.15rem solid var(--color-background-body-base); }
  .ToggleEditViewInput:hover {
    cursor: pointer; }
  .ToggleEditViewInput:focus-within {
    border: 0.15rem solid var(--color-border-primary); }
  .ToggleEditViewInput__input {
    position: absolute;
    width: 0.1rem;
    height: 0.1rem;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    clip-path: inset(50%); }
  .ToggleEditViewInput__checkmark {
    border-radius: 0.3rem;
    display: inline-block;
    height: 1.2rem;
    width: 1.2rem;
    border: 0.15rem solid var(--color-background-rating-container-selected-base);
    margin-right: 1.2rem; }
    :hover > .ToggleEditViewInput__checkmark {
      border: 0.15rem solid var(--color-border-primary); }
    .ToggleEditViewInput__checkmark::after {
      content: "";
      position: absolute;
      display: none;
      left: 1.25rem;
      top: 0.85rem;
      width: 0.3rem;
      height: 0.6rem;
      border: solid var(--color-border-primary);
      border-width: 0 0.15rem 0.15rem 0;
      transform: rotate(45deg); }
  .ToggleEditViewInput__input:checked ~ .ToggleEditViewInput__checkmark {
    border: 0.15rem solid var(--color-border-primary); }
    .ToggleEditViewInput__input:checked ~ .ToggleEditViewInput__checkmark::after {
      display: block; }
  .ToggleEditViewInput__input:focus ~ .ToggleEditViewInput__checkmark {
    border: 0.15rem solid var(--color-border-primary); }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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 fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

.HeaderNavDropdown {
  background-color: var(--color-background-body-base);
  display: none;
  opacity: 0;
  animation: 0.3s ease-out 0s 1 normal forwards fadeIn;
  position: absolute;
  top: 5rem;
  list-style-type: none;
  padding: 0.8rem 0;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); }
  @media only screen and (max-width: 47.9375em) {
    .HeaderNavDropdown {
      position: absolute;
      left: 0;
      width: 100%; } }
  .HeaderNavDropdown li {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center; }
    .HeaderNavDropdown li a, .HeaderNavDropdown li__heading {
      color: var(--color-text-heading-base);
      font-size: 1.4rem;
      display: block;
      width: 100%;
      line-height: 2.4;
      text-decoration: none;
      padding: 0 1.6rem; }
    .HeaderNavDropdown li a, .HeaderNavDropdown li__buttons {
      width: auto;
      display: flex; }
    .HeaderNavDropdown li a:hover, .HeaderNavDropdown li a:focus {
      text-decoration: underline; }
  .HeaderNavDropdown__heading {
    font-weight: bold;
    text-transform: uppercase; }
  .HeaderNavDropdown__profileLink {
    font: 1.4rem/2.28571 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif; }
    .HeaderNavDropdown__profileLink a {
      font-weight: bold;
      padding: 1.2rem 1.2rem 0 1.6rem;
      display: block;
      color: #333;
      line-height: 1.3;
      padding-bottom: 1.6rem; }
  .HeaderNavDropdown__avatar.HeaderNavDropdown__avatar {
    width: 10rem;
    padding-right: 0; }
    @media only screen and (min-width: 48em) {
      .HeaderNavDropdown__avatar.HeaderNavDropdown__avatar {
        display: none; } }
  .HeaderNavDropdown__toggleEditView {
    padding-left: 0.8rem;
    padding-bottom: 0.8rem; }
  .HeaderNavDropdown--overlay {
    position: sticky;
    display: block; }
    @media only screen and (max-width: 47.9375em) {
      .HeaderNavDropdown--overlay {
        opacity: 1;
        animation: none;
        box-shadow: none; } }
  .HeaderNavDropdown--browse {
    padding: 0; }
    .HeaderNavDropdown--browse > ul {
      padding: 0.8rem 0; }
    @media only screen and (max-width: 63.9375em) {
      .HeaderNavDropdown--browse {
        position: fixed;
        left: 50%;
        top: 10rem;
        transform: translateX(-50%); } }
    @media only screen and (max-width: 47.9375em) {
      .HeaderNavDropdown--browse {
        top: 10rem; } }
  @media only screen and (max-width: 63.9375em) {
    .HeaderNavDropdown--siteHeaderBanner {
      top: 14rem; } }
  @media only screen and (max-width: 47.9375em) {
    .HeaderNavDropdown--siteHeaderBanner {
      top: 14rem; } }
  .HeaderNavDropdown--pinToRight {
    left: auto;
    right: 0;
    width: 32rem; }
    @media only screen and (min-width: 48em) {
      .HeaderNavDropdown--pinToRight {
        width: 25rem; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.HeaderSecondaryNavButton {
  display: block;
  height: 5rem;
  text-decoration: none;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 0 0.8rem;
  display: flex;
  align-items: center; }
  .HeaderSecondaryNavButton:hover, .HeaderSecondaryNavButton:focus,
  li:not(.HeaderSecondaryNav__buttons):hover > .HeaderSecondaryNavButton,
  li:not(.HeaderSecondaryNav__buttons):focus-within > .HeaderSecondaryNavButton, .HeaderSecondaryNavButton--highlight {
    background: #382110;
    color: #fff;
    outline: none; }
  .HeaderSecondaryNavButton__icon {
    border-radius: 50%;
    display: block;
    height: 3rem;
    width: 3rem;
    background: #c1b8a6; }
    .HeaderSecondaryNavButton__icon path {
      fill: var(--color-background-body-base); }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.NotificationsBadge {
  background-color: var(--color-background-notif-badge-base);
  color: var(--color-text-notif-badge-base);
  border-radius: 0.3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  text-align: center;
  min-width: 1.4rem;
  top: 0.3rem;
  right: 0.3rem;
  height: 2rem;
  padding: 0.1rem 0.3rem 0;
  font-size: 1.2rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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 fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

.NotificationsTray {
  background-color: var(--color-background-body-base);
  position: absolute;
  top: 5rem;
  right: 0;
  width: 33rem;
  opacity: 0;
  animation: 0.15s ease-out 0s 1 normal forwards fadeIn;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); }
  .NotificationsTray__loading {
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: center; }
    .NotificationsTray__loading > i {
      width: 5rem; }
  .NotificationsTray__header {
    padding: 1.6rem;
    border-bottom: 0.1rem solid var(--color-background-divider); }
  .NotificationsTray__title {
    color: var(--color-text-heading-base);
    font-size: 1.4rem;
    display: inline-block;
    font-weight: 700;
    text-transform: uppercase;
    padding-left: 1.6rem;
    text-align: left;
    width: 100%;
    line-height: 1.4;
    padding: 0 1.6rem;
    text-decoration: none; }
  .NotificationsTray__allNotificationsLinkBox {
    text-decoration: none; }
  .NotificationsTray__allNotificationsLink {
    color: var(--color-text-subdued);
    font-size: 1.4rem;
    display: block;
    width: 100%;
    text-align: left;
    padding: 0 1.6rem; }
  .NotificationsTray__allNotificationsLinkBox:hover .NotificationsTray__allNotificationsLink {
    color: var(--color-text-action-secondary-hover);
    text-decoration: underline; }
  .NotificationsTray__notifications {
    max-height: 38rem;
    overflow-y: scroll; }
    .NotificationsTray__notifications::-webkit-scrollbar {
      -webkit-appearance: none;
      width: 0.7rem; }
    .NotificationsTray__notifications::-webkit-scrollbar-thumb {
      border-radius: 0.3rem;
      background-color: var(--color-background-notif-scrollbar-thumb); }
  .NotificationsTray__notification {
    display: flex;
    padding: 1.2rem 1.6rem;
    border-bottom: 0.1rem solid var(--color-background-divider); }
    .NotificationsTray__notification:last-child {
      border: 0; }
  .NotificationsTray__notificationAvatar {
    padding: 0 1.2rem 0 0; }
  .NotificationsTray__actorLink {
    font-weight: 700;
    text-decoration: none; }
    .NotificationsTray__actorLink:hover {
      text-decoration: underline; }
  .NotificationsTray__notificationMessage {
    color: var(--color-text-body-standard);
    font-size: 1.4rem; }
  .NotificationsTray__notificationMessageBox {
    padding: 0 0 0.4rem; }
  .NotificationsTray__notificationResourceLink {
    color: var(--color-text-action-secondary-base);
    text-decoration: none; }
    .NotificationsTray__notificationResourceLink:hover {
      color: var(--color-text-action-secondary-hover);
      text-decoration: underline; }
  .NotificationsTray__notificationTimeBox {
    color: var(--color-text-subdued); }
  .NotificationsTray__notificationAlertText {
    color: var(--color-text-warning);
    padding: 0 0.8rem 1.2rem 0; }
  .NotificationsTray__notificationHistoryText {
    color: var(--color-text-notif-history);
    font-size: 1.4rem;
    display: block;
    font-style: italic; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.HeaderSearch {
  position: relative;
  height: 3.2rem;
  width: 39.2rem;
  padding: 0 1.6rem; }
  .HeaderSearch form {
    height: 100%;
    width: 100%; }
  .HeaderSearch__label, .HeaderSearch__input {
    display: block;
    font-size: 1.4rem;
    height: 3.2rem;
    width: 100%;
    padding: 0.4rem 2.4rem 0.4rem 0.8rem; }
  .HeaderSearch__label {
    position: absolute;
    left: 0;
    top: 0;
    line-height: 2.6rem;
    opacity: 0.5;
    padding-left: 1.2rem;
    transition: opacity 0.25s ease-in-out; }
    .HeaderSearch__label--hidden {
      opacity: 0; }
  .HeaderSearch__input {
    background-color: var(--color-background-body-base);
    border-radius: 0.3rem;
    border: 0.1rem solid #dcd6cc;
    line-height: 3.2rem; }
    .HeaderSearch__input:focus {
      outline: none;
      box-shadow: 0 0 0.4rem rgba(185, 173, 153, 0.5); }
  .HeaderSearch__button {
    display: block;
    position: absolute;
    top: 0;
    right: 1.6rem;
    height: 100%;
    width: 3.2rem;
    cursor: pointer;
    padding: 0;
    margin: 0;
    background: transparent;
    border: 0;
    display: flex;
    justify-content: center;
    align-content: center; }
    .HeaderSearch__button .Icon {
      height: 80%;
      width: 80%;
      margin-top: 10%; }
      .HeaderSearch__button .Icon path {
        fill: #707070; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.HeaderSearchBookItem {
  display: block;
  overflow: hidden;
  border-bottom: 0.1rem solid #d8d8d8; }
  .HeaderSearchBookItem__link, .HeaderSearchBookItem__link--selected {
    font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
    display: block;
    position: relative;
    width: 100%;
    height: 5.8rem;
    padding: 0.8rem 0.8rem 0.8rem 6.6rem;
    text-decoration: none;
    word-wrap: break-word;
    font-size: 1.4rem;
    line-height: 1.6;
    color: #333;
    font-weight: 600; }
  .HeaderSearchBookItem__link--selected {
    background: #f4f1ea; }
    .HeaderSearchBookItem__link--selected::after {
      box-shadow: 0 0 0.8rem rgba(0, 0, 0, 0.5); }
    .HeaderSearchBookItem__link--selected::after {
      content: "";
      display: block;
      position: absolute;
      bottom: -0.1rem;
      left: 0;
      right: 0;
      height: 0.1rem;
      box-shadow: 0 0 0.1rem rgba(0, 0, 0, 0);
      transition: box-shadow 0.2s ease-out; }
  .HeaderSearchBookItem__image {
    display: block;
    position: absolute;
    top: 0.8rem;
    left: 0.8rem;
    width: 5rem;
    border: 0; }
  .HeaderSearchBookItem__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden; }
  .HeaderSearchBookItem__author {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    font-family: Merriweather, Georgia, "Times New Roman", serif;
    font-weight: 400;
    font-size: 1.2rem;
    line-height: 1.6; }
    .HeaderSearchBookItem__author .Icon {
      height: 1.4rem;
      width: 1.4rem; }
      .HeaderSearchBookItem__author .Icon path {
        fill: var(--color-text-author-base); }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.HeaderSearchList {
  background-color: var(--color-background-body-base);
  display: block;
  border: 0.1rem solid #d8d8d8;
  border-width: 0 0.1rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.HeaderSearchSeeMore {
  display: block;
  overflow: hidden;
  border-bottom: 0.1rem solid #d8d8d8; }
  .HeaderSearchSeeMore__link {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
    display: block;
    position: relative;
    width: 100%;
    text-decoration: none;
    word-wrap: break-word;
    text-align: center;
    padding: 0.8rem;
    font-size: 1.4rem;
    line-height: 1.6;
    color: #016661; }
    .HeaderSearchSeeMore__link:hover {
      text-decoration: underline; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.HeaderSearchListTray {
  background-color: var(--color-background-body-base);
  display: block;
  position: relative;
  border: 0.1rem solid #d8d8d8;
  border-width: 0 0.1rem;
  z-index: 100; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.Header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 5rem;
  width: 100%;
  background: #f4f1ea;
  box-shadow: 0 0.1rem 0.2rem rgba(0, 0, 0, 0.15);
  z-index: 100; }
  @media only screen and (max-width: 79.9375em) {
    .Header::after {
      content: "";
      pointer-events: none;
      user-select: none;
      position: absolute;
      top: 0;
      left: 0;
      height: 5rem;
      width: 100%;
      box-shadow: 0 0.1rem 0.2rem rgba(0, 0, 0, 0.15); } }
  .Header__siteHeaderBanner {
    height: 9rem; }
    @media only screen and (max-width: 79.9375em) {
      .Header__siteHeaderBanner::after {
        height: 9rem; } }
  .Header__contents {
    position: relative;
    display: flex;
    align-items: center;
    max-width: 128rem;
    margin: 0 auto; }
    @media only screen and (max-width: 79.9375em) {
      .Header__contents {
        justify-content: space-between;
        background-color: #f4f1ea; } }
  .Header__logo {
    display: block;
    height: 5rem;
    text-decoration: none;
    padding: 0 0.4rem;
    width: 14rem;
    margin: 0 1rem;
    box-sizing: content-box;
    display: flex; }
    .Header__logo:focus {
      border-radius: 0.3rem;
      box-shadow: 0 0 0 0.3rem var(--color-shadow-button-focus); }
    @media only screen and (max-width: 47.9375em) {
      .Header__logo {
        position: absolute;
        left: 50%;
        transform: translateX(-50%); } }
  @media only screen and (max-width: 79.9375em) {
    .Header__primaryNavContainer {
      display: block;
      height: 5rem;
      background: #f4f1ea;
      position: absolute;
      top: 5rem;
      left: 0;
      right: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 0.1rem 0.2rem rgba(0, 0, 0, 0.15);
      transition: all 0.2s ease-out;
      z-index: -1; } }
  @media only screen and (max-width: 79.9375em) {
    .Header__primaryNavContainer--hide {
      transform: translateY(-100%); } }
  @media only screen and (max-width: 79.9375em) {
    .Header__searchContainer {
      flex: 1 1 auto; } }
  @media only screen and (max-width: 47.9375em) {
    .Header__searchContainer {
      display: none;
      align-items: center;
      justify-content: center;
      height: 5rem;
      background: #f4f1ea;
      position: absolute;
      top: 5rem;
      left: 0;
      right: 0; } }
  @media only screen and (max-width: 47.9375em) {
    .Header__searchContainer--siteHeaderBanner {
      top: 9rem; } }
  .Header__searchContainer--open {
    display: flex; }
  .Header__toggleSearchContainer {
    display: none;
    height: 100%;
    width: 5rem;
    background: none;
    border: 0;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    padding: 1rem; }
    @media only screen and (max-width: 47.9375em) {
      .Header__toggleSearchContainer {
        display: flex; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.SiteHeaderBanner__topFullImageContainer {
  display: flex;
  justify-content: center;
  align-items: center; }

.SiteHeaderBanner img {
  max-width: none;
  height: 4rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.Footer {
  width: 100%;
  min-width: 32rem;
  background: #f4f1ea;
  padding: 3.2rem 0; }
  .Footer__contents {
    position: relative;
    display: flex;
    max-width: 128rem;
    margin: 0 auto;
    padding: 0 1.2rem; }
    @media only screen and (max-width: 47.9375em) {
      .Footer__contents {
        flex-direction: column; }
        .Footer__contents > * {
          margin-bottom: 2.4rem; } }
  .Footer__column {
    width: 20rem; }
  .Footer__heading {
    text-transform: uppercase;
    font: bold 1.4rem/2 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: var(--color-text-body-standard); }
  .Footer__list a {
    text-decoration: none;
    color: #382110;
    font: normal 1.4rem/1.5 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif; }
    .Footer__list a:hover, .Footer__list a:focus {
      text-decoration: underline; }
  .Footer__list--inline {
    display: flex; }
    .Footer__list--inline a {
      border-radius: 50%;
      display: block;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-right: 0.4rem; }
      .Footer__list--inline a:focus {
        box-shadow: 0 0 0 0.3rem var(--color-shadow-button-focus); }
    .Footer__list--inline .Icon {
      height: 3rem;
      width: 3rem; }
      .Footer__list--inline .Icon path {
        color: #767676; }
  .Footer__right {
    position: absolute;
    top: 0;
    right: 1.6rem; }
  .Footer__badge {
    border-radius: 0.3rem;
    display: inline-block;
    width: 13.5rem;
    margin-right: 1.2rem; }
    @media only screen and (max-width: 63.9375em) {
      .Footer__badge {
        display: block; } }
    .Footer__badge:focus {
      box-shadow: 0 0 0 0.3rem #f4f1ea, 0 0 0 0.6rem var(--color-shadow-button-focus); }
    .Footer__badge svg {
      display: block;
      width: 100%; }
  .Footer__copy {
    margin-top: 1.2rem;
    font: normal 1.4rem/1.5 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.LoginInterstitial {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; }
  .LoginInterstitial__img {
    width: 100%;
    height: auto; }
  .LoginInterstitial__buttonWrap {
    padding: 0.8rem 0;
    width: 100%; }
  .LoginInterstitial__buttonArea {
    width: 100%;
    max-width: 30rem; }
  .LoginInterstitial__text {
    text-align: center;
    padding: 1.6rem 0; }
  .LoginInterstitial__finePrint {
    text-align: center;
    padding: 0.8rem 0 0; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ThemeToggleButton {
  display: inline-block;
  position: fixed;
  left: 5%;
  z-index: 50;
  bottom: 5%; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.SupportedErrorCodes__link {
  color: var(--color-text-action-secondary-base);
  text-decoration: none; }
  .SupportedErrorCodes__link:hover {
    color: var(--color-text-action-secondary-hover);
    text-decoration: underline; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ErrorPage__top {
  position: relative;
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-gap: 3.2rem !important;
  padding-top: 2.4rem;
  min-height: 40rem;
  padding-bottom: 4rem;
  max-width: 102.4rem;
  margin: 0 auto; }
  @media only screen and (min-width: 40em) and (max-width: 47.9375em) {
    .ErrorPage__top {
      grid-gap: 2.4rem !important; } }
  @media only screen and (max-width: 39.9375em) {
    .ErrorPage__top {
      grid-gap: 1.6rem !important; } }
  @supports (display: -ms-grid) {
    .ErrorPage__top {
      display: -ms-grid !important;
      -ms-grid-columns: 1fr [12]; } }

.ErrorPage__leftColumn {
  grid-column: span 6; }
  @media only screen and (max-width: 47.9375em) {
    .ErrorPage__leftColumn {
      grid-column: span 12; } }

.ErrorPage__rightColumn {
  grid-column: span 6; }
  @media only screen and (max-width: 47.9375em) {
    .ErrorPage__rightColumn {
      grid-column: span 12;
      padding-bottom: 4rem; } }

.ErrorPage__title {
  margin-bottom: 1.6rem; }

.ErrorPage__goBackButton {
  margin-top: 1.6rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.BookCard {
  display: flex;
  margin-bottom: 1.2rem;
  min-height: 2rem; }
  .BookCard__cover {
    transition: transform 0.2s ease-in-out;
    filter: drop-shadow(0 0.2rem 0.8rem rgba(0, 0, 0, 0.2));
    position: relative; }
  .BookCard__block {
    width: 100%; }
  .BookCard__interactive {
    border-radius: 0 3% 3% 0/ 2%;
    text-decoration: none;
    text-align: left; }
    .BookCard__interactive:hover .BookCard__cover {
      transform: scale(1.03); }
    .BookCard__interactive:hover .BookCard__title {
      text-decoration: underline; }
    .BookCard__interactive:focus-within {
      box-shadow: 0 0 0 0.9rem var(--color-background-body-base), 0 0 0 1.2rem var(--color-shadow-button-focus); }
  .BookCard__clickCardTarget {
    display: inline-block;
    margin: auto; }
  .BookCard__content {
    margin-top: 1.6rem; }
  .BookCard__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    color: var(--color-text-heading-base);
    font-family: Copernicus, "Libre Baskerville", Georgia, serif;
    font-weight: 600;
    overflow: hidden;
    line-height: 1.5; }
  .BookCard__authorName {
    color: var(--color-text-heading-base);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ResponsiveImage {
  display: block;
  height: auto;
  width: 100%; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.AverageRating {
  display: flex; }
  .AverageRating .RatingStar {
    margin-top: 0.1rem; }
    .AverageRating .RatingStar svg {
      width: 1.4rem;
      height: 1.4rem; }
  .AverageRating__ratingValue {
    padding-left: 0.4rem; }
  .AverageRating__ratingsCount {
    color: #707070; }
    .AverageRating__ratingsCount::before {
      padding: 0.4rem;
      content: "\B7"; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.GiveawayMetadata {
  color: var(--color-text-subdued);
  font-size: 1.4rem; }
  .GiveawayMetadata__endDate::before {
    padding: 0.4rem;
    content: "\B7"; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 48em) {
    .HomeHeroArticlePrimary {
      flex-direction: row; } }
  @media only screen and (min-width: 48em) {
    .HomeHeroArticlePrimary {
      position: relative;
      display: grid !important;
      grid-template-columns: repeat(12, minmax(0, 1fr));
      grid-gap: 3.2rem !important; } }
  @media only screen and (min-width: 48em) and (min-width: 40em) and (max-width: 47.9375em) {
    .HomeHeroArticlePrimary {
      grid-gap: 2.4rem !important; } }
  @media only screen and (min-width: 48em) and (max-width: 39.9375em) {
    .HomeHeroArticlePrimary {
      grid-gap: 1.6rem !important; } }
  @media only screen and (min-width: 48em) {
      @supports (display: -ms-grid) {
        .HomeHeroArticlePrimary {
          display: -ms-grid !important;
          -ms-grid-columns: 1fr [12]; } } }
  .HomeHeroArticlePrimary__imageContainer {
    display: flex;
    height: 100%;
    min-height: 22.4rem;
    max-height: 45rem;
    cursor: pointer; }
    @media only screen and (min-width: 48em) {
      .HomeHeroArticlePrimary__imageContainer {
        min-height: 30rem;
        max-height: 45rem;
        grid-column: span 6; } }
    @media only screen and (min-width: 64em) {
      .HomeHeroArticlePrimary__imageContainer {
        grid-column: span 8;
        min-height: 38rem;
        max-height: 50rem; } }
    .HomeHeroArticlePrimary__imageContainer > img {
      display: block;
      min-width: 100%;
      min-height: 100%;
      object-fit: cover; }
  .HomeHeroArticlePrimary__content {
    display: flex;
    flex-direction: column;
    padding: 2.4rem; }
    @media only screen and (min-width: 48em) {
      .HomeHeroArticlePrimary__content {
        grid-column: span 6;
        padding: 2.4rem 2.4rem 2.4rem 0; } }
    @media only screen and (min-width: 64em) {
      .HomeHeroArticlePrimary__content {
        grid-column: span 4; } }
  .HomeHeroArticlePrimary__headline {
    padding-bottom: 1.6rem; }
    @media only screen and (min-width: 40em) and (max-width: 47.9375em) {
      .HomeHeroArticlePrimary__headline {
        padding-bottom: 2.4rem; } }
    @media only screen and (min-width: 48em) and (max-width: 63.9375em) {
      .HomeHeroArticlePrimary__headline {
        padding-bottom: 1.6rem; } }
    @media only screen and (min-width: 64em) {
      .HomeHeroArticlePrimary__headline {
        padding-bottom: 2.4rem; } }
    .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: 1.6rem; }
    .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: 40em) and (max-width: 47.9375em) {
      .HomeHeroArticlePrimary__excerpt {
        margin-bottom: 2.4rem; } }
    @media only screen and (min-width: 48em) {
      .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: 48em) and (max-width: 63.9375em) {
      .HomeHeroArticlePrimary__excerpt {
        margin-bottom: 1.6rem; } }
    @media only screen and (min-width: 64em) {
      .HomeHeroArticlePrimary__excerpt {
        margin-bottom: 3.2rem; } }
  .HomeHeroArticlePrimary__counts {
    display: flex;
    flex-grow: 1;
    align-items: flex-end;
    color: var(--color-text-subdued); }
  .HomeHeroArticlePrimary__additionalCount::before {
    padding: 0.4rem;
    content: "\B7"; }

.HomeHeroArticleSecondary {
  padding-bottom: 3.2rem; }
  .HomeHeroArticleSecondary__link:focus {
    text-decoration: underline; }

.HomeHeroSection {
  display: block; }
  @media only screen and (min-width: 48em) and (max-width: 63.9375em) {
    .HomeHeroSection {
      position: relative;
      display: grid !important;
      grid-template-columns: repeat(8, minmax(0, 1fr));
      grid-gap: 3.2rem !important; } }
  @media only screen and (min-width: 48em) and (max-width: 63.9375em) and (min-width: 40em) and (max-width: 47.9375em) {
    .HomeHeroSection {
      grid-gap: 2.4rem !important; } }
  @media only screen and (min-width: 48em) and (max-width: 63.9375em) and (max-width: 39.9375em) {
    .HomeHeroSection {
      grid-gap: 1.6rem !important; } }
  @media only screen and (min-width: 48em) and (max-width: 63.9375em) {
      @supports (display: -ms-grid) {
        .HomeHeroSection {
          display: -ms-grid !important;
          -ms-grid-columns: 1fr [8]; } } }
  @media only screen and (min-width: 64em) and (max-width: 79.9375em) {
    .HomeHeroSection {
      position: relative;
      display: grid !important;
      grid-template-columns: repeat(12, minmax(0, 1fr));
      grid-gap: 3.2rem !important; } }
  @media only screen and (min-width: 64em) and (max-width: 79.9375em) and (min-width: 40em) and (max-width: 47.9375em) {
    .HomeHeroSection {
      grid-gap: 2.4rem !important; } }
  @media only screen and (min-width: 64em) and (max-width: 79.9375em) and (max-width: 39.9375em) {
    .HomeHeroSection {
      grid-gap: 1.6rem !important; } }
  @media only screen and (min-width: 64em) and (max-width: 79.9375em) {
      @supports (display: -ms-grid) {
        .HomeHeroSection {
          display: -ms-grid !important;
          -ms-grid-columns: 1fr [12]; } } }
  @media only screen and (min-width: 80em) {
    .HomeHeroSection {
      position: relative;
      display: grid !important;
      grid-template-columns: repeat(16, minmax(0, 1fr));
      grid-gap: 3.2rem !important; } }
  @media only screen and (min-width: 80em) and (min-width: 40em) and (max-width: 47.9375em) {
    .HomeHeroSection {
      grid-gap: 2.4rem !important; } }
  @media only screen and (min-width: 80em) and (max-width: 39.9375em) {
    .HomeHeroSection {
      grid-gap: 1.6rem !important; } }
  @media only screen and (min-width: 80em) {
      @supports (display: -ms-grid) {
        .HomeHeroSection {
          display: -ms-grid !important;
          -ms-grid-columns: 1fr [16]; } } }
  @media only screen and (max-width: 47.9375em) {
    .HomeHeroSection__primaryContent {
      padding: 1.6rem 0; } }
  @media only screen and (min-width: 40em) and (max-width: 47.9375em) {
    .HomeHeroSection__primaryContent {
      padding: 2.4rem 0; } }
  @media only screen and (min-width: 48em) {
    .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: 64em) {
    .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: 48em) {
      .HomeHeroSection__relatedContent {
        padding: 3.2rem 0; } }
    @media only screen and (min-width: 80em) {
      .HomeHeroSection__relatedContent {
        grid-column: span 4;
        flex-grow: 1;
        justify-content: space-between; } }
  .HomeHeroSection__links {
    display: none; }
    @media only screen and (min-width: 80em) {
      .HomeHeroSection__links {
        display: block; } }
  .HomeHeroSection__link {
    padding-bottom: 3.2rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 1.6rem 0.8rem 0 0.8rem;
  transform: translate3d(0, 0, 0); }
  .ReviewCardSmall__ElevationCard {
    display: inline-block;
    width: 100%;
    visibility: visible; }
    @media only screen and (min-width: 48em) {
      .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: 0.8rem;
    padding: 0 1.2rem;
    box-shadow: 0 0.2rem 0.8rem 0 rgba(0, 0, 0, 0.2);
    background-color: var(--color-background-body-base); }
  .ReviewCardSmall__swooshSvg {
    transform: translate(-50%, -3.5rem);
    position: absolute;
    z-index: 0;
    top: 0;
    left: 50%;
    width: 100%;
    min-width: 40rem;
    height: 100%; }
  .ReviewCardSmall__swooshPath {
    fill: #faf8f6; }
  .ReviewCardSmall__book {
    display: flex;
    padding-bottom: 1.6rem; }
  .ReviewCardSmall__bookInfo {
    width: 72%;
    height: 16rem;
    padding: 0 0 1.2rem 1.2rem; }
  .ReviewCardSmall__bookCoverColumn {
    width: 8rem;
    margin: 0 0.4rem; }
  .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 1.2rem 0 0; }
    .ReviewCardSmall__bookAuthorLink:hover, .ReviewCardSmall__bookAuthorLink:focus {
      text-decoration: underline;
      color: var(--color-text-action-primary-hover); }
  .ReviewCardSmall__genres {
    padding-top: 0.8rem;
    height: 7.8rem;
    -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: 0.4rem;
      content: "\B7"; }
    .ReviewCardSmall__bookGenreLink:hover, .ReviewCardSmall__bookGenreLink:focus {
      color: var(--color-text-action-primary-hover); }
  .ReviewCardSmall__content {
    height: 21rem;
    position: relative;
    padding: 1.6rem 0.8rem 1.6rem 0; }
    .ReviewCardSmall__content img {
      display: none; }
    .ReviewCardSmall__content br {
      display: none; }
  .ReviewCardSmall__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.2rem; }
  .ReviewCardSmall__reviewArea {
    max-height: 7.5rem;
    overflow: hidden; }
  .ReviewCardSmall__footer {
    position: absolute;
    bottom: 1.6rem;
    left: 0;
    width: 100%; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 9rem; }

.ReviewerProfile {
  display: flex;
  flex-direction: column;
  padding-bottom: 1.6rem; }
  .ReviewerProfile__meta {
    display: flex;
    flex-direction: column;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden; }
  .ReviewerProfile__info {
    overflow: hidden; }
  .ReviewerProfile__name {
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: anywhere;
    margin-bottom: 0.4rem; }
  .ReviewerProfile__author {
    display: inline-flex;
    align-items: center; }
    .ReviewerProfile__author .BadgeIcon {
      position: relative;
      top: 0.2rem; }
      .ReviewerProfile__author .BadgeIcon svg {
        height: 1.4rem;
        width: 1.4rem; }
  @media only screen and (min-width: 48em) {
    .ReviewerProfile__avatar, .ReviewerProfile__info, .ReviewerProfile__follow {
      margin-bottom: 0.8rem; }
    .ReviewerProfile__name {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -moz-box-orient: vertical;
      -webkit-line-clamp: 2;
      overflow: hidden; } }
  @media only screen and (max-width: 47.9375em) {
    .ReviewerProfile {
      flex-direction: row;
      align-items: center;
      padding-bottom: 0; }
      .ReviewerProfile .ReviewerProfile__follow {
        margin-left: 1.6rem; }
      .ReviewerProfile .ReviewerProfile__avatar {
        flex: 0;
        margin-right: 1.6rem;
        margin-bottom: 0; }
      .ReviewerProfile .ReviewerProfile__info {
        flex: 1;
        margin-bottom: 0; }
      .ReviewerProfile .ReviewerProfile__name {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        -webkit-line-clamp: 1;
        overflow: hidden;
        margin-bottom: 0; }
      .ReviewerProfile .ReviewerProfile__meta {
        display: block; } }
  .ReviewerProfile--small {
    flex-direction: row;
    align-items: center;
    padding-bottom: 0; }
    .ReviewerProfile--small .ReviewerProfile__follow {
      margin-left: 1.6rem; }
    .ReviewerProfile--small .ReviewerProfile__avatar {
      flex: 0;
      margin-right: 1.6rem;
      margin-bottom: 0; }
    .ReviewerProfile--small .ReviewerProfile__info {
      flex: 1;
      margin-bottom: 0; }
    .ReviewerProfile--small .ReviewerProfile__name {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -moz-box-orient: vertical;
      -webkit-line-clamp: 1;
      overflow: hidden;
      margin-bottom: 0; }
    .ReviewerProfile--small .ReviewerProfile__meta {
      display: block; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 9rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.AuthorFollowButton {
  width: 9rem; }

@charset "UTF-8";
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.SocialFooter__statsContainer {
  margin-bottom: 0.8rem; }

@media only screen and (max-width: 47.9375em) {
  .SocialFooter__statsContainer {
    margin-bottom: 0; } }

.SocialFooter__action {
  display: inline-block; }

.SocialFooter__action + .SocialFooter__action {
  margin-left: 1.2rem; }

.SocialFooter__statsContainer :not(:first-child)::before {
  padding: 0 0.8rem;
  content: "\2022"; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.CommentCard {
  display: flex;
  flex-direction: row; }
  .CommentCard__profile {
    margin-right: 1.2rem; }
  .CommentCard__content {
    flex: 1;
    overflow: hidden; }
  .CommentCard__row {
    display: flex;
    align-items: baseline; }
  .CommentCard__name {
    margin-right: 1.2rem; }
    .CommentCard__name--disabled {
      color: var(--color-text-disabled); }
  .CommentCard__timestamp {
    height: 100%;
    font: 400 1.4rem/1.35714 "Proxima Nova", Montserrat, Arial, sans-serif;
    color: var(--color-text-subdued);
    flex-shrink: 0; }
  .CommentCard__name {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ContributorLink {
  display: flex;
  overflow: hidden; }
  .ContributorLink__name {
    flex-basis: auto;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
  .ContributorLink__role {
    color: var(--color-text-subdued); }
  .ContributorLink__badge {
    color: var(--color-text-author-base);
    flex-shrink: 0;
    margin-left: 0.4rem; }
  .ContributorLink__badge--medium .BadgeIcon svg {
    height: 2rem;
    width: 2rem; }
  .ContributorLink__badge--small {
    height: 1.4rem;
    display: flex; }
    .ContributorLink__badge--small .BadgeIcon svg {
      height: 1.4rem;
      width: 1.4rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.CommentCardForm {
  display: flex; }
  .CommentCardForm__profile {
    margin-top: 0.4rem; }
  .CommentCardForm__form {
    padding-left: 0.8rem;
    flex: 1; }
  .CommentCardForm__actions {
    display: none;
    justify-content: space-between;
    flex-direction: row-reverse;
    /* Hidden until the user's entered text */
    overflow: hidden;
    max-height: 0;
    transition: all 0.5s ease-in-out; }
  .CommentCardForm__actions--show {
    display: flex;
    /* Some height > action container height */
    max-height: 10rem;
    padding-top: 0.8rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.CommentsList {
  margin-top: 1.6rem; }
  .CommentsList .CommentCardForm,
  .CommentsList .CommentCard + .CommentCard {
    margin: 1.6rem 0; }
  .CommentsList a.CommentsList__emptyCTA {
    text-decoration: underline; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ReviewText {
  position: relative;
  margin-bottom: 1.6rem; }
  .ReviewText--hideContent .ReviewText__content {
    /* TODO-EV-1502 - change to visibility: hidden after figuring out Safari issue
       * visibility: hidden, hides from screen readers as well
       * https://webaim.org/techniques/css/invisiblecontent/
       */
    display: none; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 1.6rem;
  height: 11.5rem;
  background-color: #faf8f6; }

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

.ArticleCard__tags {
  width: 100%;
  padding: 1.6rem 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: 0.4rem;
    content: "\B7"; }
  .ArticleCard__tag:first-child::before {
    display: none; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 40em) {
  .HomePage {
    padding-top: 1.6rem; } }

.HomePage__widgetsArea {
  padding-bottom: 4rem; }
  .HomePage__widgetsArea .Carousel,
  .HomePage__widgetsArea .DynamicCarousel {
    padding-top: 4rem; }

.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 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.EditionDisambiguationAlert > div {
  padding: 1.2rem 1.6rem; }

.EditionDisambiguationAlert__container {
  display: flex;
  justify-content: space-between;
  align-items: center; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.WTRStepShelving {
  padding-top: 0.8rem; }
  .WTRStepShelving__shelf {
    margin-bottom: 1.2rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.WTRStepTagging {
  padding-top: 0.8rem;
  height: 30vh; }
  .WTRStepTagging__inputGroup {
    display: flex;
    align-items: center;
    margin-bottom: 1.6rem; }
  .WTRStepTagging__input {
    margin-right: 1.2rem;
    flex: 1; }
  .WTRStepTagging__tagsContainer .Button__container {
    margin: 0.4rem 1.2rem 0.4rem 0; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.BookRatingStars {
  display: flex;
  flex-direction: column;
  align-items: center; }
  .BookRatingStars__message {
    text-align: center;
    padding: 0.4rem; }
    .BookRatingStars__message a {
      text-decoration: underline; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.BookActions {
  margin: 1.6rem auto 2.4rem auto;
  display: flex;
  flex-direction: column; }
  @media only screen and (max-width: 47.9375em) {
    .BookActions {
      max-width: 26rem;
      display: block; } }
  .BookActions__alert {
    margin-bottom: 1.2rem; }
  .BookActions__button {
    margin: 0.8rem 0; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ReviewCard {
  position: relative;
  display: grid !important;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  grid-gap: 3.2rem !important;
  margin-bottom: 2.4rem; }
  @media only screen and (min-width: 40em) and (max-width: 47.9375em) {
    .ReviewCard {
      grid-gap: 2.4rem !important; } }
  @media only screen and (max-width: 39.9375em) {
    .ReviewCard {
      grid-gap: 1.6rem !important; } }
  @supports (display: -ms-grid) {
    .ReviewCard {
      display: -ms-grid !important;
      -ms-grid-columns: 1fr [8]; } }
  .ReviewCard__profile {
    grid-column: span 2; }
  .ReviewCard__content {
    position: relative;
    grid-column: span 6;
    padding: 1.6rem 0 2.4rem 0;
    border-bottom: 0.1rem solid var(--color-background-divider); }
  .ReviewCard:last-of-type .ReviewCard__content {
    border-bottom: 0; }
  .ReviewCard__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.2rem; }
  .ReviewCard__tags {
    margin-bottom: 1.2rem; }
  @media only screen and (max-width: 47.9375em) {
    .ReviewCard__profile, .ReviewCard__content {
      grid-column: span 8;
      padding-top: 0; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ShelvingSocialSignalCard {
  border-radius: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.6rem 2.4rem;
  border: 0.1rem solid var(--color-border-secondary-active-base);
  text-align: left; }
  .ShelvingSocialSignalCard__text {
    padding-top: 1.2rem; }
  .ShelvingSocialSignalCard__avatars {
    margin-left: 1.6rem;
    min-width: 10rem;
    display: flex;
    justify-content: flex-end; }
  .ShelvingSocialSignalCard:focus {
    box-shadow: 0 0 0 0.2rem var(--color-shadow-button-focus); }
  .ShelvingSocialSignalCard:hover {
    background-color: var(--color-background-transparent-hover); }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.SignalList {
  display: grid;
  grid-template-rows: repeat(5, minmax(0, 1fr));
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 3.2rem;
  row-gap: 1.6rem;
  grid-auto-flow: column; }
  @media only screen and (max-width: 63.9375em) {
    .SignalList {
      display: flex;
      flex-direction: column; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ShelvingListModal {
  padding: 1.2rem 0;
  min-width: 34rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ShelvingCard {
  display: block;
  padding: 0.8rem 0.8rem;
  margin: 0 -1.2rem;
  border-radius: 1.2rem;
  text-decoration: none; }
  .ShelvingCard__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1.2rem;
    margin-left: 4.6rem; }
  .ShelvingCard:focus {
    box-shadow: 0 0 0 0.2rem var(--color-shadow-button-focus); }
  .ShelvingCard:hover {
    background-color: var(--color-background-transparent-hover);
    transition: transform 0.2s ease-out; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ReviewsList__listHeader {
  margin: 1.6rem 0; }

.ReviewsList__listContext {
  margin: 1.2rem 0; }
  .ReviewsList__listContext--centered {
    text-align: center; }

.ReviewsList a.ReviewsList__emptyCTA {
  text-decoration: underline; }

.ReviewsList__paginationExtraText {
  display: none; }
  @media only screen and (min-width: 20em) {
    .ReviewsList__paginationExtraText {
      display: inline; } }
  @media screen and (min-width: 320px) and (max-width: 420px) {
    .ReviewsList__paginationExtraText {
      display: none; } }
  @media screen and (min-width: 768px) and (max-width: 868px) {
    .ReviewsList__paginationExtraText {
      display: none; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 3.2rem; }
  .MyReviewCardCarousel__header {
    margin-bottom: 1.6rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 2.4rem 0.8rem 4rem 0.8rem;
  transform: translate3d(0, 0, 0);
  height: 100%; }
  .MyReviewCardSmall--no-footer {
    padding-bottom: 0.8rem; }
  .MyReviewCardSmall__ElevationCard {
    display: inline-block;
    width: 100%;
    height: 100%; }
  .MyReviewCardSmall__ElevationCardContent {
    overflow: hidden;
    position: relative;
    height: 100%;
    border-radius: 0.8rem;
    padding: 0 1.2rem;
    box-shadow: 0 0.2rem 0.8rem 0 rgba(0, 0, 0, 0.2);
    background-color: var(--color-background-body-base); }
  .MyReviewCardSmall__swooshSvg {
    transform: translate(-50%, -4rem);
    position: absolute;
    z-index: 0;
    top: -3.6rem;
    left: 50%;
    width: 100%;
    min-width: 40rem;
    height: 100%; }
  .MyReviewCardSmall__swooshPath {
    fill: #faf8f6; }
  .MyReviewCardSmall__book {
    display: flex;
    min-height: 9rem; }
  .MyReviewCardSmall__bookCoverColumn {
    width: 8rem;
    margin: 0 0.4rem; }
  .MyReviewCardSmall__bookInfo {
    display: flex;
    flex-direction: column;
    margin: 0 1.2rem; }
    .MyReviewCardSmall__bookInfo > span {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -moz-box-orient: vertical;
      -webkit-line-clamp: 1;
      overflow: hidden; }
  .MyReviewCardSmall__button {
    margin: 0.8rem 0; }
  .MyReviewCardSmall__content {
    height: 100%;
    position: relative;
    padding: 1.6rem 0 1.6rem 0; }
  .MyReviewCardSmall__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.2rem; }
  .MyReviewCardSmall__reviewArea {
    max-height: 7.5rem;
    overflow: hidden; }
  .MyReviewCardSmall__tags {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.2rem; }
  .MyReviewCardSmall__footer {
    position: absolute;
    bottom: 6.4rem;
    left: 0;
    width: 100%; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.WriteReviewCTA {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1.6rem 0; }
  .WriteReviewCTA .Avatar {
    margin-bottom: 1.6rem; }
  .WriteReviewCTA__reviewCTA {
    display: flex;
    align-items: center; }
    .WriteReviewCTA__reviewCTA .BookRatingStars {
      margin-right: 2.4rem; }
  .WriteReviewCTA--leftAligned {
    padding: 0;
    text-align: left;
    align-items: flex-start; }
  .WriteReviewCTA__message {
    font-family: Copernicus, "Libre Baskerville", Georgia, serif;
    text-align: center;
    font-size: 3.2rem;
    font-weight: 600; }
    @media only screen and (max-width: 39.9375em) {
      .WriteReviewCTA__message {
        font-size: 2.4rem; } }
    .WriteReviewCTA__message--leftAligned {
      text-align: left; }
  .WriteReviewCTA__hero {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: 1.2rem; }
    .WriteReviewCTA__hero--leftAligned {
      justify-content: flex-start; }
    .WriteReviewCTA__hero--overflow {
      justify-content: space-between;
      align-items: center; }
  @media only screen and (max-width: 47.9375em) {
    .WriteReviewCTA .BookRatingStars {
      margin-right: 1.6rem; } }
  @media only screen and (max-width: 39.9375em) {
    .WriteReviewCTA__reviewCTA {
      flex-direction: column;
      align-items: stretch; }
      .WriteReviewCTA__reviewCTA .BookRatingStars {
        margin-right: 0;
        margin-bottom: 1.6rem; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.MyReviewCard {
  position: relative;
  display: grid !important;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  grid-gap: 3.2rem !important; }
  @media only screen and (min-width: 40em) and (max-width: 47.9375em) {
    .MyReviewCard {
      grid-gap: 2.4rem !important; } }
  @media only screen and (max-width: 39.9375em) {
    .MyReviewCard {
      grid-gap: 1.6rem !important; } }
  @supports (display: -ms-grid) {
    .MyReviewCard {
      display: -ms-grid !important;
      -ms-grid-columns: 1fr [8]; } }
  .MyReviewCard__profile {
    grid-column: span 2; }
  .MyReviewCard .WriteReviewCTA {
    margin-bottom: 1.6rem; }
  .MyReviewCard__content {
    grid-column: span 6;
    padding-bottom: 1.6rem; }
  .MyReviewCard__bookCardContainer {
    grid-column: span 2;
    max-width: 12.4rem; }
  .MyReviewCard__bookCardMeta > span {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden; }
  @media only screen and (max-width: 47.9375em) {
    .MyReviewCard {
      grid-gap: 1.2rem !important; }
      .MyReviewCard__bookCardContainer {
        position: sticky;
        display: flex;
        max-width: 50%; }
      .MyReviewCard__bookCard {
        max-width: 6rem;
        margin-right: 1.2rem; }
      .MyReviewCard__bookCardContainer, .MyReviewCard__profile, .MyReviewCard__content {
        grid-column: span 8; } }
  .MyReviewCard__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.2rem; }
  .MyReviewCard__tags {
    padding-bottom: 1.6rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.CommunityShelvingSignalList {
  margin: 1.6rem 0; }
  .CommunityShelvingSignalList__header {
    margin-bottom: 1.6rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.RatingStatistics {
  border-radius: 0.8rem;
  display: inline-flex;
  padding: 0.8rem;
  margin: -0.8rem -0.8rem 0 -0.8rem; }
  .RatingStatistics__interactive {
    transition: all 0.2s ease-in-out;
    text-decoration: none; }
    .RatingStatistics__interactive:focus {
      box-shadow: 0 0 0 0.2rem var(--color-shadow-button-focus); }
    .RatingStatistics__interactive:hover {
      background-color: var(--color-background-transparent-hover); }
  .RatingStatistics__column {
    display: flex; }
  @media only screen and (max-width: 79.9375em) {
    .RatingStatistics {
      flex-direction: column; }
      .RatingStatistics__column {
        padding-bottom: 0.4rem; } }
  .RatingStatistics__centerAlign .RatingStatistics__column {
    justify-content: center; }
  .RatingStatistics__column {
    display: flex;
    align-items: center; }
  .RatingStatistics__rating {
    font-family: Copernicus, "Libre Baskerville", Georgia, serif;
    font-weight: 600;
    font-size: 2.6rem;
    margin: 0 1.2rem -1.2rem 1.2rem; }
  .RatingStatistics__meta {
    color: var(--color-text-subdued);
    font: 400 1.4rem/1.35714 "Proxima Nova", Montserrat, Arial, sans-serif;
    padding-top: 0.4rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ReviewsSectionStatistics {
  padding-bottom: 1.2rem; }
  .ReviewsSectionStatistics__histogram {
    width: 75%; }
    @media only screen and (max-width: 63.9375em) {
      .ReviewsSectionStatistics__histogram {
        width: 100%; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ReviewFiltersModal__header:not(:first-child) {
  margin-top: 1.2rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ReviewFilters {
  margin-bottom: 1.6rem; }
  .ReviewFilters__filterControl {
    display: flex;
    margin-bottom: 0.8rem;
    width: 75%; }
    @media only screen and (max-width: 63.9375em) {
      .ReviewFilters__filterControl {
        width: 100%; } }
  .ReviewFilters__filterButton {
    display: inline-block;
    margin-right: 0.8rem;
    margin-bottom: 0.8rem;
    max-width: 20rem; }
  .ReviewFilters__textSearch {
    flex: 1;
    margin-right: 1.2rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 1.6rem 0; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.Sticky {
  z-index: 1; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.BookPageTitleSection {
  -ms-grid-column: 1;
  -ms-grid-column-span: 8;
  grid-column: 1 / 9;
  display: flex;
  justify-content: space-between;
  align-items: flex-start; }
  .BookPageTitleSection > * {
    margin-top: 0.4rem; }
  .BookPageTitleSection__title {
    margin-right: 2.4rem; }
  .BookPageTitleSection__share {
    margin-left: 2.4rem; }
  @media only screen and (max-width: 47.9375em) {
    .BookPageTitleSection {
      justify-content: center;
      text-align: center; }
      .BookPageTitleSection__title {
        margin-right: 0; }
      .BookPageTitleSection__share {
        position: absolute;
        right: 0;
        top: 0;
        margin-left: 0; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 3.2rem; }
  .BookDiscussions__list {
    padding-top: 3.2rem;
    display: flex; }
    @media only screen and (max-width: 47.9375em) {
      .BookDiscussions__list {
        flex-direction: column; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 0.8rem;
  text-decoration: none;
  flex: 1;
  display: flex;
  margin-bottom: 2.4rem;
  padding: 1.2rem;
  align-items: center; }
  .DiscussionCard:hover .DiscussionCard__metaRow,
  .DiscussionCard:hover .DiscussionCard__stats {
    text-decoration: underline; }
  .DiscussionCard:focus {
    box-shadow: 0 0 0 0.2rem 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(3.6rem, 4vw, 6.4rem); }
  .DiscussionCard__icon {
    display: flex;
    flex-direction: column;
    width: clamp(6.4rem, 6vw, 12.8rem);
    height: clamp(6.4rem, 6vw, 12.8rem); }
    .DiscussionCard__icon svg {
      width: 100%;
      height: 100%; }
  .DiscussionCard__metaRow {
    word-break: break-all;
    margin-left: 0.4rem; }
  .DiscussionCard__middle {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding-left: clamp(1.2rem, 2vw, 6.4rem); }
  .DiscussionCard__rightIndicator {
    display: none;
    width: 2.4rem;
    height: 2.4rem;
    justify-self: flex-end;
    align-self: center; }
  .DiscussionCard__metaRow {
    flex: 1;
    display: inline-flex; }
  .DiscussionCard__metaIndicator {
    flex: 0 0 2.4rem;
    height: 2.4rem; }
  @media only screen and (max-width: 47.9375em) {
    .DiscussionCard__rightIndicator {
      display: block; }
    .DiscussionCard__metaIndicator {
      display: none; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.ContributorLinksList .ContributorLink {
  display: inline-flex; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 3.2rem; }
  .FeaturedDetails a {
    text-decoration: underline; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 3.2rem; }
  .EditionDetails .DescList {
    margin: 1.6rem 0; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 3.2rem; }
  .WorkDetails a {
    text-decoration: underline; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.MoreInformation {
  margin-bottom: 3.2rem; }
  .MoreInformation__statistics {
    margin: 1.6rem 0; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 1.2rem 0; }

.BookDetails__list {
  margin-bottom: 3.2rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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__signal {
  margin-right: 1.2rem;
  display: flex;
  align-items: center;
  flex: 1; }

.SocialSignalsSection__loading {
  width: 26.3rem;
  height: 4.6rem; }

@media only screen and (max-width: 79.9375em) {
  .SocialSignalsSection {
    display: flex;
    align-items: flex-end; }
    .SocialSignalsSection__container {
      display: block;
      margin: auto; }
    .SocialSignalsSection__caption {
      width: 20rem; }
    .SocialSignalsSection__signal {
      display: flex;
      justify-content: flex-end; }
      .SocialSignalsSection__signal:not(:last-child) {
        padding-bottom: 2.4rem; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.SocialSignalCard {
  border-radius: 1.2rem;
  display: inline-flex;
  align-items: center;
  text-align: left;
  min-height: 4.6rem;
  padding: 0.4rem;
  margin-left: -0.4rem; }
  .SocialSignalCard__interactive {
    transition: all 0.2s ease-in-out;
    text-decoration: none; }
    .SocialSignalCard__interactive:focus {
      box-shadow: 0 0 0 0.2rem var(--color-shadow-button-focus); }
    .SocialSignalCard__interactive:hover {
      background-color: var(--color-background-transparent-hover); }
  .SocialSignalCard__caption {
    font: 400 1.4rem/1.35714 "Proxima Nova", Montserrat, Arial, sans-serif;
    flex: 1;
    margin-left: 1.6rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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-right: 1.6rem;
  margin-bottom: 3.2rem; }
  .BookListItem__cover {
    flex-basis: 15rem;
    margin-right: 3.2rem; }
    @media only screen and (max-width: 47.9375em) {
      .BookListItem__cover {
        margin-right: 2.4rem;
        flex-basis: 8rem; } }
  .BookListItem__body {
    flex: 1; }
  .BookListItem__authors {
    padding: 0.4rem 0; }
  .BookListItem__beneathTitle {
    margin-bottom: 1.2rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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__book {
  max-width: 88rem; }

.NativeBookAd__header {
  margin-bottom: 1.6rem; }

.NativeBookAd__sponsored {
  margin-bottom: 0.8rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 0.8rem; }

.NativeFlexAd__header {
  margin-bottom: 2.4rem; }

.NativeFlexAd__bodyImage {
  margin-bottom: 1.6rem; }
  @media only screen and (min-width: 64em) {
    .NativeFlexAd__bodyImage {
      margin: 0 3.2rem 0 0; } }

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

.NativeFlexAd__container img {
  width: 100%; }
  @media only screen and (min-width: 64em) {
    .NativeFlexAd__container img {
      object-fit: contain;
      object-position: 0 0;
      max-width: 30rem;
      width: 30rem; } }

.NativeFlexAd__title {
  margin-bottom: 1.6rem; }
  @media only screen and (min-width: 64em) {
    .NativeFlexAd__title {
      margin-bottom: 0.8rem; }
      .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: 1.6rem; }

.NativeFlexAd__cta {
  max-width: 26rem;
  margin: auto; }
  @media only screen and (min-width: 64em) {
    .NativeFlexAd__cta {
      margin: initial; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 3.2rem; }
      @media only screen and (max-width: 39.9375em) {
        .Ad__topBanner iframe {
          margin-bottom: 2.4rem; } }
  .Ad__inlineAd, .Ad__nativeAd {
    padding: 4rem 0; }
  .Ad__bottomBanner iframe {
    margin: 4rem auto; }
    @media only screen and (max-width: 47.9375em) {
      .Ad__bottomBanner iframe {
        margin: 3.2rem auto; } }
  .Ad--showDividers {
    border-bottom: 0.1rem solid var(--color-background-divider);
    margin-top: -2.5rem;
    margin-bottom: 2.4rem; }
  @media only screen and (min-width: 40em) {
    .Ad--showDividers.Ad__inlineAd {
      border-top: 0.1rem solid var(--color-background-divider); } }
  .Ad--debug {
    display: block !important; }
    .Ad--debug > * {
      background-color: var(--color-background-alert-caution);
      display: block !important;
      height: 24rem !important;
      width: 24rem !important; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 1.2rem; }
  .LibrarianActionsWidget__editDetailsButton {
    padding-right: 1.2rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 63.9375em) {
    .BookPageMetadataSection {
      -ms-grid-column: 1;
      -ms-grid-column-span: 8;
      grid-column: 1 / 9; } }
  .BookPageMetadataSection__title {
    margin-bottom: 1.6rem; }
  .BookPageMetadataSection__ratingStats {
    margin-bottom: 1.6rem; }
    @media only screen and (max-width: 47.9375em) {
      .BookPageMetadataSection__ratingStats {
        display: flex;
        justify-content: center; } }
  .BookPageMetadataSection__contributor {
    margin: 1.2rem 0; }
    .BookPageMetadataSection__contributor > * {
      margin-top: 0.4rem; }
  .BookPageMetadataSection__genres {
    margin: 3.2rem 0; }
  .BookPageMetadataSection__genre {
    display: inline-block;
    padding-bottom: 0.8rem; }
  .BookPageMetadataSection__description {
    margin-bottom: 1.6rem;
    line-height: 1.37; }
  @media only screen and (max-width: 47.9375em) {
    .BookPageMetadataSection__contributor {
      text-align: center;
      margin-bottom: 1.2rem; } }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.PageSection__title {
  margin-bottom: 1.6rem; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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: 9rem; }

.FeaturedPerson__avatar, .FeaturedPerson__info {
  margin-right: 1.2rem; }

.FeaturedPerson__container {
  display: flex;
  flex: 1;
  flex-direction: column;
  overflow: hidden; }

.FeaturedPerson__info {
  display: flex;
  flex: 1;
  justify-content: space-between; }

.FeaturedPerson__profile {
  display: flex;
  overflow: hidden;
  align-items: center;
  margin-bottom: 1.2rem; }

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

.FeaturedPerson__infoPrimary {
  overflow: hidden;
  margin-right: 0.8rem; }

.FeaturedPerson__meta, .FeaturedPerson__name {
  flex-basis: auto;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.KNHButton__highlight {
  background-color: var(--color-background-knh-highlight-base);
  display: inline-block; }
  .KNHButton__highlight:hover {
    text-decoration: underline; }

/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 GMT
*/
/*
  Do not edit directly
  Generated on Thu, 09 Jun 2022 21:06:35 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.
*/
/*
  Function for converting px values to em based off of 1/16th for responsive utilities
  Used for "for" sass mixin. Using em instead of rem due to Safari bug, see::after
  https://medium.com/@barrypeng6/why-should-not-use-rem-unit-in-media-query-5645d0163ce5
*/
/**
	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 based off of 1/10th scale for easy math
  @deprecated: use postcss-pxtorem plugin
  References:
  https://npmpm.corp.amazon.com/pkg/postcss-pxtorem
  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.
 
*/
.FeaturedKNHCollectionCard {
  margin-bottom: 1.6rem; }