/* Bibliothèque : catalogue, fiche livre, avis, liseuse. Variables du thème uniquement (sauf les fonds de lecture fixes). */
.stars { display: inline-flex; gap: 1px; font-style: normal; letter-spacing: 0; }
.stars i { font-style: normal; color: color-mix(in srgb, var(--text-dim) 45%, transparent); }
.stars i.on { color: var(--accent-2); }
.stars-input { display: inline-flex; gap: .15rem; }
.stars-input button { background: none; border: 0; padding: .1rem .15rem; font-size: 1.7rem; line-height: 1; color: color-mix(in srgb, var(--text-dim) 45%, transparent); }
.stars-input button.on { color: var(--accent-2); }
.stars-input button:hover { transform: scale(1.15); }

/* Catalogue */
.lib-grille { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); margin-top: 1rem; }
.lib-card { padding: 0; overflow: hidden; color: var(--text); display: grid; grid-template-rows: auto 1fr; }
.lib-cover { position: relative; aspect-ratio: 2 / 3; display: grid; place-items: center; font-size: 3rem; background: linear-gradient(160deg, var(--surface-2), var(--bg-2)); }
.lib-cover img { width: 100%; height: 100%; object-fit: cover; }
.lib-badge { position: absolute; top: .6rem; left: .6rem; }
.lib-info { padding: .8rem 1rem 1rem; display: grid; gap: .2rem; align-content: start; }
.lib-info small { color: var(--text-dim); }
.lib-note { display: flex; gap: .3rem; align-items: center; }

/* Fiche */
.lib-page { max-width: 980px; }
.lib-fiche { display: grid; grid-template-columns: 230px 1fr; gap: 2rem; align-items: start; margin-top: 1rem; padding: 1.5rem; background: var(--plate); backdrop-filter: blur(6px); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.lib-fiche__cover { aspect-ratio: 2 / 3; display: grid; place-items: center; font-size: 4rem; background: linear-gradient(160deg, var(--surface-2), var(--bg-2)); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--glow); }
.lib-fiche__cover img { width: 100%; height: 100%; object-fit: cover; }
.lib-fiche__info h1 { margin: .3rem 0 0; }
.lib-cta { margin: 1.2rem 0 .5rem; display: flex; gap: .7rem; flex-wrap: wrap; }
@media (max-width: 700px) { .lib-fiche { grid-template-columns: 1fr; } .lib-fiche__cover { max-width: 220px; } }
.lib-toc { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .4rem; counter-reset: ch; }
.lib-toc li { counter-increment: ch; }
.lib-toc a, .lib-toc li > span { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: .6rem 1rem; background: var(--plate); backdrop-filter: blur(6px); border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); }
.lib-toc a:hover { border-color: var(--accent); text-decoration: none; }
.lib-toc a[aria-current] { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, var(--surface)); }
.lib-toc__titre::before { content: counter(ch) ". "; color: var(--accent); }
dialog .lib-toc { max-height: 60vh; overflow: auto; }

/* Avis */
.lib-resume-avis { display: grid; grid-template-columns: auto 1fr; gap: 2rem; align-items: center; }
.lib-resume-avis__note { display: grid; justify-items: center; gap: .1rem; }
.lib-resume-avis__note strong { font-size: 2.6rem; font-family: var(--font-h1), serif; color: var(--accent); line-height: 1; }
.lib-barre { display: grid; grid-template-columns: 2.5rem 1fr 2rem; gap: .6rem; align-items: center; font-size: .85rem; color: var(--text-dim); }
.lib-avis { display: grid; gap: .8rem; margin-top: 1rem; }
.lib-avis header { display: flex; gap: .6rem; align-items: baseline; }
.lib-avis h4 { margin: .4rem 0 .2rem; }
@media (max-width: 560px) { .lib-resume-avis { grid-template-columns: 1fr; } }

