/* PersonaScope V558: bookshelf filters and random resident guide. */
#home .home-about-primary{
  position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"title arrow" "desc arrow";
  gap:3px 12px;align-items:center;min-height:72px;padding:14px 16px;border:1px solid rgba(126,200,214,.34);border-radius:16px;
  background:linear-gradient(135deg,rgba(53,87,145,.24),rgba(42,170,159,.10));color:#f3f7ff;text-align:left;cursor:pointer
}
#home .home-about-primary strong{grid-area:title;font-size:15px;line-height:1.4}
#home .home-about-primary small{grid-area:desc;color:#aebbd0;font-size:9px;line-height:1.5}
#home .home-about-primary .home-action-arrow{grid-area:arrow;align-self:center}
#home .home-about-primary:hover,#home .home-about-primary:focus-visible{border-color:rgba(115,226,211,.58);transform:translateY(-1px)}
#home .home-learning-links .home-library-grid-entry{grid-column:1 / -1;min-height:58px;background:linear-gradient(135deg,rgba(53,87,145,.20),rgba(42,170,159,.07))}
#home .home-learning-links .home-library-grid-entry strong{font-size:13px}

.side-menu .side-menu-bookshelf-link{display:flex;align-items:center;justify-content:space-between;gap:12px}
.side-menu .side-menu-bookshelf-link b{display:grid;place-items:center;min-width:28px;height:24px;padding:0 7px;border:1px solid rgba(100,221,211,.25);border-radius:999px;background:rgba(75,205,194,.10);color:#8ce8df;font-size:.7rem}
.side-menu-bookshelf-preview{display:grid;gap:5px;padding:8px 13px 11px;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(0,0,0,.08);color:rgba(223,231,243,.76)}
.side-menu-bookshelf-preview>span{display:grid;grid-template-columns:36px minmax(0,1fr);gap:5px;font-size:.68rem;line-height:1.35;overflow:hidden}
.side-menu-bookshelf-preview>span small{color:#73ddd3;font-size:.58rem;font-weight:850}
.side-menu-bookshelf-preview>span:not(small){text-overflow:ellipsis}
.side-menu-bookshelf-preview>small{font-size:.66rem;color:rgba(211,221,237,.52)}
.side-menu-bookshelf-preview>em{font-style:normal;font-size:.6rem;color:rgba(211,221,237,.48);text-align:right}

.bookshelf-screen{width:min(100%,780px);margin:0 auto;padding-bottom:38px}
.bookshelf-heading{margin-bottom:20px}
.bookshelf-summary{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.bookshelf-summary span{display:inline-flex;align-items:center;gap:5px;padding:7px 10px;border:1px solid rgba(126,183,221,.18);border-radius:999px;background:rgba(13,37,65,.7);color:#aebed4;font-size:.76rem}
.bookshelf-summary b{color:#7de2d8;font-size:.86rem}
.bookshelf-group{margin:0 0 18px;padding:18px;border:1px solid rgba(126,183,221,.18);border-radius:22px;background:linear-gradient(145deg,rgba(15,39,69,.94),rgba(7,24,45,.94));box-shadow:0 16px 38px rgba(0,0,0,.13)}
.bookshelf-group-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:14px}
.bookshelf-group-head .eyebrow{margin:0 0 3px}
.bookshelf-group-head h2{margin:0;font-size:1.2rem}
.bookshelf-open-all{padding:7px 0;border:0;background:transparent;color:#75e3d8;font:inherit;font-size:.76rem;font-weight:800;white-space:nowrap}
.bookshelf-list{display:grid;gap:10px}
.bookshelf-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:stretch;padding:0;border:1px solid rgba(128,174,214,.17);border-radius:17px;background:rgba(8,27,50,.66);overflow:hidden}
.bookshelf-item-main{display:grid;gap:4px;padding:14px 15px;border:0;background:transparent;color:#f2f7ff;text-align:left;font:inherit;cursor:pointer}
.bookshelf-item-main>span{color:#75ddd4;font-size:.64rem;font-weight:850;letter-spacing:.04em}
.bookshelf-item-main>strong{font-size:.98rem;line-height:1.45}
.bookshelf-item-main>small{color:#a8b7cc;font-size:.76rem;line-height:1.55;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.bookshelf-remove{align-self:stretch;width:86px;padding:9px;border:0;border-left:1px solid rgba(128,174,214,.13);background:rgba(255,255,255,.025);color:#aebed2;font:inherit;font-size:.68rem;font-weight:760;cursor:pointer}
.bookshelf-item-main:hover,.bookshelf-item-main:focus-visible,.bookshelf-remove:hover,.bookshelf-remove:focus-visible{background:rgba(74,205,194,.08);color:#fff}
.bookshelf-empty{margin:0;padding:18px 12px;border:1px dashed rgba(128,174,214,.18);border-radius:15px;color:#8495ad;text-align:center;font-size:.82rem}
.bookshelf-empty[hidden]{display:none!important}

.library-glossary-term{grid-template-areas:"word open" "definition definition" "meta favorite"}
.glossary-bookshelf-toggle{grid-area:favorite;justify-self:end;align-self:end;padding:7px 10px;border:1px solid rgba(127,167,210,.24);border-radius:999px;background:rgba(8,28,52,.72);color:#b9c6d8;font:inherit;font-size:.72rem;font-weight:800;white-space:nowrap}
.glossary-bookshelf-toggle:hover,.glossary-bookshelf-toggle:focus-visible,.glossary-bookshelf-toggle.active{border-color:rgba(105,222,213,.52);background:rgba(38,118,118,.22);color:#8ce7df}
#libraryGlossaryFavoriteButton.active{border-color:rgba(105,222,213,.52);background:rgba(38,118,118,.22);color:#9cece5}

@media(max-width:620px){
  #home .home-about-primary{min-height:68px;padding:13px 14px}
  .bookshelf-screen{padding-inline:0}
  .bookshelf-group{padding:15px;border-radius:19px}
  .bookshelf-group-head{align-items:flex-start}
  .bookshelf-item{grid-template-columns:minmax(0,1fr)}
  .bookshelf-remove{width:100%;min-height:40px;border-left:0;border-top:1px solid rgba(128,174,214,.13)}
  .library-glossary-term{grid-template-areas:"word" "definition" "meta" "open" "favorite"}
  .glossary-bookshelf-toggle{justify-self:start}
}
@media(prefers-reduced-motion:reduce){#home .home-about-primary{transition:none!important}}


/* V558: filter the bookshelf by saved content type. */
.bookshelf-summary{align-items:center}
.bookshelf-filter{
  display:inline-flex;align-items:center;gap:5px;padding:7px 10px;border:1px solid rgba(126,183,221,.18);border-radius:999px;
  background:rgba(13,37,65,.7);color:#aebed4;font:inherit;font-size:.76rem;cursor:pointer;transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease
}
.bookshelf-filter b{color:#7de2d8;font-size:.86rem}
.bookshelf-filter:hover,.bookshelf-filter:focus-visible{border-color:rgba(117,226,216,.42);color:#eef8ff;transform:translateY(-1px)}
.bookshelf-filter.active,.bookshelf-filter[aria-selected="true"]{border-color:rgba(117,226,216,.58);background:rgba(46,143,139,.22);color:#f2fffd;box-shadow:0 8px 22px rgba(0,0,0,.12)}
.bookshelf-group[hidden]{display:none!important}

/* V558: the bookshelf always has a chibi guide and a line. */
.bookshelf-resident-guide{
  position:relative;overflow:hidden;display:grid;grid-template-columns:160px minmax(0,1fr);align-items:center;gap:14px;
  min-height:174px;margin:0 0 18px;padding:14px 16px;border:1px solid rgba(126,183,221,.19);border-radius:22px;
  background:radial-gradient(circle at 16% 46%,rgba(79,208,195,.13),transparent 34%),linear-gradient(145deg,rgba(15,39,69,.95),rgba(7,24,45,.95));
  box-shadow:0 16px 38px rgba(0,0,0,.13)
}
.bookshelf-resident-visual{position:relative;display:grid;place-items:center;align-self:stretch;min-height:142px}
.bookshelf-resident-glow{position:absolute;inset:22% 10% 7%;border-radius:50%;background:rgba(92,220,207,.12);filter:blur(22px)}
.bookshelf-resident-visual img{position:relative;z-index:1;width:100%;height:150px;object-fit:contain;object-position:center bottom;display:block;filter:drop-shadow(0 14px 18px rgba(0,0,0,.28))}
.bookshelf-resident-copy{position:relative;z-index:1;display:grid;gap:8px;padding:8px 4px}
.bookshelf-resident-copy .eyebrow{margin:0;color:#7ce4da;font-size:.68rem;letter-spacing:.18em}
.bookshelf-resident-copy p:last-child{margin:0;color:#eef6ff;font-size:1rem;font-weight:760;line-height:1.75}
html.simple-mode-pending #bookshelfResidentGuide,body.simple-mode #bookshelfResidentGuide{display:none!important}

@media(max-width:620px){
  .bookshelf-resident-guide{grid-template-columns:112px minmax(0,1fr);gap:10px;min-height:142px;padding:11px 12px;border-radius:19px}
  .bookshelf-resident-visual{min-height:118px}
  .bookshelf-resident-visual img{height:124px}
  .bookshelf-resident-copy{gap:6px;padding:5px 0}
  .bookshelf-resident-copy .eyebrow{font-size:.58rem}
  .bookshelf-resident-copy p:last-child{font-size:.84rem;line-height:1.65}
}
@media(max-width:390px){
  .bookshelf-resident-guide{grid-template-columns:96px minmax(0,1fr)}
  .bookshelf-resident-visual img{height:112px}
  .bookshelf-resident-copy p:last-child{font-size:.8rem}
}
@media(prefers-reduced-motion:reduce){.bookshelf-filter{transition:none!important}}