:root{--paper:#f6f8f9;--surface:#fff;--ink:#17242b;--muted:#55656e;--rule:#d5dee3;--accent:#1d5f7a;--mark:#fde68a;--mark-ink:#17242b;--nav-height:calc(3.4rem + env(safe-area-inset-bottom));--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:18px;line-height:1.6}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--paper:#11191e;--surface:#172229;--ink:#e4ecef;--muted:#9db0b9;--rule:#2a3a43;--accent:#7cc3e0;--mark:#5c4a12;--mark-ink:#fff6d6}}*{box-sizing:border-box}body{background:var(--paper);color:var(--ink);margin:0}.app{flex-direction:column;min-height:100dvh;display:flex}main{width:100%;max-width:42rem;padding:calc(env(safe-area-inset-top) + 1.5rem) max(1rem, env(safe-area-inset-right)) 1.5rem max(1rem, env(safe-area-inset-left));flex:1;margin:0 auto}h1{margin:0 0 .5rem;font-size:1.75rem;line-height:1.2}p{color:var(--muted);margin:0}h2{overflow-wrap:anywhere;margin:0;font-size:1.1rem;line-height:1.3}.button,button{min-height:2.75rem;font:inherit;cursor:pointer;border-radius:6px;padding:.5rem 1rem;font-weight:600;display:inline-block}.button{background:var(--accent);color:var(--paper);margin:.5rem 0 1rem;position:relative}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.button:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}.file-input{opacity:0;cursor:pointer;position:absolute;inset:0}button{border:1px solid var(--rule);color:var(--muted);background:0 0}.message{border-left:3px solid var(--accent);background:var(--surface);color:var(--ink);margin-bottom:1rem;padding:.6rem .8rem}.books{gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.books li{border:1px solid var(--rule);background:var(--surface);border-radius:6px;align-items:center;gap:.75rem;padding:.75rem .9rem;display:flex}.book-details{flex:1;min-width:0}.book-details a{color:inherit}.reading-text{margin-top:1.5rem}.reading-text h2{margin-bottom:.75rem}.reading-text p{color:var(--ink);margin-bottom:1rem}.sentence{cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:3px}.sentence[aria-current]{background:var(--mark);color:var(--mark-ink);-webkit-box-decoration-break:clone;box-decoration-break:clone}.back-to-reading{bottom:calc(var(--nav-height) + 5rem);border-color:var(--accent);background:var(--accent);color:var(--paper);margin:0 auto;display:block;position:sticky}.player{bottom:var(--nav-height);background:var(--paper);border-top:1px solid var(--rule);margin:0 -.25rem -1.5rem;padding:.5rem .25rem;position:sticky}.controls{gap:.4rem;display:flex}.controls button{flex:1 0 auto;padding-inline:.4rem;font-size:.85rem}.controls .play{border-color:var(--accent);background:var(--accent);color:var(--paper);flex:3 0 auto;font-size:1rem}@media (width<=360px){.controls{gap:.2rem}.controls button,.options summary{padding-inline:.2rem;font-size:.72rem}.controls .play{font-size:.9rem}}.options{flex:1 0 auto}.options summary{border:1px solid var(--rule);min-height:2.75rem;color:var(--muted);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;padding-inline:.4rem;font-size:.85rem;font-weight:600;list-style:none;display:flex}.options summary::-webkit-details-marker{display:none}.options summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.settings{background:var(--surface);border:1px solid var(--rule);border-radius:6px;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.5rem;padding:.75rem;display:grid;position:absolute;bottom:100%;left:0;right:0}.settings label{color:var(--muted);gap:.2rem;font-size:.9rem;display:grid}.settings select{border:1px solid var(--rule);background:var(--surface);min-width:0;min-height:2.75rem;color:var(--ink);font:inherit;border-radius:6px}nav{background:var(--surface);border-top:1px solid var(--rule);padding-bottom:env(safe-area-inset-bottom);display:flex;position:sticky;bottom:0}nav a{color:var(--muted);text-align:center;flex:1;padding:.9rem .5rem;font-weight:600;text-decoration:none}nav a[aria-current=page]{color:var(--accent);box-shadow:inset 0 3px 0 var(--accent)}a:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