/* Liseuse */
.liseuse { --ls-bg: transparent; --ls-fg: var(--text); --ls-dim: var(--text-dim); --ls-acc: var(--accent); --ls-page: var(--plate); --ls-bord: var(--border); }
.liseuse[data-theme-lec="sombre"] { --ls-bg: #0d0d12; --ls-fg: #e6e2da; --ls-dim: #9a96a8; --ls-acc: #d4af37; --ls-page: #14141c; --ls-bord: #2a2a35; }
.liseuse[data-theme-lec="sepia"]  { --ls-bg: #e9dcc0; --ls-fg: #3b2d1a; --ls-dim: #7a6648; --ls-acc: #8c3f12; --ls-page: #f4ead2; --ls-bord: #cdbb94; }
.liseuse[data-theme-lec="clair"]  { --ls-bg: #f3f1ec; --ls-fg: #1d1b20; --ls-dim: #66626e; --ls-acc: #5b2a6e; --ls-page: #ffffff; --ls-bord: #d9d5cc; }
.liseuse { background: var(--ls-bg); color: var(--ls-fg); min-height: 100vh; position: relative; z-index: 1; }
.liseuse__barre { position: sticky; top: 0; z-index: 40; background: color-mix(in srgb, var(--ls-page) 92%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--ls-bord); }
.liseuse__outils { display: flex; align-items: center; gap: .6rem; padding: .5rem 1rem; max-width: 1000px; margin: 0 auto; }
.liseuse__outils .btn.ghost { color: var(--ls-fg); border-color: var(--ls-bord); }
.liseuse__titre { flex: 1; min-width: 0; display: grid; line-height: 1.25; text-align: center; }
.liseuse__titre strong, .liseuse__titre small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.liseuse__titre small { color: var(--ls-dim); }
#ls-progression { display: block; width: 100%; height: 3px; border-radius: 0; background: transparent; }
#ls-progression::-webkit-progress-bar { background: transparent; }
#ls-progression::-webkit-progress-value { background: var(--ls-acc); border-radius: 0; }
#ls-progression::-moz-progress-bar { background: var(--ls-acc); }
.liseuse__reglages { position: fixed; z-index: 50; top: 4rem; right: max(1rem, calc(50% - 480px)); display: grid; gap: .9rem; padding: 1rem 1.2rem; width: min(360px, calc(100% - 2rem)); background: var(--surface-2); }
.liseuse__reglages[hidden] { display: none; }
.liseuse__page { max-width: 760px; margin: 0 auto; padding: 2rem 1.2rem 4rem; }
.liseuse[data-largeur="sm"] .liseuse__page { max-width: 620px; }
.liseuse[data-largeur="lg"] .liseuse__page { max-width: 900px; }
.liseuse__page > header { text-align: center; margin-bottom: 2rem; }
.liseuse__page h1 { color: var(--ls-acc); font-size: clamp(1.8rem, 5vw, 2.6rem); }
.liseuse__page > header .kicker { color: var(--ls-dim); }
.liseuse__texte { font-family: var(--font-body), serif; font-size: 1.12rem; line-height: 1.95; background: var(--ls-page); border: 1px solid var(--ls-bord); border-radius: var(--radius-lg); padding: clamp(1.2rem, 4vw, 2.6rem); }
.liseuse[data-taille="sm"] .liseuse__texte { font-size: .98rem; }
.liseuse[data-taille="lg"] .liseuse__texte { font-size: 1.3rem; }
.liseuse[data-taille="xl"] .liseuse__texte { font-size: 1.5rem; }
.liseuse__texte p { margin: 0 0 1em; text-indent: 1.5em; text-align: justify; hyphens: auto; }
.liseuse__texte p:first-child, .liseuse__texte p.scene-sep + p { text-indent: 0; }
.liseuse__texte p.scene-sep { text-align: center; text-indent: 0; color: var(--ls-acc); letter-spacing: .5em; margin: 1.6em 0; }
.liseuse__texte p.lettrine::first-letter { float: left; font-family: var(--font-h1), serif; font-size: 3.6em; line-height: .85; padding: .08em .1em 0 0; color: var(--ls-acc); }
.liseuse__texte em, .liseuse__texte i { font-style: italic; }
.liseuse__texte a { color: var(--ls-acc); }
.liseuse__note { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .8rem; margin: 1.5rem 0; padding: .8rem 1rem; background: var(--ls-page); border: 1px solid var(--ls-bord); border-radius: var(--radius); }
.liseuse .val-pager a { background: var(--ls-page); color: var(--ls-fg); border-color: var(--ls-bord); }
.liseuse .hint, .liseuse .kicker { color: var(--ls-dim); }