* { box-sizing:border-box; }
body { margin:0; padding:1rem; background:#f3f5f8; color:#182338; font:16px/1.5 system-ui,Arial,sans-serif; }
.reader { max-width:980px; margin:0 auto; }
header { text-align:center; }
h1 { font-size:clamp(1.2rem,3vw,1.9rem); margin:.3rem 0; }
#status { min-height:1.4rem; margin:.3rem 0 .7rem; color:#455269; }
.page-wrap { min-height:320px; display:flex; justify-content:center; align-items:flex-start; }
#page { display:none; width:auto; max-width:100%; height:auto; max-height:calc(100vh - 200px); object-fit:contain; background:white; box-shadow:0 2px 14px #0002; user-select:none; }
nav { display:flex; justify-content:center; align-items:center; gap:1rem; margin-top:1rem; flex-wrap:wrap; }
button { background:#153f76; border:0; border-radius:6px; color:#fff; font:inherit; padding:.65rem 1rem; cursor:pointer; }
button:disabled { opacity:.4; cursor:not-allowed; }
#counter { min-width:90px; text-align:center; }

.selector {display:flex;align-items:center;justify-content:center;gap:.75rem;flex-wrap:wrap;padding:.5rem 0 1rem;}
.selector label {font-weight:650;}
.selector select {padding:.65rem .8rem;border:1px solid #8494a8;border-radius:6px;background:white;color:#182338;min-width:min(100%,320px);font:inherit;}
@media(max-width:500px){.selector {align-items:stretch;flex-direction:column;} .selector select{width:100%;} body{padding:.5rem;}}
/* Nasconde il lettore durante la stampa */
@media print {
    body {
        display: none !important;
    }

    html {
        background: white !important;
    }
}