body{margin:16px}#root{width:100%;font-family:IBM Plex Sans,sans-serif;font-weight:400;font-style:normal}h1,h2,h3,h4,h5,h6{font-family:IBM Plex Sans,sans-serif;font-weight:300;font-style:normal;margin:0}button,input{font-family:IBM Plex Sans,sans-serif;font-weight:400;font-style:normal}a{position:relative;color:#000;text-decoration:none;transition:color 75ms}a:hover{color:#fff}a:after{position:absolute;content:"";background-color:#0f2fea;height:1px;bottom:0;left:-2px;right:-2px;z-index:-1;transition:height .15s}a:hover:after{height:100%}input{position:relative;font-size:16px;padding:16px;border-radius:0;background-color:#e7e7e7;border-left:1px solid #e7e7e7;border-right:1px solid #e7e7e7;border-top:1px solid #e7e7e7;border-bottom:2px solid #0f2fea;transition:background-color .15s}input:hover{background-color:#dfdfdf}input:focus{outline:none!important;border-color:#719ece;box-shadow:inset 0 0 0 2px #0f2fea}form{display:flex;flex-direction:row;flex-wrap:wrap;gap:16px;padding:16px}form .label-container{display:flex;gap:8px;flex:1;flex-wrap:wrap}form .button-container{display:flex;gap:8px;flex:1;justify-content:end}label{display:flex;flex-direction:column;gap:4px;flex:1;position:relative}label .meta{font-size:12px;position:absolute;right:0;top:0}button{border:none;color:#fff;background-color:#0f2fea;padding:16px 24px;font-size:16px;transition:background-color .2s,filter .3s,color .2s;cursor:pointer}button:hover{background-color:#091f9b}.icon-btn{line-height:0;padding:16px}.ghost-btn{background-color:#0000;color:#000}.ghost-btn:hover{color:#fff;background-color:#0f2fea}.danger-btn:hover{background-color:#ff1744}dialog{z-index:999;border:1px solid #c6c6c6;max-width:434px;animation:fade-in-and-move-up .3s forwards}.dialog-backdrop{background-color:#00000013;position:fixed;top:0;left:0;right:0;bottom:0;z-index:998;animation:fade-in .3s forwards}nav{position:fixed;display:flex;left:0;top:0;transition:left .35s;z-index:99}.container{display:flex;max-width:1636px;flex-direction:column;gap:64px;margin:auto}.app-title-container{display:flex;align-items:end;justify-content:space-between}.app-title-container a{margin-bottom:16px}.main-content{display:flex;flex-direction:column;animation:fade-in-and-move-up .3s forwards;gap:16px}.sidebar{position:fixed;background-color:#fff;width:300px;bottom:0;top:0;z-index:99;border-right:1px solid #e0e0e0;transition:left .35s;left:0;padding:16px;overflow:scroll}.scrim{position:fixed;top:0;left:0;bottom:0;right:0;background-color:#00000013;z-index:98;animation:fade-in .2s forwards}.sidebar-open{left:-333px}.nav-open{left:333px}.sidebar-btn{animation:expand-left-to-right .4s forwards}main{display:flex;flex-wrap:wrap;gap:16px}h1.title{font-size:4.5rem;margin:0;font-weight:300;animation:fade-in-and-move-up .2s forwards}.book{display:flex;flex-direction:column;gap:4px;border:1px solid black;width:256px;padding:16px 0;box-sizing:border-box;animation:fade-in-and-move-up .5s forwards;overflow:hidden}.book .top-container{display:flex;margin:0 16px;justify-content:space-between}.book .main-content{display:flex;flex-direction:column;gap:4px;align-items:start;margin:0 16px;font-size:14px}.book>img{width:224px;height:204px;margin:0 16px;border:1px solid rgba(0,0,0,.05)}.book .main-content p{margin:0;opacity:.5;width:100%}.book .main-content h2{margin:0;text-wrap:wrap;width:100%}.search-input-container{display:flex}.search-input{font-size:16px;width:100%;box-sizing:border-box;animation:expand-left-to-right .4s forwards;min-width:256px}.search-btn{z-index:1;opacity:0;animation:expand-left-to-right .4s .4s forwards}.filter-chips{margin-bottom:20px}.chips-container{display:flex;gap:8px;justify-content:space-between}.chip-title-container{display:flex;justify-content:space-between}.chip-title-container>*{animation:fade-in-and-move-up .3s forwards}.chips-container>*{flex:1}.selected-chips{display:flex;justify-content:flex-end;flex-wrap:wrap}.genre-chips,.author-chips{margin:16px 0}.chip{padding:8px 12px;margin:0 4px 4px 0;color:#000;font-size:11px;border:1px solid #e0e0e0;background-color:#00000005;border-radius:99px;cursor:pointer;transition:background-color .2s,color .2s,padding .15s,border .2s;position:relative}.chip:hover{background-color:#00000013;animation:mini-scale .2s forwards}.chip-selected{background-color:#0f2fea;border:1px solid #091f9b;color:#fff}.is-filter-only{animation:expand-right-to-left .4s forwards}.chip-selected:hover{background-color:#0d29cf}.filter-chip{padding-right:30px}.filter-chip:after{content:"";position:absolute;top:50%;transform:translateY(-50%);width:16px;height:16px;background-image:url(close.svg);background-size:contain;margin-left:4px}.books{display:flex;flex-wrap:wrap;gap:20px}.accordion{background-color:#fff;border:1px solid #e0e0e0;margin:16px 0;box-sizing:border-box}.accordion-top{padding:16px;width:100%;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:background-color .2s;box-sizing:border-box}.accordion-top:hover{background-color:#e0e0e0}.a .accordion-toggle{font-size:24px}.accordion-content{padding:0 16px}@media (max-width: 1862px){.container{margin-top:64px}}@media (max-width: 1636px){main{justify-content:center}.title{font-size:1.5rem}}@keyframes expand-right-to-left{0%{transform:translate(10px);transform-origin:right;opacity:0}to{transform:translate(0);opacity:1}}@keyframes expand-left-to-right{0%{transform:translate(-10px);transform-origin:right;opacity:0}to{transform:translate(0);opacity:1}}@keyframes fade-in-and-move-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes mini-scale{0%{transform:scale(1)}to{transform:scale(.99)}}.loader-container{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;justify-content:center;flex-direction:column;align-items:center;flex:1}.loader{width:150px;aspect-ratio:1;border-radius:50%;background:#ff1744;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);animation:l1 2.5s infinite cubic-bezier(.3,1,0,1)}@keyframes l1{33%{border-radius:0;background:#0f2fea;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}66%{border-radius:0;background:#ffc400;clip-path:polygon(50% 0,50% 0,100% 100%,0 100%)}}.suggest-book-container{display:flex;flex-direction:column;gap:16px}.suggest-btn{margin-left:auto}.submit-btn{margin:auto 0}.suggested{justify-content:space-between}.suggested .main-content{gap:16px;font-size:14px;justify-content:space-between;height:100%}