:root{--bg: #16161a;--surface: #1f1f26;--surface-2: #2a2a33;--text: #e6e6ea;--text-dim: #9a9aa5;--accent: #7c5cff;--danger: #ff5c7c;--safe-top: env(safe-area-inset-top, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overscroll-behavior:none}#root{min-height:100%}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}a{color:var(--accent)}.btn{border:none;border-radius:10px;padding:10px 16px;background:var(--accent);color:#fff;font-weight:600}.btn:disabled{opacity:.6;cursor:default}.library{max-width:1100px;margin:0 auto;padding:calc(16px + var(--safe-top)) calc(16px + var(--safe-right)) 24px calc(16px + var(--safe-left));min-height:100%}.library--dragging{outline:2px dashed var(--accent);outline-offset:-10px}.library__header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.library__title{margin:0;font-size:22px;font-weight:800;letter-spacing:.5px}.library__error{color:var(--danger);margin:0 0 16px}.empty{text-align:center;color:var(--text-dim);padding:72px 16px;line-height:1.6}.grid{display:grid;gap:18px 16px;grid-template-columns:repeat(auto-fill,minmax(132px,1fr))}.card{position:relative;display:flex;flex-direction:column;gap:8px;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.card__cover{border:none;padding:0;width:100%;aspect-ratio:2 / 3;border-radius:10px;overflow:hidden;background:var(--surface-2);display:grid;place-items:center;box-shadow:0 6px 16px #00000059}.card__cover img{width:100%;height:100%;object-fit:cover;display:block}.card__cover-fallback{padding:10px;font-size:13px;font-weight:600;color:var(--text-dim);text-align:center}.card__more{position:absolute;top:6px;right:6px;width:26px;height:26px;border:none;border-radius:50%;background:#0000008c;color:#fff;font-size:18px;line-height:1;display:grid;place-items:center;opacity:0;transition:opacity .15s}.card:hover .card__more,.card:focus-within .card__more{opacity:1}@media(hover:none){.card__more{opacity:1}}.card__menu-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40}.card__menu{position:absolute;top:36px;right:6px;z-index:41;min-width:132px;background:var(--surface);border:1px solid var(--surface-2);border-radius:10px;box-shadow:0 10px 28px #00000073;overflow:hidden;display:flex;flex-direction:column}.card__menu button{border:none;background:transparent;color:var(--text);text-align:left;padding:11px 14px;font-size:15px}.card__menu button:not(:first-child){border-top:1px solid var(--surface-2)}.card__menu button:active{background:var(--surface-2)}.card__menu-danger{color:var(--danger)}.card__meta{cursor:pointer}.card__title{font-size:14px;font-weight:600;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card__author{font-size:12px;color:var(--text-dim);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card__progress{height:4px;border-radius:2px;background:var(--surface-2);overflow:hidden}.card__progress>span{display:block;height:100%;background:var(--accent)}.reader{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg);color:var(--text);overflow:hidden;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;--bar-h: 67px;--progress-h: 0px;--overlayer-highlight-opacity: .2}.reader[data-theme=light]{--bg: #ffffff;--surface: #f4f4f7;--surface-2: #e7e7ee;--text: #1a1a1a;--text-dim: #62626e;--accent: #6b4ce6;--danger: #d23b5c;color-scheme:light}.reader[data-theme=sepia]{--bg: #f4ecd8;--surface: #ecdfc3;--surface-2: #e2d2ae;--text: #5b4636;--text-dim: #7a6450;--accent: #6b4ce6;--danger: #d23b5c;color-scheme:light}.reader[data-theme=dark]{--bg: #16161a;--surface: #1f1f26;--surface-2: #2a2a33;--text: #e6e6ea;--text-dim: #9a9aa5;--accent: #7c5cff;--danger: #ff5c7c;color-scheme:dark}.reader__view{position:absolute;top:0;right:0;bottom:0;left:0}.reader[data-flow=scrolled] .reader__view{top:calc(var(--safe-top) + 6px);bottom:calc(var(--bar-h) + var(--progress-h))}.reader__view foliate-view{display:block;width:100%;height:100%}.tapzone{position:absolute;top:0;bottom:0;z-index:5;border:none;background:transparent;padding:0;-webkit-tap-highlight-color:transparent;outline:none}.tapzone--left{left:0;width:30%}.tapzone--right{right:0;width:30%}.tapzone--center{left:30%;width:40%}.reader__bar{position:absolute;bottom:0;left:0;right:0;z-index:20;display:flex;align-items:center;gap:10px;padding:18px calc(10px + var(--safe-right)) 8px calc(10px + var(--safe-left));background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid color-mix(in srgb,var(--text) 10%,transparent);transition:transform .2s ease,opacity .2s ease}.reader__bar.hidden{transform:translateY(110%);opacity:0;pointer-events:none}.reader__title{flex:1;min-width:0;text-align:center;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.iconbtn{border:none;background:transparent;color:inherit;width:40px;height:40px;border-radius:8px;font-size:20px;display:grid;place-items:center}.iconbtn:active{background:color-mix(in srgb,var(--text) 12%,transparent)}@media(pointer:coarse){.iconbtn{width:44px;height:44px}.reader{--bar-h: 71px}.hl-item__kebab{width:44px}}.panel{position:absolute;z-index:20;bottom:calc(var(--bar-h) + var(--progress-h) + 8px);right:calc(10px + var(--safe-right));left:calc(10px + var(--safe-left));max-width:360px;margin-left:auto;background:var(--surface);color:var(--text);border-radius:14px;padding:12px;box-shadow:0 12px 40px #00000080;display:flex;flex-direction:column;gap:12px;max-height:calc(100% - var(--bar-h) - var(--progress-h) - var(--safe-top) - 28px);overflow-y:auto}.panel__row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px}.seg{display:inline-flex;align-items:center;gap:4px;background:var(--surface-2);border-radius:10px;padding:3px}.seg button{border:none;background:transparent;color:var(--text);border-radius:8px;padding:6px 10px;font-size:13px}.seg button.active{background:var(--accent);color:#fff}.seg__value{min-width:44px;text-align:center;font-size:13px;color:var(--text-dim)}.panel__note{margin:-4px 2px 0;font-size:12px;color:var(--text-dim)}.panel__select{font:inherit;font-size:13px;color:var(--text);background:var(--surface-2);border:none;border-radius:10px;padding:8px 10px;max-width:200px}.seg button:disabled{opacity:.4}button.seg__value{color:var(--text-dim);cursor:pointer}button.seg__value:active{background:color-mix(in srgb,var(--text) 12%,transparent)}.reader__progress{position:absolute;z-index:21;left:0;right:0;bottom:calc(var(--bar-h) - 18px);height:16px;display:flex;align-items:center;gap:8px;pointer-events:none;transition:opacity .2s ease}.reader__progress.hidden{opacity:0}.reader__progress>span{position:absolute;left:0;top:0;height:3px;background:var(--accent);transition:width .2s ease}.reader__progress>em{margin-left:auto;margin-right:calc(10px + var(--safe-right));font-size:11px;font-style:normal;color:var(--text-dim)}.iconbtn--badge{position:relative}.iconbtn__badge{position:absolute;top:2px;right:2px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--accent);color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center}.hl-toolbar{position:absolute;z-index:38;display:flex;gap:8px;padding:8px 10px;background:var(--surface);border-radius:12px;box-shadow:0 10px 30px #00000080;transform:translate(-50%,calc(-100% - 10px))}.hl-toolbar.flip{transform:translate(-50%,10px)}.hl-swatch{width:28px;height:28px;border:2px solid color-mix(in srgb,var(--text) 18%,transparent);border-radius:50%;padding:0}.hl-swatch:active{transform:scale(.92)}.hl-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:36}.hl-popup{position:absolute;z-index:38;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;max-width:min(330px,calc(100vw - 20px));padding:6px 8px;background:var(--surface);border-radius:12px;box-shadow:0 10px 30px #00000080;transform:translate(-50%,calc(-100% - 10px))}.hl-popup.flip{transform:translate(-50%,10px)}.hl-palette{display:flex;gap:6px}.hl-recolor{width:24px;height:24px;border:2px solid color-mix(in srgb,var(--text) 18%,transparent);border-radius:50%;padding:0}.hl-recolor:active{transform:scale(.92)}.hl-recolor.active{border-color:var(--surface);box-shadow:0 0 0 2px var(--text)}.hl-popup__note,.hl-popup__del{border:none;background:transparent;font-size:14px;font-weight:600;padding:4px 6px;border-radius:8px}.hl-popup__note{color:var(--text)}.hl-popup__note:active{background:color-mix(in srgb,var(--text) 12%,transparent)}.hl-popup__del{color:var(--danger)}.hl-popup__del:active{background:color-mix(in srgb,var(--danger) 18%,transparent)}.hl-drawer-wrap{position:absolute;top:0;left:0;right:0;bottom:var(--bar-h);z-index:40;background:#0006;display:flex;align-items:flex-end}.hl-drawer{width:100%;max-height:70%;display:flex;flex-direction:column;background:var(--surface);color:var(--text);border-radius:16px 16px 0 0;padding:8px 0;box-shadow:0 -10px 40px #00000080}.hl-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:8px 8px 8px 16px;font-size:15px;font-weight:700}.hl-drawer__head-actions{display:flex;align-items:center;gap:2px}.hl-export{position:relative}.hl-export__menu{position:absolute;z-index:2;top:calc(100% + 4px);right:0;min-width:132px;display:flex;flex-direction:column;background:var(--surface-2);border-radius:10px;padding:4px;box-shadow:0 10px 30px #00000080}.hl-export__menu button{border:none;background:transparent;color:var(--text);text-align:left;font:inherit;font-size:14px;font-weight:500;padding:10px 12px;border-radius:8px}.hl-export__menu button:active{background:color-mix(in srgb,var(--text) 10%,transparent)}.hl-drawer__empty{color:var(--text-dim);text-align:center;padding:24px 24px 32px;margin:0;line-height:1.5}.hl-filter{display:flex;align-items:center;gap:8px;padding:4px 16px 10px}.hl-filter__all{border:none;background:var(--surface-2);color:var(--text-dim);border-radius:999px;padding:5px 12px;font-size:12px;font-weight:700}.hl-filter__all.active{background:var(--accent);color:#fff}.hl-filter__dot{width:28px;height:28px;display:grid;place-items:center;border:none;background:transparent;border-radius:50%;padding:0}.hl-filter__swatch{width:20px;height:20px;border-radius:50%;border:2px solid color-mix(in srgb,var(--text) 18%,transparent)}.hl-filter__dot:active{transform:scale(.92)}.hl-filter__dot.active .hl-filter__swatch{border-color:var(--surface);box-shadow:0 0 0 2px var(--text)}.hl-list{margin:0;padding:0 8px 8px;overflow-y:auto}.toc-list{list-style:none;margin:0;padding:0 8px 8px;overflow-y:auto}.toc-item{display:block;width:100%;text-align:left;border:none;background:transparent;color:var(--text);font-size:14px;line-height:1.35;padding:10px 14px;border-radius:10px;cursor:pointer}.toc-item:active{background:color-mix(in srgb,var(--text) 8%,transparent)}.toc-item.active{color:var(--accent);font-weight:600}.toc-item--dead{color:var(--text-dim);cursor:default}.hl-group__items{list-style:none;margin:0;padding:0}.hl-group__head{position:sticky;top:0;z-index:1;margin:0;padding:10px 8px 4px;background:var(--surface);color:var(--text-dim);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.hl-item{position:relative;overflow:hidden;border-radius:10px;--tray-w: 128px}.hl-item__row{position:relative;z-index:1;display:flex;align-items:stretch;gap:4px;background:var(--surface);border-radius:10px;transform:translate(0);transition:transform .18s ease;touch-action:pan-y}.hl-item.open>.hl-item__row{transform:translate(calc(-1 * var(--tray-w)))}.hl-item.dragging>.hl-item__row{transition:none}.hl-item__row:active{background:color-mix(in srgb,var(--text) 8%,var(--surface))}.hl-item__actions{position:absolute;top:0;right:0;bottom:0;width:var(--tray-w);display:flex;align-items:stretch;visibility:hidden}.hl-item.open>.hl-item__actions,.hl-item.dragging>.hl-item__actions{visibility:visible}.hl-item__main{flex:1;min-width:0;display:flex;align-items:flex-start;gap:10px;border:none;background:transparent;color:inherit;text-align:left;padding:12px 6px 12px 8px}.hl-item__dot{flex:none;width:12px;height:12px;margin-top:3px;border-radius:50%}.hl-item__body{min-width:0;display:flex;flex-direction:column;gap:4px}.hl-item__text{font-size:14px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.hl-item__note{font-size:13px;line-height:1.4;color:var(--text-dim);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.hl-item__kebab{flex:none;width:40px;border:none;background:transparent;color:var(--text-dim);display:grid;place-items:center;border-radius:10px}.hl-item__kebab:active{background:color-mix(in srgb,var(--text) 12%,transparent)}.hl-item__note-btn,.hl-item__del{flex:1;border:none;color:#fff;display:grid;place-items:center}.hl-item__note-btn{background:var(--accent)}.hl-item__del{background:var(--danger);border-radius:0 10px 10px 0}.hl-item__note-btn:active,.hl-item__del:active{filter:brightness(.85)}.note-modal{position:absolute;top:0;right:0;bottom:0;left:0;z-index:42;background:#00000080;display:flex;align-items:center;justify-content:center;padding:24px}@media(hover:none){.note-modal{align-items:flex-start;padding-top:max(48px,10vh)}}.note-editor{width:100%;max-width:420px;background:var(--surface);color:var(--text);border-radius:16px;padding:16px;box-shadow:0 12px 40px #0000008c;display:flex;flex-direction:column;gap:12px}.note-editor__quote{display:flex;align-items:flex-start;gap:8px;margin:0;font-size:13px;line-height:1.4;color:var(--text-dim)}.note-editor__quote-text{min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.note-editor__dot{flex:none;width:12px;height:12px;margin-top:3px;border-radius:50%}.note-editor__palette{padding:2px 0}.note-editor__input{width:100%;resize:vertical;min-height:88px;border:1px solid color-mix(in srgb,var(--text) 16%,transparent);border-radius:10px;background:var(--surface-2);color:var(--text);padding:10px;font:inherit;font-size:16px;line-height:1.4;-webkit-user-select:text;user-select:text}.note-editor__input:focus{outline:2px solid var(--accent);outline-offset:0}.note-editor__actions{display:flex;justify-content:flex-end;gap:8px}.btn--ghost{background:var(--surface-2);color:var(--text)}.btn--ghost:active{background:color-mix(in srgb,var(--text) 14%,transparent)}.reader__overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-content:center;gap:16px;text-align:center;background:var(--bg);color:var(--text);padding:24px}.reader__overlay--msg{color:var(--text-dim)}.spinner{width:34px;height:34px;border-radius:50%;border:3px solid color-mix(in srgb,var(--text) 20%,transparent);border-top-color:var(--accent);animation:spin .8s linear infinite;margin:0 auto}@keyframes spin{to{transform:rotate(360deg)}}.update-toast{position:fixed;z-index:50;top:calc(var(--safe-top) + 12px);left:50%;transform:translate(-50%);max-width:min(420px,calc(100vw - 24px));display:flex;align-items:center;gap:8px;padding:8px 8px 8px 16px;background:var(--surface-2);color:var(--text);border-radius:12px;box-shadow:0 10px 30px #00000080}.update-toast__msg{font-size:14px;font-weight:500;white-space:nowrap}.update-toast__reload{border:none;border-radius:8px;padding:8px 14px;background:var(--accent);color:#fff;font-size:14px;font-weight:600}.update-toast__reload:active{filter:brightness(.92)}.update-toast__dismiss{border:none;background:transparent;color:var(--text-dim);font-size:20px;line-height:1;padding:6px 10px;border-radius:8px}.update-toast__dismiss:active{background:color-mix(in srgb,var(--text) 10%,transparent)}.library__actions{display:flex;align-items:center;gap:8px}.account{max-width:560px;margin:0 auto;padding:calc(16px + var(--safe-top)) calc(16px + var(--safe-right)) 24px calc(16px + var(--safe-left));min-height:100%}.account__header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.account__title{margin:0;font-size:22px;font-weight:800;letter-spacing:.5px}.account__panel{background:var(--surface);border-radius:14px;padding:18px}.account__note{margin:0 0 16px;color:var(--text-dim);line-height:1.6}.account__note code{color:var(--text);font-size:.92em}.account__creds{list-style:none;margin:0 0 16px;padding:0;color:var(--text)}.account__creds li{padding:8px 0;border-top:1px solid var(--surface-2)}.account__creds li:first-child{border-top:none}.account__dim{color:var(--text-dim);font-size:.88em}.account__actions{display:flex;flex-wrap:wrap;gap:8px}.account__token{margin-top:12px;width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--surface-2);border-radius:10px;background:var(--bg);color:var(--text);font-size:16px}.account__hint{margin:8px 0 0;color:var(--text-dim);font-size:.85em;line-height:1.5}