:root{--bg: #0f1115;--panel: #171a21;--panel-2: #1f232d;--border: #2a2f3a;--text: #e6e8ee;--muted: #9aa3b2;--accent: #e0a458;--accent-soft: rgba(224, 164, 88, .16);--danger: #e2685f}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}button{font:inherit}.upload-screen{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(1000px 500px at 50% -10%,rgba(224,164,88,.08),transparent 60%),var(--bg)}.upload-card{width:100%;max-width:540px;background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:40px 36px;text-align:center;box-shadow:0 24px 60px #00000073}.upload-logo{color:var(--accent);display:flex;justify-content:center;margin-bottom:8px}.upload-card h1{margin:4px 0 6px;font-size:28px;letter-spacing:.3px}.upload-subtitle{margin:0 0 26px;color:var(--muted)}.dropzone{border:2px dashed var(--border);border-radius:14px;padding:40px 20px;cursor:pointer;color:var(--muted);transition:border-color .15s ease,background .15s ease,color .15s ease}.dropzone svg{margin-bottom:10px;opacity:.8}.dropzone p{margin:0}.dropzone strong{color:var(--text)}.dropzone:hover,.dropzone.dragover{border-color:var(--accent);background:var(--accent-soft);color:var(--text)}.upload-error{margin:14px 0 0;color:var(--danger)}.upload-features{margin-top:26px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.upload-features span{font-size:12.5px;color:var(--muted);background:var(--panel-2);border:1px solid var(--border);border-radius:999px;padding:5px 12px}.reader-status{height:100vh;height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:var(--muted);padding:24px;text-align:center}.spinner{width:38px;height:38px;border-radius:50%;border:3px solid var(--border);border-top-color:var(--accent);animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.reader{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}.toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;padding:8px 12px;background:#171a21eb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);position:relative;z-index:10}.toolbar-group{display:flex;align-items:center;gap:8px;min-width:0}.toolbar-title{color:var(--muted);font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}.tb-btn{background:var(--panel-2);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:6px 11px;cursor:pointer;white-space:nowrap;transition:border-color .15s ease,background .15s ease}.tb-btn:hover{border-color:var(--accent)}.tb-btn.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}.tb-zoom{min-width:58px;text-align:center}.tb-select{background:var(--panel-2);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:6px 8px;cursor:pointer}.toolbar-nav{gap:6px}.goto-form{display:flex;align-items:center;gap:6px}.goto-form input{width:62px;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:6px 8px;text-align:center}.goto-form input:focus{outline:none;border-color:var(--accent)}.goto-total{color:var(--muted);font-size:13.5px}.spread-label{color:var(--muted);font-size:13px;white-space:nowrap;margin-left:6px}.reader-body{flex:1;display:flex;min-height:0}.thumbs-panel{width:184px;flex-shrink:0;overflow-y:auto;padding:14px 12px;display:flex;flex-direction:column;gap:14px;background:var(--panel);border-right:1px solid var(--border)}.thumb{background:transparent;border:none;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--muted)}.thumb-img{display:block;width:140px;min-height:96px;border-radius:6px;overflow:hidden;box-shadow:0 2px 10px #0006;outline:2px solid transparent;outline-offset:2px;transition:outline-color .15s ease}.thumb:hover .thumb-img{outline-color:var(--border)}.thumb.active .thumb-img{outline-color:var(--accent)}.thumb.active .thumb-num{color:var(--accent)}.thumb canvas{display:block;width:100%;height:auto;background:#fff}.thumb-skeleton{display:block;width:140px;height:190px;background:var(--panel-2)}.thumb-num{font-size:12.5px}.book-area{flex:1;min-width:0;overflow:auto;display:flex;background:radial-gradient(1200px 600px at 50% 0%,rgba(255,255,255,.03),transparent 55%),var(--bg)}.book-scroll{margin:auto;display:flex;align-items:center;justify-content:center}.book{filter:drop-shadow(0 18px 34px rgba(0,0,0,.5))}.page{background:#fff;overflow:hidden}.page-canvas{display:block;width:100%;height:100%}.page-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#fbfbf9;color:#c8c8c2;font-size:22px;-webkit-user-select:none;user-select:none}.book-area::-webkit-scrollbar,.thumbs-panel::-webkit-scrollbar{width:10px;height:10px}.book-area::-webkit-scrollbar-thumb,.thumbs-panel::-webkit-scrollbar-thumb{background:var(--border);border-radius:6px;border:2px solid var(--bg)}.book-area::-webkit-scrollbar-track,.thumbs-panel::-webkit-scrollbar-track{background:transparent}@media (max-width: 720px){.toolbar-title{display:none}.tb-select{max-width:132px}.thumbs-panel{position:absolute;z-index:20;top:0;bottom:0;left:0;box-shadow:8px 0 24px #00000080}}
