*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}.app-root{display:flex;flex-direction:column;height:100%;font-family:system-ui,-apple-system,sans-serif;background:#1a1a2e;color:#eee}.app-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:#16213e;border-bottom:1px solid #0f3460;flex-shrink:0}.app-title{font-size:1.1rem;font-weight:600;letter-spacing:.02em}.file-pick-btn{cursor:pointer;padding:.4rem .9rem;background:#0f3460;border:1px solid #1a6eb5;border-radius:4px;color:#eee;font-size:.85rem;transition:background .15s}.file-pick-btn:hover{background:#1a6eb5}.splash{flex:1;display:flex;align-items:center;justify-content:center;color:#888;font-size:1rem}.reader-layout{flex:1;display:flex;flex-direction:column;overflow:hidden}.viewer-wrapper{flex:1 1 auto;min-height:0;background:#fff;position:relative}.tap-zone{position:absolute;top:0;bottom:0;width:30%;background:transparent;border:none;cursor:pointer;-webkit-tap-highlight-color:transparent;z-index:10;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0}.tap-zone--prev{left:0}.tap-zone--next{right:0}.tap-zone:active{background:#0000000f}[data-theme=light] .tap-zone:active{background:#0000000a}.page-nav-btns{display:flex;gap:.25rem;flex-shrink:0}.btn-page-nav{font-size:1.2rem;line-height:1;padding:.25rem .6rem;min-width:2.2rem;font-weight:600}.controls-bar{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem;padding:.5rem 1rem;background:#16213e;border-top:1px solid #0f3460;flex-shrink:0}.playback-btns{display:flex;gap:.4rem}.btn{padding:.35rem .75rem;border:1px solid #1a6eb5;border-radius:4px;background:#0f3460;color:#eee;font-size:.85rem;cursor:pointer;transition:background .15s}.btn:hover:not(:disabled){background:#1a6eb5}.btn:disabled{opacity:.4;cursor:default}.btn-play{background:#0a6640;border-color:#0d9155}.btn-play:hover:not(:disabled){background:#0d9155}.btn-stop{background:#66200a;border-color:#b53b1a}.btn-stop:hover{background:#b53b1a}.voice-select{flex:1;max-width:280px;padding:.3rem .5rem;background:#0f3460;border:1px solid #1a6eb5;border-radius:4px;color:#eee;font-size:.82rem}.rate-label{display:flex;align-items:center;gap:.4rem;font-size:.82rem;white-space:nowrap}.rate-slider{width:80px;cursor:pointer;accent-color:#1a6eb5}.rate-value{min-width:2.5ch;text-align:right;font-variant-numeric:tabular-nums}.header-actions{display:flex;align-items:center;gap:.5rem}.settings-btn{font-size:1rem;padding:.35rem .6rem;line-height:1}.settings-btn--active{background:#1a6eb5;border-color:#4a9ee5}.settings-panel{background:#0d1b2a;border-bottom:1px solid #0f3460;padding:.75rem 1rem;flex-shrink:0;display:flex;flex-direction:column;gap:.6rem}.settings-header{display:flex;align-items:center;justify-content:space-between}.settings-title{font-weight:600;font-size:.9rem;letter-spacing:.02em}.settings-close-btn{padding:.2rem .5rem;font-size:.8rem}.settings-row{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.settings-label{font-size:.82rem;color:#aaa;white-space:nowrap;min-width:8rem}.settings-note{font-size:.78rem;color:#777;line-height:1.5}.engine-toggle{display:flex;gap:0}.engine-btn{border-radius:0;font-size:.82rem;padding:.3rem .7rem}.engine-btn:first-child{border-radius:4px 0 0 4px}.engine-btn:last-child{border-radius:0 4px 4px 0;border-left:none}.engine-btn--active{background:#1a6eb5;border-color:#4a9ee5;color:#fff}.engine-badge{font-size:.78rem;padding:.2rem .5rem;border-radius:4px;border:1px solid transparent;white-space:nowrap}.engine-badge--webSpeech{background:#1a2a1a;border-color:#2a6e2a;color:#7ec87e}.engine-badge--cloudflare{background:#1a1a3a;border-color:#3a2a8e;color:#a0a0ee}.text-layer{flex-shrink:0;max-height:28vh;overflow-y:auto;padding:.75rem 1rem;background:#0d0d1a;border-top:1px solid #0f3460;font-size:.9rem;line-height:1.7;color:#bbb}.sentence{border-radius:2px;transition:background .2s,color .2s}.sentence--active{background:#1a6eb559;color:#fff;outline:1px solid rgba(26,110,181,.6);border-radius:3px}[data-theme=light] .app-root,.app-root[data-theme=light]{background:#f0f2f5;color:#1a1a2e}.app-root[data-theme=light] .app-header{background:#1a1a2e;border-bottom-color:#0f3460}.app-root[data-theme=light] .controls-bar{background:#e8eaf0;border-top-color:#c8ccd8;color:#1a1a2e}.app-root[data-theme=light] .settings-panel{background:#f8f9fc;border-bottom-color:#c8ccd8;color:#1a1a2e}.app-root[data-theme=light] .settings-label{color:#555}.app-root[data-theme=light] .settings-note{color:#666}.app-root[data-theme=light] .btn{background:#dde3ef;border-color:#aab0c4;color:#1a1a2e}.app-root[data-theme=light] .btn:hover:not(:disabled){background:#c0c8dc}.app-root[data-theme=light] .btn-play{background:#c8edd8;border-color:#4caf80;color:#1a3a28}.app-root[data-theme=light] .btn-play:hover:not(:disabled){background:#a8dfc0}.app-root[data-theme=light] .btn-stop{background:#f0d0c8;border-color:#d07060;color:#3a1a14}.app-root[data-theme=light] .btn-stop:hover{background:#e0b0a0}.app-root[data-theme=light] .engine-btn--active{background:#3a6eb5;border-color:#5a8ed5;color:#fff}.app-root[data-theme=light] .voice-select,.app-root[data-theme=light] .settings-select{background:#fff;border-color:#aab0c4;color:#1a1a2e}.app-root[data-theme=light] .text-layer{background:#f0f2f5;border-top-color:#c8ccd8;color:#333}.app-root[data-theme=light] .sentence--active{background:#3a6eb52e;color:#1a1a2e;outline-color:#3a6eb580}.app-root[data-theme=light] .splash{color:#555}.app-root[data-theme=light] .viewer-wrapper{background:#fff}.reading-progress{font-size:.78rem;color:#aac8e8;font-variant-numeric:tabular-nums;white-space:nowrap;padding:.2rem .4rem;border-radius:3px;background:#ffffff14}.epub-error-banner{flex-shrink:0;padding:.55rem 1rem;background:#2a1010;border-bottom:1px solid #6e2a2a;color:#e07070;font-size:.85rem;line-height:1.5}.app-root[data-theme=light] .epub-error-banner{background:#fff5f5;border-bottom-color:#f5c6c6;color:#c00}.voice-unavailable{font-size:.78rem;color:#e07070}.app-root[data-theme=light] .voice-unavailable{color:#c00}.splash-pick-btn{margin-top:.5rem}.settings-range{flex:1;min-width:80px;cursor:pointer;accent-color:#1a6eb5}.settings-range-val{font-size:.82rem;min-width:3ch;text-align:right;font-variant-numeric:tabular-nums;color:#aaa}.app-root[data-theme=light] .settings-range-val{color:#555}.settings-select{flex:1;padding:.3rem .5rem;background:#0f3460;border:1px solid #1a6eb5;border-radius:4px;color:#eee;font-size:.82rem;max-width:280px}.settings-note--warn{color:#e07070}.app-root[data-theme=light] .settings-note--warn{color:#c00}