html,body,#root{width:100%;min-height:100%}html{height:100%}body{background:#f7efe4;margin:0;font-family:Inter,sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background:#f7efe4;font-family:Inter,sans-serif;overflow:hidden}.page-scroll{top:var(--topbar-height);scrollbar-width:thin;scrollbar-color:#722f37 transparent;position:fixed;bottom:0;left:0;right:0;overflow:hidden auto}.page-scroll::-webkit-scrollbar{width:8px}.page-scroll::-webkit-scrollbar-track{background:0 0}.page-scroll::-webkit-scrollbar-thumb{background:#722f37;border-radius:10px}.page-scroll::-webkit-scrollbar-thumb:hover{background:#5d252c}.container{min-height:calc(100vh - var(--topbar-height));justify-content:center;align-items:center;width:100%;padding:76px 40px 32px;display:flex}.layout{width:100%;transition:max-width .35s,grid-template-columns .35s,gap .35s}.layout-empty{justify-content:center;align-items:center;width:100%;max-width:380px;margin:auto;display:flex}.layout-content{grid-template-columns:300px minmax(0,1fr);align-items:start;gap:36px;width:100%;max-width:1500px;display:grid}.layout-content>.sidebar{align-self:start;margin-top:max(0px,50vh - 310px);margin-left:0;margin-right:0;transform:translateY(-100px)}.layout-content.layout-sidebar-collapsed{grid-template-columns:44px minmax(0,1fr);gap:24px}.layout-content.layout-sidebar-collapsed>.sidebar{margin-top:max(0px,50vh - 110px)}.book-area{justify-content:center;align-items:center;width:100%;min-width:0;min-height:600px;display:flex;position:relative;top:20px}.search-content{text-align:center;background:linear-gradient(#ffffff2e,#ffffff2e),#fdf8f1;border:1px solid #dfcdb8;width:100%;max-width:720px;padding:42px 50px 40px;animation:.45s scrapbook-search-entry;position:relative;top:-50px;overflow:visible;transform:rotate(-.35deg);box-shadow:0 18px 35px #52322714,5px 6px #722f3709}.search-content:before{content:"";pointer-events:none;border:1px dashed #8e675633;position:absolute;inset:10px}.search-content:after{content:"♡";color:#8e514e;font-family:Georgia,serif;font-size:17px;position:absolute;top:20px;right:24px;transform:rotate(12deg)}.search-content .search-tape{background:#722f372e;border:1px solid #722f3714;width:90px;height:23px;position:absolute;top:-11px;left:50%;transform:translate(-50%)rotate(-2deg)}.search-content h1{color:#722f37;margin-bottom:10px;font-family:Corinthia,cursive;font-size:3rem;font-weight:600;line-height:1;position:relative}.search-content h1:before{content:"A LITTLE BOOK SEARCH";color:#9b6f63;letter-spacing:2.4px;text-transform:uppercase;margin-bottom:12px;font-family:Inter,sans-serif;font-size:.58rem;font-weight:700;display:block}.search-content p{color:#722f37;max-width:500px;margin:0 auto 25px;font-size:.82rem;line-height:1.7}.search-content .search-decoration{justify-content:center;align-items:center;gap:9px;width:220px;margin:0 auto 25px;display:flex}.search-content .search-decoration div{border-top:1px dashed #d5c0aa;flex:1;height:1px}.search-content .search-decoration span{color:#8e514e;font-family:Georgia,serif;font-size:12px}.search-content input{color:#722f37;background:#fffdf9;border:1px solid #d8c1aa;border-radius:6px;outline:none;width:100%;margin-bottom:13px;padding:14px 17px;font-family:inherit;font-size:.84rem;transition:border-color .2s,box-shadow .2s,transform .2s;box-shadow:2px 3px #722f3709}.search-content input::placeholder{color:#b29a89}.search-content input:focus{border-color:#ae7c70;transform:rotate(-.15deg);box-shadow:0 0 0 3px #ae7c701a,2px 3px #722f3709}.search-input-wrapper{width:100%;position:relative}.search-input-wrapper input{margin-bottom:0}.suggestions-dropdown{z-index:20;text-align:left;background:#fffdf9;border:1px solid #d8c1aa;border-radius:8px;animation:.18s suggestions-fade;position:absolute;top:calc(100% + 7px);left:0;right:0;overflow:hidden;box-shadow:0 12px 25px #5232271f,3px 4px #722f370a}.suggestion-item{color:#722f37;text-align:left;cursor:pointer;width:100%;min-height:76px;box-shadow:none;background:0 0;border:none;border-bottom:1px solid #eadccd;border-radius:0;align-items:center;padding:9px 12px;transition:background .2s,transform .2s;display:flex}.suggestion-item:last-child{border-bottom:none}.suggestion-item:before,.suggestion-item:after{display:none}.suggestion-item:hover{box-shadow:none;background:#f8eee5;transform:none}.suggestion-cover{background:#f1e6da;border:1px solid #d9c3ac;flex-shrink:0;width:42px;height:58px;margin-right:12px;overflow:hidden;box-shadow:2px 3px #722f370f}.suggestion-cover img{object-fit:cover;width:100%;height:100%;display:block}.suggestion-cover-placeholder{color:#9b6f63;justify-content:center;align-items:center;width:100%;height:100%;font-size:1.1rem;display:flex}.suggestion-info{flex-direction:column;gap:3px;min-width:0;display:flex}.suggestion-info strong{color:#722f37;text-overflow:ellipsis;white-space:nowrap;font-family:Inter,sans-serif;font-size:.8rem;font-weight:700;line-height:1.35;display:block;overflow:hidden}.suggestion-subtitle{color:#94786b;text-overflow:ellipsis;white-space:nowrap;font-size:.68rem;line-height:1.35;display:block;overflow:hidden}.suggestion-meta{color:#aa8e7e;text-overflow:ellipsis;white-space:nowrap;font-size:.65rem;line-height:1.35;display:block;overflow:hidden}.suggestions-loading{color:#9b6f63;text-align:center;padding:15px;font-size:.72rem}@keyframes suggestions-fade{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.search-content>button{color:#fffaf8;letter-spacing:.2px;cursor:pointer;background:linear-gradient(135deg,#722f37,#93565b);border:none;border-radius:4px;justify-content:center;align-items:center;gap:10px;width:220px;margin:15px auto 0;padding:12px 18px;font-family:inherit;font-size:.76rem;font-weight:700;transition:transform .25s,box-shadow .25s;display:flex;box-shadow:0 9px 18px #722f372e,3px 4px #722f3717}.search-content>button:before,.search-content>button:after{content:"✦"}.search-content>button:hover{transform:translateY(-3px)rotate(-.5deg);box-shadow:0 13px 22px #722f373b,4px 5px #722f371a}.search-content .search-note{color:#a07567;margin-top:22px;font-family:Caveat,cursive;font-size:.9rem;display:block;transform:rotate(-2deg)}.loading-card{text-align:center;background:#fdf8f3;border:1px solid #e4d2bc;border-radius:20px;width:360px;padding:28px;animation:.25s scrapbook-fade;position:relative;top:-50px;box-shadow:0 14px 32px #00000014}.loading-icon{object-fit:contain;width:64px;height:64px;margin:0 auto 16px;animation:2.4s ease-in-out infinite hourglass-flip;display:block}.loading-card h3{color:#722f37;margin-bottom:8px}.loading-card p{color:#8a7367;line-height:1.6}.error-card{background:#f9efe8;border:1px solid #e4cbb9;border-radius:18px;align-items:flex-start;gap:16px;width:420px;padding:22px;animation:.25s scrapbook-fade;display:flex;box-shadow:0 10px 30px #00000014}.error-icon{color:#7b4d3f;font-size:2rem}.error-card h3{color:#7b4d3f;margin-bottom:8px}.error-card p{color:#6b5a4d;line-height:1.6}@media (width<=1000px){.container{padding:24px}.layout-content{grid-template-columns:240px minmax(0,1fr);gap:28px}.layout-content>.sidebar{margin-top:max(0px,50vh - 310px)}.layout-content.layout-sidebar-collapsed{grid-template-columns:44px minmax(0,1fr);gap:18px}.layout-content.layout-sidebar-collapsed>.sidebar{margin-top:max(0px,50vh - 350px)}.search-content{max-width:650px;padding:38px 35px}}@media (width<=750px){.container{padding:20px}.layout-content,.layout-content.layout-sidebar-collapsed{grid-template-columns:minmax(0,1fr);gap:20px}.layout-content>.sidebar,.layout-content.layout-sidebar-collapsed>.sidebar{margin-top:0}.book-area{min-height:auto}.search-content{padding:34px 25px}.search-content h1{font-size:2.65rem}.loading-card,.error-card{width:100%;max-width:420px}}@media (width<=500px){.search-content{padding:30px 18px}.search-content h1{font-size:2.35rem}.search-content .search-decoration{width:180px}.search-content>button{width:100%}}@keyframes scrapbook-fade{0%{opacity:0;transform:translateY(12px)rotate(.5deg)}to{opacity:1;transform:translateY(0)rotate(0)}}@keyframes hourglass-flip{0%{transform:rotate(0)}40%{transform:rotate(180deg)}55%{transform:rotate(180deg)}95%{transform:rotate(360deg)}to{transform:rotate(360deg)}}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-8px)}to{transform:translateY(0)}}@keyframes scrapbook-search-entry{0%{opacity:0;transform:translateY(10px)rotate(-.35deg)}to{opacity:1;transform:translateY(0)rotate(-.35deg)}}.sidebar{flex-direction:column;justify-content:center;width:100%;max-width:360px;min-height:600px;margin:auto;padding:20px;transition:max-width .35s,padding .35s,min-height .35s;display:flex;position:relative;overflow:visible}.layout-content>.sidebar:not(.sidebar-collapsed){box-sizing:border-box;background:#fdf8f36b;border-left:1px solid #722f3714;border-right:1px solid #722f3714;border-radius:28px;box-shadow:0 12px 30px #5232270b}.sidebar-collapsed{width:60px;max-width:60px;min-height:176px;box-shadow:none;background:0 0;border:none;border-radius:0;justify-content:center;align-items:center;padding:0}.sidebar-top{flex-direction:column;align-items:center;width:100%;margin-top:-60px;display:flex}.logo{align-self:center;width:200px;height:auto;margin-bottom:10px}.subtitle{text-align:center;color:#86675b;margin-bottom:10px;font-size:14px;line-height:1.6}.divider{background:#dbc9b7;width:100%;height:1px;margin:15px 0}.sidebar label{color:#6b4d43;margin-bottom:10px;font-size:18px;font-weight:700}.sidebar input{background:#fff;border:1px solid #d9c2aa;border-radius:14px;width:100%;margin-bottom:18px;padding:16px;font-size:17px}.sidebar-action{color:#722f372e;cursor:pointer;background:#722f37;border:none;border-radius:14px;width:100%;padding:16px;font-family:inherit;font-size:16px;font-weight:500;transition:background .2s,transform .2s,box-shadow .2s;box-shadow:0 10px 22px #722f372e}.sidebar-action:hover{background:#63272f;transform:translateY(-2px);box-shadow:0 13px 24px #722f373b}.sidebar-action.image-button{width:100%;box-shadow:none;cursor:pointer;background:0 0;border:none;border-radius:0;padding:0;line-height:1;transition:transform .2s;position:relative}.sidebar-action.image-button img{width:90%;height:auto;margin:0 auto;display:block}.sidebar-action.image-button span{box-sizing:border-box;color:#e5d6d0;text-align:center;white-space:nowrap;pointer-events:none;justify-content:center;align-items:center;width:90%;padding:0 18%;font-family:Arial,sans-serif;font-size:19px;font-weight:600;line-height:1;display:flex;position:absolute;top:50%;left:5%;transform:translateY(-50%)}.sidebar-action.image-button:hover{box-shadow:none;background:0 0;transform:translateY(-2px)}.sidebar-toggle{color:#722f37;cursor:pointer;z-index:20;background:#fdf8f3fa;border:1px solid #722f372e;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;padding:0;font-size:18px;font-weight:500;line-height:1;transition:background .2s,color .2s,transform .2s,box-shadow .2s;display:flex;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 5px 14px #5232271f}.sidebar-toggle-open{color:#722f37;width:100%;height:34px;box-shadow:none;cursor:pointer;background:0 0;border:none;border-bottom:1px solid #722f371c;border-radius:0;align-self:stretch;margin:0 0 14px;padding:0;font-family:inherit;font-size:18px;font-weight:500;line-height:1;position:relative;top:auto;right:auto;transform:none}.sidebar-toggle-collapsed{margin-left:-17px;left:50%}.sidebar-toggle-open:hover{color:#63272f;box-shadow:none;background:#722f3709;transform:none}.sidebar-toggle:hover{color:#5f262d;background:#efe3d2;transform:translateY(-50%)scale(1.06);box-shadow:0 7px 18px #52322729}.sidebar-collapsed .sidebar-rail{box-sizing:border-box;background:#fdf8f3f7;border:1px solid #722f371f;border-radius:22px;flex-direction:column;align-items:center;gap:15px;width:60px;min-height:200px;padding:9px 6px;display:flex;overflow:hidden;box-shadow:0 12px 28px #5232271a,inset 0 1px #ffffffa6}.sidebar-rail-toggle,.sidebar-rail-action{color:#722f37;cursor:pointer;background:0 0;border:none;border-radius:50%;flex:none;justify-content:center;align-items:center;width:40px;height:40px;padding:0;transition:background .2s,transform .2s,box-shadow .2s;display:flex}.sidebar-rail-toggle{font-family:Arial,sans-serif;font-size:22px;font-weight:400;line-height:1}.sidebar-rail-logo{object-fit:contain;flex:none;width:38px;height:38px;margin:4px 0;display:block}.sidebar-rail-action img{object-fit:contain;width:38px;height:36px;margin:4px 0;display:block}.sidebar-rail-toggle:hover,.sidebar-rail-action:hover{background:#f2e4d8;transform:scale(1.08);box-shadow:0 4px 10px #722f371a}.sidebar-rail-toggle:focus-visible,.sidebar-rail-action:focus-visible,.sidebar-toggle:focus-visible,.sidebar-action:focus-visible{outline-offset:2px;outline:2px solid #722f3773}.sidebar-rail-divider{background:#722f371f;flex:none;width:20px;height:1px;margin:0}.quote{text-align:center;color:#9d7b6f;font-size:13px;font-style:italic;line-height:1.8}:root{--topbar-height:30px}.topbar{width:100%;height:var(--topbar-height);z-index:100;background:#722f37;justify-content:flex-end;align-items:center;padding:0 40px;display:flex;position:fixed;top:0;left:0;right:0}.topbar-login{color:#f7efe4;text-underline-offset:4px;cursor:pointer;background:0 0;border:none;padding:0;font-family:Inter,sans-serif;font-size:.76rem;font-weight:600;text-decoration:underline;text-decoration-thickness:1px;transition:color .2s,transform .2s}.topbar-login:hover{color:#ead8c5;transform:translateY(0)}.topbar-user{align-items:center;gap:8px;display:flex}.topbar-greeting{color:#f7efe4;font-family:Inter,sans-serif;font-size:.76rem;font-weight:600}.topbar-logout{cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:15px;height:30px;padding:0;display:flex}.topbar-logout img{object-fit:contain;width:28px;height:28px;display:block}.topbar-logout:hover{opacity:.75}@media (width<=750px){:root{--topbar-height:42px}.topbar{height:var(--topbar-height);padding:0 20px}.topbar-login,.topbar-greeting{font-size:.72rem}.topbar-user{gap:7px}.topbar-logout{width:19px;height:19px}.topbar-logout img{width:14px;height:14px}}.book-container{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;transform:translateY(-60px)}.book-image{-webkit-user-select:none;user-select:none;pointer-events:none;width:900px;max-width:90%;height:auto;margin-top:0;display:block}.book-overlay{aspect-ratio:2048/1365;grid-template-columns:1fr 1fr;column-gap:58px;width:820px;padding:58px 78px 48px;display:grid;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}.left-page{transform:translate(-25px)}.right-page{width:100%;min-width:0;height:100%;display:flex;transform:translate(30px)}.page-content{flex-direction:column;width:100%;min-width:0;height:100%;display:flex}.book-header{align-items:center;gap:22px;margin-top:18px;margin-bottom:15px;display:flex}.book-cover{border-radius:8px;flex-shrink:0;width:95px;transform:rotate(-1deg);box-shadow:0 10px 18px #442b2029,3px 4px #ffffffa6}.book-info{flex:1;min-width:0}.book-title{color:#392b22;margin:0 0 14px;font-family:Georgia,Times New Roman,serif;font-size:1rem;font-weight:700;line-height:1.15}.book-author{color:#6e5a4d;margin:0 0 18px;font-family:Arial,sans-serif;font-size:1rem}.book-rating{color:#9a6b2f;margin:0;font-family:Arial,sans-serif;font-size:1rem;font-weight:600}.book-divider{opacity:.9;background:#d8c7b6;width:100%;height:1px;margin-top:0;margin-bottom:10px}.book-metadata{flex-direction:column;gap:18px;display:flex}.metadata-row{border-bottom:1px dashed #d8c7b68c;grid-template-columns:120px 1fr;align-items:start;column-gap:10px;padding-bottom:2px;display:grid}.metadata-row:last-child{border-bottom:none}.metadata-label{text-transform:uppercase;letter-spacing:2px;color:#9b8779;font-family:Arial,sans-serif;font-size:.6rem;font-weight:600}.metadata-value{color:#43352c;overflow-wrap:anywhere;font-family:Arial,sans-serif;font-size:.7rem;line-height:1.5}.right-content{flex-direction:column;width:100%;min-width:0;height:90%;margin-top:25px;display:flex;position:relative}.book-doodle{pointer-events:none;-webkit-user-select:none;user-select:none;color:#8e514e;opacity:.9;position:absolute}.book-doodle-star{font-size:.9rem;top:10px;right:2px;transform:rotate(8deg)}.book-doodle-heart{font-size:1rem;top:22px;left:-6px;transform:rotate(-8deg)}.book-paper-label{letter-spacing:2px;color:#8e5c52;background:#efe2d2c7;border:1px solid #d3c0abb8;align-self:center;margin-top:15px;margin-bottom:5px;padding:6px 13px;font-family:Arial,sans-serif;font-size:.54rem;font-weight:700;display:inline-block;transform:rotate(1deg);box-shadow:0 2px 5px #4a2d230d}.summary-heading{justify-content:center;align-items:center;gap:8px;margin-top:2px;margin-bottom:6px;display:flex}.summary-heading-icon{color:#9b6e61;font-size:.68rem}.summary-title{text-align:center;color:#722f37;margin:0;font-family:Corinthia,cursive;font-size:1.25rem;font-weight:600;line-height:1}.summary-decoration{justify-content:center;align-items:center;gap:8px;margin:2px 0 12px;display:flex}.summary-decoration span{color:#8e514e;width:8px;height:8px;font-size:.65rem;display:block}.summary-decoration span:first-child,.summary-decoration span:nth-child(3){background:#ddc9b6;width:28px;height:1px}.summary-box{flex:none;width:100%;display:flex;position:relative;overflow:visible}.summary-note{background:linear-gradient(#fffaf3e0,#faf2e7e0);border:1px solid #dfcdb8;width:100%;padding:19px 18px 16px;position:relative;transform:rotate(.15deg);box-shadow:0 4px 8px #4c32250f}.note-tape{pointer-events:none;background:#c1999147;width:70px;height:17px;position:absolute;top:-9px;left:50%;transform:translate(-50%)rotate(-1deg)}.summary-text{color:#5b4a3d;text-align:justify;white-space:pre-wrap;overflow-wrap:anywhere;margin:0;font-family:Georgia,Times New Roman,serif;font-size:.87rem;line-height:1.8}.summary-text.dropcap:first-letter{float:left;color:#722f37;margin-top:2px;margin-right:5px;font-family:Cormorant Garamond,Georgia,serif;font-size:2.4rem;font-weight:700;line-height:.8}.note-mark{color:#9b6e61;opacity:.8;font-size:.8rem;position:absolute;bottom:7px;right:12px}.book-categories-section{flex-shrink:0;margin-top:20px}.book-mini-divider{justify-content:center;align-items:center;gap:7px;margin-bottom:7px;display:flex}.book-mini-divider div{background:#ddc9b6;width:35px;height:1px}.book-mini-divider span{color:#a26f61;font-size:.58rem}.section-title{text-align:center;color:#722f37;margin:0 0 7px;font-family:Georgia,Times New Roman,serif;font-size:1rem;font-weight:600}.categories{flex-wrap:wrap;justify-content:center;align-items:center;gap:7px;margin-bottom:8px;display:flex}.category{color:#722f37;background:#efe3d2;border:1px solid #e4d2bc;border-radius:999px;justify-content:center;align-items:center;padding:5px 11px;font-family:Arial,sans-serif;font-size:.68rem;font-weight:500;display:inline-flex}.preview-link{color:#8b5a4b;align-self:center;align-items:center;gap:7px;margin-top:auto;padding-top:4px;font-family:Georgia,Times New Roman,serif;font-size:.84rem;font-weight:600;text-decoration:underline;transition:color .2s,transform .2s;display:inline-flex}.preview-link:hover{color:#6d4438;transform:translateY(-2px)}.book-handwritten-note{color:#9b6e61;align-self:flex-end;margin-top:10px;margin-right:6px;font-family:Comic Sans MS,Segoe Print,cursive;font-size:.68rem;transform:rotate(-2deg)}@media (width<=1200px){.book-image{width:820px}.book-overlay{width:750px}}@media (width<=900px){.book-container{transform:translateY(-20px)}.book-image{width:720px}.book-overlay{column-gap:45px;width:660px;padding:50px 62px 40px}.book-cover{width:80px}.book-title{font-size:1.1rem}.book-author{font-size:.95rem}.metadata-row{grid-template-columns:95px 1fr}.metadata-label{font-size:.72rem}.metadata-value{font-size:.9rem}.summary-text{font-size:.78rem}}@media (width<=720px){.book-container{height:auto;transform:none}.book-image{display:none}.book-overlay{aspect-ratio:auto;grid-template-columns:1fr;row-gap:35px;width:100%;padding:30px 24px;position:relative;top:auto;left:auto;transform:none}.left-page,.right-page{height:auto}.book-header{margin-top:0}.summary-box{flex:none}.book-dna{position:relative;top:auto;left:auto;transform:none}}.summary-unavailable{text-align:center;color:#722f37;max-width:290px;margin:0 auto;padding:28px 20px;font-family:Georgia,Times New Roman,serif;font-size:.92rem;line-height:1.65}.summary-unavailable:before{content:"✦";color:#a26f61;margin-bottom:10px;font-size:.8rem;display:block}.summary-unavailable:after{content:"♡";color:#a26f61;margin-top:10px;font-size:.85rem;display:block}.book-dna{border-top:1px solid #dfcdb8;width:100%;margin-top:12px;padding-top:8px;position:relative}.book-dna-title{justify-content:center;align-items:center;gap:6px;margin-bottom:7px;display:flex}.dna-title-icon{object-fit:contain;width:16px;height:16px}.book-dna-title h3{letter-spacing:1.8px;color:#722f37;margin:0;font-family:Georgia,Times New Roman,serif;font-size:.68rem;font-weight:700}.dna-row{width:100%}.dna-main-row{grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:5px;display:grid}.dna-main-category{background:#fdf8f1b8;border:1px solid #dfcdb8;border-radius:5px;flex-direction:column;align-items:center;min-width:0;padding:5px 3px 4px;display:flex;box-shadow:0 2px 4px #49332b0a}.dna-main-category .dna-category-icon{object-fit:contain;width:24px;height:24px;margin-bottom:2px}.dna-main-category span{text-overflow:ellipsis;text-align:center;color:#665148;width:100%;font-family:Arial,sans-serif;font-size:.48rem;font-weight:600;line-height:1.05;display:block;overflow:hidden}.dna-main-category strong{color:#722f37;margin-top:2px;font-family:Georgia,Times New Roman,serif;font-size:.58rem}.dna-secondary-row{grid-template-columns:repeat(4,1fr);gap:3px;display:grid}.dna-secondary-category{flex-direction:column;align-items:center;min-width:0;padding:3px 2px;display:flex}.dna-secondary-category .dna-category-icon{object-fit:contain;width:17px;height:17px;margin-bottom:1px}.dna-secondary-category span{text-overflow:ellipsis;text-align:center;color:#77645a;width:100%;font-family:Arial,sans-serif;font-size:.6rem;font-weight:500;line-height:1;display:block;overflow:hidden}.dna-secondary-category strong{color:#8e514e;margin-top:1px;font-family:Arial,sans-serif;font-size:.6rem;font-weight:700}.book-dna:before{content:"✦";color:#9a6b61;font-size:.48rem;position:absolute;top:5px;left:2px;transform:rotate(-15deg)}.book-dna:after{content:"♡";color:#9a6b61;font-size:.55rem;position:absolute;top:10px;right:2px;transform:rotate(10deg)}@media (width<=900px){.dna-main-row{gap:4px}.dna-secondary-row{grid-template-columns:repeat(2,1fr)}}@media (width<=720px){.dna-main-row{grid-template-columns:repeat(3,1fr)}.dna-secondary-row{grid-template-columns:repeat(2,1fr)}}.recommendations-page{color:#4d3930;width:100%;max-width:1000px;margin-top:-90px;padding:22px 24px 45px;animation:.45s ease-out scrapbook-entry;position:relative}.scrapbook-doodle{pointer-events:none;color:#722f37;z-index:1;-webkit-user-select:none;user-select:none;position:absolute}.doodle-star{font-size:24px;top:20px;left:15px;transform:rotate(-12deg)}.doodle-heart{font-size:20px;top:78px;right:12px;transform:rotate(12deg)}.doodle-flower{color:#9c655b;font-size:22px;bottom:95px;left:5px;transform:rotate(-10deg)}.doodle-star-small{color:#b18468;font-size:17px;bottom:28px;right:25px;transform:rotate(18deg)}.scrapbook-tape{pointer-events:none;z-index:5;opacity:.9;background:#722f372b;border:1px solid #722f3714;width:95px;height:20px;position:absolute}.tape-top{top:112px;left:-4px;transform:rotate(-6deg)}.tape-bottom{background:#b7876f38;bottom:240px;right:-2px;transform:rotate(7deg)}.recommendations-header{text-align:center;z-index:2;margin-bottom:22px;position:relative}.scrapbook-label{color:#86675b;letter-spacing:2px;text-transform:uppercase;background:#efe3d2;border:1px solid #dfccb5;margin-bottom:8px;padding:5px 12px;font-size:.58rem;font-weight:700;display:inline-block;transform:rotate(-1.5deg);box-shadow:2px 3px #722f370f}.recommendations-eyebrow{color:#9b6f63;letter-spacing:2.7px;text-transform:uppercase;margin:0 0 5px;font-size:.62rem;font-weight:700}.recommendations-header h1{color:#722f37;margin:0 0 11px;font-family:Corinthia,cursive;font-size:2.8rem;font-weight:600;line-height:1;position:relative}.recommendations-header h1:after{content:"♡";color:#9d6a61;margin-left:8px;font-family:Georgia,serif;font-size:.85rem;position:absolute;top:-4px;transform:rotate(12deg)}.header-paper-line{justify-content:center;align-items:center;gap:10px;width:220px;margin:0 auto 9px;display:flex}.header-paper-line span:not(:nth-child(2)){background:#d8c4b0;flex:1;height:1px}.header-paper-line span:nth-child(2){color:#8e514e;font-size:13px}.recommendations-description{color:#7b665a;max-width:600px;margin:0 auto;font-size:.8rem;line-height:1.55}.recommendations-form{z-index:2;background:linear-gradient(#ffffff2e,#ffffff2e),#fdf8f1;border:1px solid #dfcdb8;width:100%;padding:24px 30px 22px;position:relative;transform:rotate(-.15deg);box-shadow:0 14px 28px #52322712,4px 5px #722f3708}.recommendations-form:before{content:"";pointer-events:none;border:1px dashed #8e67562e;position:absolute;inset:8px}.paper-corner{pointer-events:none;width:40px;height:40px;position:absolute}.paper-corner-top{border-top:2px solid #722f371f;border-right:2px solid #722f371f;top:0;right:0;transform:translate(4px,-4px)rotate(5deg)}.paper-corner-bottom{border-bottom:2px solid #722f371a;border-left:2px solid #722f371a;bottom:0;left:0;transform:translate(-4px,4px)rotate(5deg)}.recommendation-section{margin-bottom:18px;position:relative}.section-heading{align-items:flex-start;gap:10px;margin-bottom:10px;display:flex}.section-icon{color:#722f37;flex-shrink:0;justify-content:center;align-items:center;width:27px;height:27px;font-size:16px;display:flex;transform:rotate(-7deg)}.recommendation-section h2{color:#5f3a32;margin:0 0 2px;font-family:Georgia,serif;font-size:.92rem;font-weight:700}.recommendation-section p{color:#927c6d;margin:0;font-size:.68rem;line-height:1.4}.option-grid{flex-wrap:wrap;gap:7px;display:flex}.option-button{color:#74483f;cursor:pointer;background:#f4eadc;border:1px solid #ddc9b4;border-radius:5px;min-height:34px;padding:7px 12px;font-family:inherit;font-size:.68rem;font-weight:500;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s;position:relative;box-shadow:2px 3px #722f370a}.option-button:nth-child(odd){transform:rotate(-.5deg)}.option-button:nth-child(2n){transform:rotate(.5deg)}.option-button:hover{border-color:#c7a694;transform:translateY(-2px)rotate(0);box-shadow:3px 5px 9px #51342912}.option-button.selected{color:#fffaf7;background:#722f37;border-color:#722f37;transform:rotate(-.7deg)translateY(-1px);box-shadow:3px 4px #722f371f}.button-mark{margin-left:6px;font-size:.65rem}.handwritten-divider{color:#9b6c61;opacity:.8;align-items:center;gap:7px;width:90%;margin:18px auto;display:flex}.handwritten-divider div{border-top:1px dashed #d6c0aa;flex:1;height:1px}.handwritten-divider span{font-family:Georgia,serif;font-size:9px}.preference-columns{grid-template-columns:1fr 1fr;gap:25px;margin-top:2px;display:grid}.recommendation-error{background:#f9eee7;border:1px solid #dec5b5;align-items:center;gap:8px;width:100%;margin:2px 0 12px;padding:9px 12px;display:flex;transform:rotate(.15deg);color:#7b4d3f!important;font-size:.7rem!important;line-height:1.3!important}.recommendation-error span{color:#8b4c4c}.recommendation-submit{color:#fffaf8;letter-spacing:.2px;cursor:pointer;background:linear-gradient(135deg,#722f37,#93565b);border:none;border-radius:4px;justify-content:center;align-items:center;gap:11px;width:225px;margin:5px auto 0;padding:11px 19px;font-family:inherit;font-size:.75rem;font-weight:700;transition:transform .25s,box-shadow .25s;display:flex;box-shadow:0 8px 17px #722f372e,3px 4px #722f3717}.recommendation-submit:hover:not(:disabled){transform:translateY(-2px)rotate(-.4deg);box-shadow:0 11px 21px #722f3738,3px 4px #722f371a}.recommendation-submit:disabled{cursor:wait;opacity:.65}.recommendation-results{z-index:2;margin-top:42px;position:relative}.results-header{text-align:center;margin-bottom:20px;position:relative}.results-header .scrapbook-label{transform:rotate(1deg)}.results-header h2{color:#5f3a32;margin:3px 0 9px;font-family:Corinthia,cursive;font-size:2rem;font-weight:600}.results-decoration{justify-content:center;align-items:center;gap:7px;width:230px;margin:0 auto;display:flex}.results-decoration div{background:#d7c2ad;flex:1;height:1px}.results-decoration span{color:#8c5854;font-size:10px}.recommendation-cards{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:20px;display:grid}.recommendation-card{cursor:pointer;background:#fdf8f2;border:1px solid #dfcdb8;flex-direction:column;min-width:0;padding:22px 15px 17px;transition:transform .25s,box-shadow .25s;display:flex;position:relative;box-shadow:0 11px 22px #4b2e2412,3px 4px #722f3708}.recommendation-card:first-child{transform:rotate(-1.2deg)}.recommendation-card:nth-child(2){margin-top:10px;transform:rotate(.8deg)}.recommendation-card:nth-child(3){transform:rotate(-.5deg)}.recommendation-card:hover{z-index:10;transform:translateY(-5px)rotate(0);box-shadow:0 16px 28px #4b2e241f}.card-tape{z-index:5;background:#722f372e;border:1px solid #722f3712;width:72px;height:21px;position:absolute;top:-10px;left:50%;transform:translate(-50%)rotate(-2deg)}.card-sticker{color:#722f37;z-index:6;background:#efe2d1;border:1px solid #dfc9b2;border-radius:50%;justify-content:center;align-items:center;width:27px;height:27px;font-family:Georgia,serif;font-size:13px;display:flex;position:absolute;top:9px;right:9px;transform:rotate(9deg)}.cover-frame{background:#f3e8da;border:1px solid #dfcbb6;justify-content:center;align-items:center;height:265px;margin:7px 4px 17px;padding:14px;display:flex;position:relative;transform:rotate(-.5deg);box-shadow:inset 0 0 0 4px #ffffff47}.recommendation-card:nth-child(2) .cover-frame{transform:rotate(.6deg)}.recommendation-card:nth-child(3) .cover-frame{transform:rotate(-.25deg)}.recommendation-cover{object-fit:contain;filter:drop-shadow(0 7px 8px #2c1c162b);width:100%;height:100%;display:block}.recommendation-card-content{flex-direction:column;flex:1;display:flex}.compatibility-score{color:#722f37;background:#eadccc;border:1px solid #ddc5ad;align-self:flex-start;align-items:center;gap:4px;margin-bottom:8px;padding:5px 9px;font-size:.62rem;font-weight:700;display:inline-flex;transform:rotate(-.7deg)}.recommendation-card h3{color:#49332b;margin:0 0 4px;padding-right:20px;font-family:Georgia,serif;font-size:.98rem;font-weight:600;line-height:1.25}.recommendation-author{color:#8d7567;margin:0 0 12px;font-size:.68rem}.reason-note{background:#f4eadc;border:1px solid #e0ccb6;margin-top:auto;padding:12px 11px 11px;position:relative;transform:rotate(.35deg);box-shadow:2px 3px #722f3708}.reason-note:before{content:"";border-top:1px solid #c8aa95;border-right:1px solid #c8aa95;width:8px;height:8px;position:absolute;top:7px;right:7px}.reason-label{color:#a07567;letter-spacing:1.7px;margin-bottom:5px;font-size:.52rem;font-weight:700;display:block}.recommendation-reason{color:#665146;margin:0;font-size:.68rem;line-height:1.55}.card-bottom-mark{color:#9a7466;text-align:right;margin-top:8px;font-family:Caveat,cursive;font-size:.76rem;display:block;transform:rotate(-2deg)}@media (width<=1050px){.recommendations-page{padding-left:18px;padding-right:18px}.recommendation-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.recommendation-card:nth-child(3){grid-column:1/-1;width:min(100%,370px);margin:12px auto 0}}@media (width<=820px){.recommendations-form{padding:22px 22px 20px}.preference-columns{grid-template-columns:1fr;gap:4px}.recommendations-header h1{font-size:2.55rem}}@media (width<=620px){.recommendations-page{padding:18px 10px 38px}.recommendations-header h1{font-size:2.3rem}.recommendations-form{padding:20px 16px 18px}.recommendation-cards{grid-template-columns:1fr}.recommendation-card:nth-child(2),.recommendation-card:nth-child(3){margin-top:0}.recommendation-card:nth-child(3){grid-column:auto;width:100%}.cover-frame{height:280px}.recommendation-submit{width:100%}.doodle-star,.doodle-heart,.doodle-flower,.doodle-star-small,.scrapbook-tape{display:none}}@keyframes scrapbook-entry{0%{opacity:0;transform:translateY(20px)rotate(.35deg)}to{opacity:1;transform:translateY(0)rotate(0)}}.login-page{flex-direction:column;align-items:center;min-height:90vh;padding:75px 24px 40px;display:flex}.login-intro{z-index:2;text-align:center;width:min(560px,92vw);margin-bottom:-50px;animation:.5s login-intro-entry;position:relative}.login-eyebrow{color:#9b6f63;letter-spacing:1.8px;text-transform:uppercase;margin:-25px 0 4px;font-family:Inter,sans-serif;font-size:.6rem;font-weight:700}.login-intro h1{color:#722f37;margin:5px 0 0;font-family:Corinthia,cursive;font-size:clamp(2rem,2.75vw,3rem);font-weight:550;line-height:1}.login-subtitle{color:#80665a;margin:10px 0 0;font-family:Inter,sans-serif;font-size:.8rem;line-height:1.45}.login-composition{aspect-ratio:435/404;width:min(500px,80vw);margin-top:50px;animation:.5s login-paper-entry;position:relative}.login-paper{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;inset:0}.login-content{text-align:center;flex-direction:column;align-items:center;width:67%;height:48%;animation:.45s 80ms both login-content-entry;display:flex;position:absolute;top:35%;left:19.5%}.login-form{text-align:left;flex-direction:column;width:76%;display:flex}.login-form label{color:#722f37;letter-spacing:1.5px;margin-bottom:5px;font-family:Inter,sans-serif;font-size:.6rem;font-weight:700}.login-form input{color:#5d4038;background:#fffdf9cc;border:1px solid #cdb6a1;border-radius:18px;outline:none;width:100%;height:30px;margin-bottom:11px;padding:0 14px;font-family:Inter,sans-serif;font-size:.66rem;transition:border-color .2s,box-shadow .2s;box-shadow:0 2px 7px #5232270d}.login-form input::placeholder{color:#b59d8d}.login-form input:focus{border-color:#a46e70;box-shadow:0 0 0 3px #722f3714}.login-form button{color:#fffaf7;cursor:pointer;background:#722f37;border:none;border-radius:5px;align-self:center;width:50%;margin-top:3px;padding:8px 14px;font-family:Inter,sans-serif;font-size:.66rem;font-weight:700;transition:background .2s,transform .2s;box-shadow:0 6px 12px #722f3729}.login-form button:hover:not(:disabled){background:#63272f;transform:translateY(-1px)}.login-form button:disabled{opacity:.6;cursor:wait}.login-error{color:#9a4d48;text-align:center;margin:-2px 0 8px;font-size:.6rem;line-height:1.35}.login-success{color:#6c7652;text-align:center;margin:-2px 0 8px;font-size:.55rem;line-height:1.35}.login-register{color:#8a7063;text-align:center;margin-top:9px;font-family:Inter,sans-serif;font-size:.7rem}.login-register button{color:#722f37;font:inherit;text-underline-offset:2px;cursor:pointer;background:0 0;border:none;padding:0;font-weight:700;text-decoration:underline}.signup-composition{aspect-ratio:1;width:min(500px,100vw);height:min(550px,100vw);margin-top:50px}.signup-content{width:60%;height:70%;top:28%;left:26%}.signup-form{width:88%}.signup-form label{margin-bottom:4px;font-size:.54rem}.signup-form input{height:28px;margin-bottom:7px;font-size:.62rem}.signup-form button{width:55%;margin-top:10px;padding:8px 14px;font-size:.6rem}.signup-form+.login-register{margin-top:15px}@keyframes login-intro-entry{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes login-paper-entry{0%{opacity:0;transform:translateY(12px)rotate(-1deg)}to{opacity:1;transform:translateY(0)rotate(0)}}@keyframes login-content-entry{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}@media (width<=500px){.login-page{padding:65px 12px 25px}.login-intro{width:100%;margin-bottom:-10px}.login-intro h1{font-size:2.7rem}.login-composition{width:100%}.login-form{width:80%}.login-form input{height:31px}.signup-content{width:60%;top:20%;left:20%}.signup-form{width:92%}.signup-form label{font-size:.5rem}.signup-form input{height:27px;margin-bottom:6px;font-size:.59rem}.signup-form button{width:65%;padding:6px 10px;font-size:.57rem}}
