*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}

/* Page de lecture : le livre posé sur un fond sombre, sans défilement */
body.reader{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden;color:#f5f3ff;
  background:radial-gradient(ellipse at 50% 45%,#3b3652 0%,#211e30 60%,#15131f 100%)}
.reader header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px 4px}
.reader h1{margin:0;font-size:15px;font-weight:600;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reader button{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#f5f3ff;border-radius:999px;
  padding:8px 18px;font-size:18px;line-height:1;cursor:pointer;transition:background .2s}
.reader button:hover{background:rgba(255,255,255,.16)}
.tools{display:flex;gap:8px;flex-shrink:0}
#fullscreen{padding:6px 12px;font-size:16px}
#stage{flex:1;min-height:0;margin:8px 16px;display:flex;align-items:center;justify-content:center}
#book-holder{transition:transform .45s ease;filter:drop-shadow(0 20px 35px rgba(0,0,0,.55))}
.page{background:#fff;overflow:hidden}
.page img{width:100%;height:100%;object-fit:contain;display:block;background:#fff;user-select:none}
.reader nav{display:flex;align-items:center;justify-content:center;gap:16px;padding:6px 16px 4px}
#count{min-width:110px;text-align:center;font-size:14px;opacity:.75}
.hint{margin:0;padding:2px 16px 12px;text-align:center;font-size:12px;opacity:.45}
@media (max-height:500px){.hint{display:none}.reader header{padding-top:6px}}

/* Pages d'accueil et « introuvable » */
body.message{min-height:100vh;display:flex;background:#fffbeb;color:#1e1b4b}
.message main{margin:auto;padding:16px;display:flex;flex-direction:column;align-items:center;text-align:center;max-width:480px}
.message .logo{width:48px;height:48px;border-radius:12px;background:#1e1b4b;color:#f59e0b;display:grid;place-items:center;font-weight:700;font-size:24px}
.message h1{font-size:1.6rem}
.message p{opacity:.7;line-height:1.5}