/* Flat, outlined wood and paper shapes — a drawn reading room. */
#shelfPanel{--wood:#d7aa7f;--outline:#82634d;--paper:#fff8e9}
#shelfPanel>.title-row h1{font-size:32px;word-break:keep-all;color:#594b3e}
#shelfPanel>.title-row .eyebrow{color:#ad785d}
.story-icon{display:inline-flex;width:52px;height:52px;flex-shrink:0;vertical-align:middle}.story-icon svg{width:100%;height:100%}
.kind-shelves{max-width:640px;margin:25px auto 20px;padding:16px 24px;background:#f5e9cb;border-radius:30px 24px 28px 20px;gap:18px}
.kind-shelf,.kind-shelf.selected{flex-direction:column;justify-content:center;gap:3px;padding:12px;background:#fffcf4;border:2px solid transparent;border-radius:16px;box-shadow:0 3px #dfd0af;text-align:center;position:relative}
.kind-shelf .story-icon{width:65px;height:65px}.kind-shelf strong{font-size:15px;font-weight:600}.kind-shelf span:not(.story-icon){font-size:11px;margin:0;color:#85745f}
.kind-shelf.selected{border-color:#8f9e79;background:#f3f5e9;box-shadow:0 3px #8f9e79}.kind-shelf:hover{transform:translateY(-3px)}
#newBook,#manageGroups{display:inline-flex;align-items:center;gap:8px;background:#fff9e9;color:#65513e;border:1.5px solid #c3a685;border-radius:14px;box-shadow:0 3px #e2d4bf;padding:8px 15px}#newBook .story-icon,#manageGroups .story-icon{width:38px;height:38px}
.shelf-description{justify-content:center;margin-top:0}.personal-hint{text-align:center}.shelf-filters{border:0;margin:20px 0 10px}.shelf-filters button{border-radius:20px}.shelf-filters .selected{background:#e7dfcd;color:#66543f}
.room-navigation{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:16px 0 24px}.room-navigation>div{text-align:center}.room-navigation h2{font-size:23px;color:#69513f;margin:0 0 4px}.room-navigation p{margin:0;font-size:11px;color:#97846d}.room-arrow{width:48px;height:48px;border:2px solid #bfa786;border-radius:50% 44% 48% 45%;background:#fff5dc;font-size:24px;padding:0;box-shadow:0 3px #dac5a6}.room-arrow:hover{background:#f4e7bd}
.shelf-sections{padding:12px 24px 25px;background:#c79568;border:3px solid var(--outline);border-radius:10px 12px 5px 6px;box-shadow:inset 0 0 0 7px #e4bb8a,0 9px 0 -2px #ad805c;position:relative;touch-action:pan-y}
.shelf-sections:before{content:'';position:absolute;top:-13px;left:-10px;right:-10px;height:17px;background:#e8c295;border:3px solid var(--outline);border-radius:8px 8px 3px 3px}
.shelf-sections:after{content:'';position:absolute;bottom:-24px;left:20px;right:20px;height:19px;border-left:18px solid #a77853;border-right:18px solid #a77853;pointer-events:none}
.personal-shelf{margin:17px 0 25px}.personal-shelf:last-child{margin-bottom:0}.group-heading{border:0;padding:0 4px 12px;gap:10px}.group-heading h2{font-size:17px;background:#fff2ce;padding:7px 17px;border:1.5px solid #9b7754;border-radius:4px 8px 5px 4px;box-shadow:2px 2px #ab7e54;color:#644b34}.group-heading>.muted{color:#503d2e;font-size:11px}.group-heading button{background:#eac9a3;border:1px solid #a57a53;border-radius:10px;color:#624b37}
.personal-shelf>.book-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:0;background:#ead5b6;border:2px solid #a47a55;border-bottom:0;border-radius:4px;overflow:visible}
.personal-shelf .book-slot{padding:22px 14px 12px;border:0;border-right:2px solid #b58b61;border-bottom:12px solid #b78759;box-shadow:0 3px #845f42;min-width:0;position:relative;background:linear-gradient(#dbbf98 0 8px,transparent 8px)}
.personal-shelf .book-slot:nth-child(4n){border-right:0}
.personal-shelf .album-cover{height:235px;padding:15px 12px 14px 22px;border:2px solid #775d51;border-left:10px solid #0002;border-radius:5px 10px 11px 4px;box-shadow:4px 4px 0 #866d5040;transform:rotate(-1deg);transform-origin:bottom center;transition:transform .22s,box-shadow .22s}
.personal-shelf .book-slot:nth-child(even) .album-cover{transform:rotate(1deg)}
.personal-shelf .album-cover:hover,.personal-shelf .album-cover:focus-visible{transform:translateY(-13px) rotate(-3deg);box-shadow:7px 13px 0 #866d5026;z-index:1;filter:none}
.personal-shelf .album-cover:after{content:'';position:absolute;right:-4px;top:7px;bottom:7px;width:4px;border:1px solid #91795e;background:#fff2d5;border-radius:0 3px 3px 0}
.personal-shelf .cover-brand{font-size:8px;letter-spacing:2px}.personal-shelf .cover-title{font-size:18px}.personal-shelf .cover-ornament{height:92px;opacity:1}.cover-ornament .story-icon{width:68px;height:68px}.personal-shelf .album-cover img{height:100px;border:4px solid #fff4db;margin-top:12px;box-shadow:none}.personal-shelf .cover-subtitle{font-size:8px}
.personal-shelf .book-meta{padding-top:8px}.personal-shelf .book-meta h2{font-size:12px;color:#594633;margin:8px 0 2px}.personal-shelf .book-meta p,.personal-shelf .book-meta .tag{font-size:10px;color:#705b45}.personal-shelf .book-group-label{color:#655139;margin-top:8px}.personal-shelf .book-group-label select{background:#fff5e1;border-color:#c7a981;border-radius:8px}
.group-empty{padding:45px 12px;margin:0;background:#ead5b6;border:2px solid #a47a55;border-bottom:12px solid #b78759;color:#7c6246;text-align:center}
#emptyShelf{padding:35px 15px 10px}#emptyShelf .empty-icon{display:none}
.room-moving{animation:room-slide .32s ease-out}@keyframes room-slide{from{opacity:.3;transform:translateX(var(--travel,30px))}to{opacity:1;transform:none}}
.book-taking{animation:take-book .38s ease-in forwards!important;pointer-events:none}@keyframes take-book{to{transform:translateY(-28px) scale(1.09) rotate(-5deg);opacity:.25}}
.book-arriving{animation:open-book .4s ease-out}@keyframes open-book{from{opacity:.3;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}
.toolbar-actions button,#backShelf{border-radius:12px;background:#fff9ea;border-color:#d9c6a6;display:inline-flex;align-items:center;gap:5px}.toolbar-actions .story-icon,#backShelf .story-icon{width:29px;height:29px}.toolbar-actions .selected{background:#e7eddc;border-color:#aaba91}
button:focus-visible{outline:3px solid #6b885a;outline-offset:4px}
@media(max-width:900px){.personal-shelf>.book-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.personal-shelf .book-slot:nth-child(4n){border-right:2px solid #b58b61}.personal-shelf .book-slot:nth-child(3n){border-right:0}}
@media(max-width:700px){#shelfPanel>.title-row{align-items:center;gap:10px}#shelfPanel>.title-row h1{font-size:25px}#shelfPanel>.title-row .muted{font-size:11px}#newBook{flex-direction:column;gap:0;padding:6px 9px;font-size:10px}#newBook .story-icon{width:34px;height:34px}.kind-shelves{padding:12px;gap:10px;border-radius:22px}.kind-shelf,.kind-shelf.selected{padding:9px 4px;display:flex}.kind-shelf .story-icon{width:47px;height:47px}.kind-shelf strong{font-size:12px}.shelf-description{justify-content:space-between;align-items:center}#manageGroups{padding:4px 8px;font-size:10px;gap:3px}#manageGroups .story-icon{width:29px;height:29px}.personal-hint{font-size:10px;text-align:left}.room-navigation{margin:15px 0 25px}.room-navigation h2{font-size:19px}.room-arrow{width:40px;height:40px}.shelf-sections{padding:8px 9px 15px;border-width:2px;box-shadow:inset 0 0 0 4px #e4bb8a,0 6px 0 -1px #ad805c}.personal-shelf>.book-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.personal-shelf .book-slot{padding:15px 9px 8px;border-bottom-width:10px}.personal-shelf .book-slot:nth-child(3n){border-right:2px solid #b58b61}.personal-shelf .book-slot:nth-child(2n){border-right:0}.personal-shelf .album-cover{height:203px;padding:12px 8px 12px 12px;border-left-width:7px}.personal-shelf .cover-title{font-size:14px}.personal-shelf .cover-brand{font-size:6px;letter-spacing:1px}.personal-shelf .cover-ornament{height:70px}.personal-shelf .cover-ornament .story-icon{width:52px;height:52px}.personal-shelf .album-cover img{height:77px}.personal-shelf .cover-subtitle{font-size:7px}.group-heading{gap:5px;flex-wrap:wrap}.group-heading h2{font-size:13px;padding:6px 9px;max-width:65%}.group-heading button{font-size:9px;padding:5px}.group-heading>.muted{font-size:9px}.personal-shelf .book-group-label{display:block;font-size:9px}.personal-shelf .book-group-label select{margin-top:3px;font-size:10px;min-height:32px}.toolbar-actions button{flex-direction:column;gap:0}.toolbar-actions .story-icon{width:25px;height:25px}.book-toolbar{position:static}.group-empty{font-size:11px}.personal-shelf .book-meta h2{font-size:11px}}
.personal-shelf .book-group-label select{display:block;max-width:100%}
@media(max-width:700px){.personal-shelf .book-group-label{white-space:normal}.personal-shelf .book-group-label select{width:100%}}
@media(prefers-reduced-motion:reduce){.room-moving,.book-taking,.book-arriving{animation:none!important}.kind-shelf,.personal-shelf .album-cover{transition:none}.personal-shelf .album-cover:hover{transform:none}}