.alert{--color-alert-warning: #ffc;--color-alert-danger: #fcc;border:1px solid currentcolor;margin:1em 0;padding:.5em 1em}.alert--warning{background:var(--color-alert-warning)}.alert--error{background:var(--color-alert-danger)}.button{background:#6c757d;border:none;border-radius:.25em;color:var(--color-button-text);cursor:pointer;display:inline-block;font-size:16px;padding:.375em .75em}.button:hover,.button:focus{background:#5a6268}.button+.button{margin-left:1em}.button__icon{-webkit-background-clip:text;background-clip:text;background-color:var(--color-button-text);color:transparent;transform:scaleX(-1)}.button--sm{font-size:14px}.button--icon-only{border-radius:50%;font-size:12px;height:2.75em;padding:0;width:2.75em}.button--primary{background:#007bff;color:var(--color-button-text)}.button--primary:hover,.button--primary:focus{background:#0069d9}.header{align-items:center;display:flex;flex-direction:column;justify-content:space-between;margin-bottom:1rem}.header>*+*{margin-top:.5em}@media screen and (width >= 640px){.header{flex-direction:row}.header>*+*{margin-top:0}}.header__logo{font-weight:400;line-height:1;margin:0}@media screen and (width >= 768px){.header__logo{font-size:3em;font-weight:200}}@media screen and (width >= 1024px){.header__logo{font-size:4em;font-weight:100}}.header__logo a{color:inherit;color:#ff69b4;text-decoration:none}.footer{margin-top:1.5rem}.form{display:grid;grid-gap:1em;grid-template-columns:1fr;margin:1em auto}@media only screen and (width >= 640px){.form{grid-template-columns:1fr 1fr}}@media only screen and (width >= 640px){.form__group--doublewide{grid-column-end:span 2}}.form__control{background:var(--color-input-bg);border:1px solid var(--color-input-border);border-radius:.25em;color:currentcolor;display:block;font-size:16px;padding:.375em .75em;width:100%}select{font-size:16px}.form__group--check{align-items:center;display:flex}.form__checkbox-input{flex:none}.form__checkbox-label{flex:1;margin-left:.375em}.form__input-group{display:flex}.form__input-group .form__input-group-prepend,.form__input-group .form__input-group-append{background:var(--color-input-append-bg);border:1px solid var(--color-input-border);flex:none;padding:.375em .75em}.form__input-group .form__input-group-prepend{border-right:0}.form__input-group .form__input-group-append{border-left:0}.form__input-group .form__control{border-radius:0;flex:1}.form__input-group :first-child{border-bottom-left-radius:.25em;border-top-left-radius:.25em}.form__input-group :last-child{border-bottom-right-radius:.25em;border-top-right-radius:.25em}.tag-input{position:relative}.tag-input__tag-list{align-items:center;bottom:0;display:flex;left:12px;list-style:none;margin:0;max-width:75%;padding:0;position:absolute;top:0}.tag-input__tag{align-items:center;background:#6c757d;border-radius:4px;color:#fff;display:flex;flex-direction:row-reverse;font-size:.75rem;margin-right:12px;padding-block:.25em;padding-inline-end:.75em;transition:.1s ease background-color;white-space:nowrap}.tag-input__tag:hover,.tag-input__tag:focus{background:#5a6268}.tag-input__delete{align-self:stretch;background:none;border:0;cursor:pointer;font-size:smaller;padding-inline:.5em}.book-controls{align-items:center;display:flex;flex-direction:column;gap:1rem 2rem}@media screen and (width >= 640px){.book-controls{flex-direction:row}}.book-controls__add{display:flex;flex-wrap:wrap;gap:.5em 1em;justify-content:center}.book-controls__add .button{margin:0}@media screen and (width >= 640px){.book-controls__add{justify-content:start;margin-right:auto}}.book-controls__filter{position:relative}.filter-list{background:var(--color-book-bg);border-radius:3px;box-shadow:0 1px 3px #0000001f,0 1px 2px #0000003d;display:flex;flex-direction:column;gap:.5em;justify-content:center;list-style:none;margin:0;padding:0;padding:1rem;position:absolute;right:0;top:100%;z-index:2}@media screen and (width >= 640px){.filter-list{justify-content:start}}.filter-list[hidden]{display:none}.filter-list__item{align-items:center;display:flex;line-height:1;margin:0;padding:0}.filter-list__checkbox{margin-right:.33em}.filter-list__item--purchased label:before,.filter-list__item--prioritize label:before{background:gray;border-radius:50%;content:"";display:inline-block;height:.75em;margin-right:.33em;width:.75em}.filter-list__item--purchased label:before{background:#00800054}.filter-list__item--prioritize label:before{background:#ff000054}.sort__label{margin-right:.33em}.book{background:var(--color-book-bg);border-radius:3px;box-shadow:0 1px 3px #0000001f,0 1px 2px #0000003d;display:flex;margin:0;padding:1em;position:relative}.book>*+*{margin-left:1em}.book:before{background:var(--color-rating-bg);border-bottom-left-radius:4px;border-top-right-radius:4px;content:"";display:block;height:5.25rem;position:absolute;right:0;top:0;width:4.5rem}.book:after{border:10px solid transparent;border-top-left-radius:4px;content:"";height:0;left:0;position:absolute;top:0;width:0}.book--purchased:after{border-left-color:#00800054;border-top-color:#00800054}.book--prioritized:after{border-left-color:#ff000054;border-top-color:#ff000054}.book--prioritized.book--purchased:after{border-left-color:#00800054}.book__thumbnail{flex:none;max-width:25%;width:50px}@media screen and (width >= 640px){.book__thumbnail{width:100px}}.book__thumbnail-media{display:block;height:auto;width:100%}.book__info{flex:1}.book__info>:first-child{margin-top:0}.book__info>:last-child{margin-bottom:0}.book__headline{color:var(--color-headline-text);font-size:1.25em;font-weight:600;line-height:1.2;margin-bottom:.33em;margin-right:.5em}@media screen and (width >= 640px){.book__headline{font-size:1.5em}}.book__series{font-weight:300;opacity:.5}.book__author{line-height:1.2;margin-bottom:.33em;opacity:.7}.book__rating{font-size:2em;font-weight:200;line-height:1;opacity:.5;position:absolute;right:0;text-align:center;top:1rem;width:4.5rem}.book__length{line-height:1;opacity:.5;position:absolute;right:0;text-align:center;top:3.5rem;width:4.5rem}.book__tags{display:flex;flex-wrap:wrap;gap:.25em .5em;list-style:none;margin:.75em 0 0;padding:0}.book__tag{background:var(--color-rating-bg);border-radius:1em;display:inline-block;font-size:smaller;padding:.1em .5em;text-transform:lowercase;white-space:nowrap}.book__tag--unreleased{background:#ff000054}.book__details{margin-block:.75em}.book__details summary{cursor:pointer}.book__details>*{margin-block:0}.book__details>*+*{margin-block-start:.75em}.book__snippet{margin-block:0;overflow-wrap:break-word;word-wrap:break-word}.book__recommendation{background:var(--color-recommendation-bg);margin-inline:-.5em;opacity:.7;padding:.4em .75em}.book__note{font-style:italic;overflow-wrap:break-word;word-wrap:break-word}.book__date{font-size:smaller;line-height:1.2;opacity:.7}.book__actions{display:flex;flex:none;flex-direction:column;padding-top:4.75rem}.book__actions .button+.button{margin-left:0;margin-top:.5em}.book-list{display:grid;grid-gap:1em;grid-template-columns:1fr;list-style:none;margin:1em 0;padding:0}@media screen and (width >= 640px){.book-list{grid-template-columns:repeat(auto-fill,minmax(375px,1fr))}}:root{--color-page-bg: #fafafa;--color-text: #424242;--color-headline-text: #212121;--color-book-bg: #fff;--color-rating-bg: #fafafa;--color-recommendation-bg: #f5f5f5;--color-overlay-bg: rgba(255, 255, 255, .75);--color-modal-bg: #fff;--color-input-bg: #fff;--color-input-append-bg: #f5f5f5;--color-input-border: #e0e0e0;--color-button-text: #fff;--font-weight-default: 100;color-scheme:light dark}@media (prefers-color-scheme: dark){:root{--color-page-bg: #161616;--color-text: #bdbdbd;--color-headline-text: #e0e0e0;--color-book-bg: #212121;--color-rating-bg: #424242;--color-recommendation-bg: #424242;--color-overlay-bg: rgba(0, 0, 0, .75);--color-modal-bg: #212121;--color-input-bg: #212121;--color-input-append-bg: #424242;--color-input-border: #757575;--color-button-text: #fff;--font-weight-default: 300}}*{box-sizing:border-box}html{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:12px;font-weight:var(--font-weight-default);line-height:1.4}@media screen and (width >= 480px){html{font-size:14px}}body{background:var(--color-page-bg);color:var(--color-text);padding:1em}p{margin-top:0}blockquote{margin:0}.sr-only{border:0;clip:rect(0,0,0,0);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}