/* GRAVITISM Reader — modal + Reader guide (shared by reader.html and literature.html). */
/* Modals (resume prompt, reader guide) */
.reader-modal{position:fixed;inset:0;z-index:10010;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(8,8,8,.55);backdrop-filter:blur(3px);opacity:0;transition:opacity .2s ease;}
.reader-modal.is-on{opacity:1;}
.reader-modal-card{width:min(420px,100%);max-height:calc(100svh - 32px);overflow:auto;background:#141312;color:#ddd7cd;border:1px solid rgba(240,238,234,.16);box-shadow:0 20px 60px rgba(0,0,0,.55);padding:26px 26px 22px;box-sizing:border-box;font:13px/1.6 Arial,sans-serif;}
.reader-modal h2{margin:0 0 8px;font:400 20px/1.25 Lora,Georgia,serif;color:#f0eeea;letter-spacing:.02em;}
.reader-modal p{margin:0 0 18px;color:#bdb6ab;}
.reader-modal-actions{display:flex;flex-direction:column;gap:8px;}
.reader-modal-actions button{height:40px;border:1px solid rgba(240,238,234,.18);background:rgba(255,255,255,.03);color:#e6e0d6;font:11px/1 Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;}
.reader-modal-actions button:hover,.reader-modal-actions button:focus-visible{background:rgba(240,238,234,.08);outline:none;}
.reader-modal-actions button.is-primary{background:rgba(184,91,52,.22);border-color:rgba(184,91,52,.6);color:#fff;}
.reader-help .reader-modal-card{width:min(640px,100%);padding:0;}
.reader-help header{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid rgba(240,238,234,.1);position:sticky;top:0;background:inherit;z-index:1;}
.reader-help header h2{margin:0;font:400 19px/1.2 Lora,Georgia,serif;color:#f0eeea;}
.reader-drawer header h2 small{font:10px/1 Arial,sans-serif;letter-spacing:.1em;opacity:.55;margin-left:6px;}
.drawer-close{width:32px;height:32px;border:1px solid rgba(240,238,234,.14);background:none;color:#cfc9c0;font-size:18px;line-height:1;cursor:pointer;}
.drawer-close:hover{color:#fff;border-color:rgba(240,238,234,.35);}
.help-body{padding:6px 22px 22px;}
.help-body h3{margin:20px 0 10px;font:10px/1 Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#8e877d;}
.help-tools{display:grid;grid-template-columns:auto 1fr;gap:9px 16px;margin:0;align-items:baseline;}
.help-tools dt{min-width:70px;color:#f0eeea;font:12px/1 Arial,sans-serif;white-space:nowrap;}
.help-tools dt svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round;vertical-align:-2px;}
.help-tools dt svg .f{fill:currentColor;stroke:none;}
.help-tools dd{margin:0;color:#bdb6ab;}
.help-tools kbd{display:inline-block;border:1px solid rgba(240,238,234,.22);padding:3px 6px;font:11px/1 Arial,sans-serif;color:#f0eeea;}
.help-steps{margin:0;padding-left:18px;color:#bdb6ab;}
.help-steps li{margin-bottom:6px;}
.help-body p{margin:0;color:#bdb6ab;}
@media (hover:none),(pointer:coarse){.help-desktop{display:none;}}

/* Literature page: link that opens the Reader guide. */
.reader-guide-link{background:none;border:0;padding:0;margin:0;cursor:pointer;color:#a29d95;font:inherit;letter-spacing:inherit;text-transform:uppercase;display:inline-flex;align-items:center;gap:7px;}
.reader-guide-link:hover,.reader-guide-link:focus-visible{color:#f0eeea;outline:none;}
.reader-guide-link b{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border:1px solid currentColor;border-radius:50%;font:600 9px/1 Arial,sans-serif;}
.reader-guide-link-fixed{position:fixed;right:40px;bottom:30px;z-index:40;font:10px/1 Arial,sans-serif;letter-spacing:.18em;}
@media (max-width:760px){.reader-guide-link-fixed{right:18px;bottom:18px;font-size:8px;}}
.help-keys dt{display:flex;flex-wrap:wrap;gap:4px;max-width:150px;}

/* Listening notices (Edge tip / no voice) */
.reader-listen .reader-modal-card p{margin:0 0 12px;}
.reader-listen .reader-listen-hint{font-size:12px;color:#a9a297;}
.reader-listen-check{display:flex;align-items:center;gap:8px;margin:4px 0 18px;font-size:12px;color:#a9a297;cursor:pointer;}
.reader-listen-check input{accent-color:#b85b34;margin:0;}
.reader-listen .reader-modal-actions{margin-top:16px;}
.reader-listen-edge{display:flex;align-items:center;justify-content:center;height:40px;border:1px solid rgba(240,238,234,.18);color:#e6e0d6;font:11px/1 Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;}
.reader-listen-edge:hover{background:rgba(240,238,234,.08);}

.help-offline-btn{height:34px;padding:0 14px;border:1px solid rgba(184,91,52,.6);background:rgba(184,91,52,.18);color:#f0eeea;font:11px/1 Arial,sans-serif;letter-spacing:.06em;cursor:pointer;}
.help-offline-btn:hover{background:rgba(184,91,52,.3);}
.reader-modal-actions button.is-danger{border-color:rgba(214,104,84,.6);color:#f0b5a7;}
.reader-modal-actions button.is-danger:hover{background:rgba(214,104,84,.18);}