:root{font-family:Segoe UI,system-ui,sans-serif;color:#0f172a;background-color:#f8fafc}*{box-sizing:border-box}body{margin:0}a{color:inherit}.app-shell{width:min(96vw,1400px);margin:24px auto;padding:0 16px}.topbar{position:sticky;top:0;left:auto;transform:none;width:auto;z-index:100;padding:10px 16px 8px;background:#f8fafc;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}.brand{display:inline-flex;align-items:center;text-decoration:none;font-weight:700}.brand-logo{width:82px;height:82px;object-fit:contain;margin-left:-12px}.nav-links{display:flex;gap:12px}.nav-links a{text-decoration:none;padding:4px 8px;border-radius:8px;transition:background-color .15s ease,color .15s ease;letter-spacing:.5px}.nav-links a:hover{color:#fff;background:#000000c7}.nav-links a.active{background:#e2e8f0}.auth-chip{display:flex;gap:8px;align-items:center}.welcome-chip{display:grid;gap:1px;line-height:1.1}.welcome-label{font-family:Brush Script MT,Lucida Handwriting,cursive;font-size:16px;font-weight:700;font-style:italic}.page{display:grid;gap:16px}.card{background:#fff;border:1px solid #cbd5e1;border-radius:10px;padding:16px}input{width:100%;margin-bottom:8px;border:1px solid #cbd5e1;border-radius:8px;padding:10px}textarea{width:100%;border:1px solid #cbd5e1;border-radius:8px;padding:10px;resize:vertical}input[type=color]{width:46px;height:34px;padding:2px;margin:0;border-radius:8px}select{border:1px solid #cbd5e1;border-radius:8px;padding:10px;background:#fff}.row{display:flex;gap:8px;flex-wrap:wrap}.checkbox-row label{display:inline-flex;align-items:center;gap:6px}button{border:0;border-radius:8px;padding:10px 14px;background:#0f172a;color:#fff;cursor:pointer;letter-spacing:1px}.button-link{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:8px;padding:10px 14px;background:#0f172a;color:#fff;text-decoration:none}button:disabled{opacity:.5;cursor:not-allowed}pre{background:#f1f5f9;border-radius:8px;padding:10px;overflow:auto}.message{margin:8px 0 0;font-weight:600}.auth-card{max-width:560px;width:100%}.auth-page-center{min-height:72vh;display:grid;place-items:center}.auth-toggle{display:inline-grid;grid-auto-flow:column;gap:6px;background:#f1f5f9;border-radius:10px;padding:4px;margin-bottom:12px}.auth-toggle button{background:transparent;color:#0f172a;letter-spacing:.3px}.auth-toggle button.active{background:#0f172a;color:#fff}.auth-form{display:grid;gap:8px}.password-field{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.password-field input{margin-bottom:0}.ghost-btn{background:#e2e8f0;color:#0f172a;letter-spacing:.3px}.book-list{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:10px}.dashboard-grid-secondary{grid-template-columns:repeat(3,minmax(0,1fr))}.dashboard-shell,.page-shell{border:1px solid #000000}.dashboard-stat,.dashboard-panel{border:1px solid #000000;border-radius:10px;padding:12px;background:#fff}.dashboard-stat:hover{background:#000;color:#f8fafc}.dashboard-stat h3,.dashboard-panel h3{margin:0 0 8px;font-size:14px}.dashboard-value{margin:0;font-size:28px;font-weight:700}.dashboard-last-book-cover{width:250px;height:274px;object-fit:cover;border:1px solid #cbd5e1;border-radius:6px;background:#f8fafc;margin:4px 0}.dashboard-author-name{font-weight:700;font-style:italic}.dashboard-last-opened{font-style:italic}.books-search-bar{display:grid;grid-template-columns:minmax(260px,1fr) 220px auto;gap:8px;align-items:center}.books-search-input{margin-bottom:0}.books-genre-select{width:100%}.books-page-controls{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin:10px 0}.books-limit-control{display:inline-flex;align-items:center;gap:8px}.books-page-controls-bottom{margin-top:14px}.book-item{border:1px solid #e2e8f0;border-radius:10px;padding:12px;display:grid;gap:10px;grid-template-columns:188px 1fr auto;background:#fff;transition:transform .18s ease,box-shadow .18s ease}.book-item:hover{transform:translateY(-6px);box-shadow:0 16px 28px #0f172a33}.book-cover-wrap{position:relative;width:172px;height:248px}.book-cover-wrap:before{content:"";position:absolute;left:-7px;top:6px;width:8px;height:236px;border-radius:4px 0 0 4px;background:linear-gradient(180deg,#475569,#1e293b)}.book-cover{width:172px;height:248px;object-fit:cover;border-radius:4px;border:1px solid #cbd5e1;box-shadow:0 8px 20px #0f172a33;background:#f8fafc}.book-cover-fallback{display:grid;place-items:center;padding:8px;text-align:center;font-size:12px;font-weight:600;color:#334155;background:linear-gradient(180deg,#e2e8f0,#cbd5e1)}.book-meta{align-self:start}.book-meta-links{margin-top:8px}.book-meta-links a{border:1px solid #cbd5e1;border-radius:999px;padding:4px 10px;text-decoration:none;transition:background-color .16s ease,color .16s ease,border-color .16s ease}.book-meta-links a:hover{background:#000;color:#fff;border-color:#000}.book-item p{margin:4px 0}.links{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.book-actions{align-self:end;justify-self:end}.book-actions button{white-space:nowrap}.add-library-btn{position:relative;overflow:visible;min-width:142px;display:inline-flex;align-items:center;justify-content:center}.add-library-btn-label{position:relative;z-index:2}.add-library-stars{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1}.add-library-star{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.4);opacity:0;color:#000;font-size:16px;line-height:1;text-shadow:0 0 4px rgba(0,0,0,.25)}.add-library-star:before{content:"✦"}.add-library-btn.star-burst{animation:addLibraryPop .45s cubic-bezier(.22,1,.36,1)}.add-library-btn.star-burst .add-library-star{animation:addLibraryStarFly .76s cubic-bezier(.2,.9,.2,1) forwards}.add-library-btn.star-burst .add-library-star:nth-child(1){--tx: -56px;--ty: -28px;animation-delay:0ms}.add-library-btn.star-burst .add-library-star:nth-child(2){--tx: -8px;--ty: -44px;animation-delay:30ms}.add-library-btn.star-burst .add-library-star:nth-child(3){--tx: 44px;--ty: -30px;animation-delay:55ms}.add-library-btn.star-burst .add-library-star:nth-child(4){--tx: 58px;--ty: 8px;animation-delay:75ms}.add-library-btn.star-burst .add-library-star:nth-child(5){--tx: 40px;--ty: 34px;animation-delay:95ms}.add-library-btn.star-burst .add-library-star:nth-child(6){--tx: -6px;--ty: 44px;animation-delay:115ms}.add-library-btn.star-burst .add-library-star:nth-child(7){--tx: -46px;--ty: 32px;animation-delay:.14s}.add-library-btn.star-burst .add-library-star:nth-child(8){--tx: -60px;--ty: 4px;animation-delay:165ms}@keyframes addLibraryPop{0%{transform:scale(1)}32%{transform:scale(.92)}70%{transform:scale(1.06)}to{transform:scale(1)}}@keyframes addLibraryStarFly{0%{opacity:0;transform:translate(-50%,-50%) scale(.35) rotate(0)}18%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(1.15) rotate(28deg)}}.add-library-btn.star-burst:after{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:10px;border:1px solid rgba(255,255,255,.9);animation:addLibraryRing .52s ease-out forwards;pointer-events:none;z-index:0}.add-library-btn.star-burst:disabled{opacity:1}@keyframes addLibraryRing{0%{opacity:.7;transform:scale(.85)}to{opacity:0;transform:scale(1.18)}}.library-list{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:10px}.library-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.library-search-input{width:min(420px,100%);margin-bottom:0}.library-item{border:1px solid #e2e8f0;border-radius:10px;padding:10px;display:grid;grid-template-columns:72px 1fr auto;align-items:center;gap:10px}.library-cover{width:64px;height:92px;object-fit:cover;border-radius:4px;border:1px solid #cbd5e1;background:#f8fafc}.library-cover-fallback{display:grid;place-items:center;font-size:11px;color:#475569}.library-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:flex-end;align-self:center;justify-self:end}.library-read-btn{position:relative;min-width:92px;min-height:40px;overflow:hidden}.library-read-btn-text{transition:opacity .32s cubic-bezier(.22,1,.36,1),transform .32s cubic-bezier(.22,1,.36,1);transform:translateY(0)}.library-read-btn-icon{position:absolute;width:80px;max-width:calc(100% - 10px);height:auto;opacity:0;transform:translateY(6px) scale(.96);transition:opacity .32s cubic-bezier(.22,1,.36,1),transform .32s cubic-bezier(.22,1,.36,1)}.library-read-btn:hover{background:#fff}.library-read-btn:hover .library-read-btn-text{opacity:0;transform:translateY(-6px)}.library-read-btn:hover .library-read-btn-icon{opacity:1;transform:translateY(0) scale(1)}.library-remove-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:#000;color:#fff;border:1px solid #000000}.library-remove-btn svg{width:18px;height:18px}.reader-card{min-height:70vh}.reader-header{display:flex;justify-content:space-between;align-items:start;gap:12px}.reader-controls{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin:8px 0 10px}.reader-control{display:grid;gap:4px;min-width:140px}.reader-control-wide{min-width:260px}.reader-page-controls{display:inline-flex;align-items:center;gap:8px;margin-left:auto}.selection-bar-inline{margin:0 0 0 auto;min-width:420px;max-width:100%}.selection-bar-above-controls{margin:8px 0 12px}.selection-bar-inline .annotation-default-colors{justify-content:flex-start}.reader-frame{width:100%;min-height:70vh;border:1px solid #cbd5e1;border-radius:10px;background:#fff}.reader-frame-paged{overflow:hidden}.reader-text{min-height:70vh;white-space:pre-wrap;line-height:1.6;background:#fff;border:1px solid #cbd5e1;padding:12px}.reader-text-paged{overflow-x:auto;overflow-y:hidden;column-width:80ch;column-gap:48px;column-fill:auto;white-space:normal;scroll-behavior:smooth}.reader-annotation-layout{display:grid;grid-template-columns:1fr 320px;gap:12px;align-items:start}.selection-bar{border:1px solid #cbd5e1;border-radius:10px;padding:14px;margin-bottom:10px;display:grid;gap:14px}.selection-bar .row{gap:12px}.annotation-action-columns{display:flex;gap:22px;flex-wrap:wrap}.annotation-action-block{display:grid;gap:8px}.annotation-action-btn{transition:transform .18s ease,box-shadow .18s ease}.annotation-action-btn:hover{transform:translateY(-3px);box-shadow:0 10px 18px #0f172a3d}.annotation-action-color{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:#475569}.annotation{border-radius:4px;padding:1px 2px}.annotation-note{box-shadow:inset 0 -2px #1e40af80}.annotation-sticker{box-shadow:inset 0 -2px #991b1b73}.annotation-panel{border:1px solid #cbd5e1;border-radius:10px;padding:10px;background:#fff;max-height:80vh;overflow:auto}.annotation-panel ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}.annotation-panel li{border:1px solid #e2e8f0;border-radius:8px;padding:8px}.annotation-panel p{margin:4px 0}.sticker-thumb{width:36px;height:36px;object-fit:contain;border-radius:6px;border:1px solid #e2e8f0;background:#fff}.notes-table-wrap{margin-top:14px}.annotation-mini-item{border:1px solid #e2e8f0;border-radius:8px;margin-bottom:8px;background:#f8fafc}.annotation-jump-link{width:100%;border:0;background:transparent;text-align:left;color:#0f172a;cursor:pointer;padding:8px;border-radius:6px}.annotation-jump-link:hover{text-decoration:none;background:#000;color:#fefafc}.annotation-view-all-wrap{margin-top:8px;display:flex;justify-content:flex-end}.annotation-view-all-btn{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border:1px solid #000000;border-radius:8px;background:#fefafc;color:#000;text-decoration:none;transition:background-color .14s ease,color .14s ease}.annotation-view-all-btn:hover{background:#000;color:#fefafc}.dashboard-panel .annotation-mini-item:hover{background:#000;color:#f8fafc}.dashboard-cta-wrap{margin-top:8px;display:flex;justify-content:flex-end}.dashboard-panel-bottom-cta{display:flex;flex-direction:column}.dashboard-panel-bottom-cta .dashboard-cta-wrap{margin-top:auto}.dashboard-cta{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:8px;border:1px solid #000000;background:#e2e8f0;color:#0f172a;text-decoration:none;transition:background-color .16s ease,color .16s ease}.dashboard-cta:hover{background:#000;color:#f8fafc}.notes-table{width:100%;border-collapse:collapse;font-size:12px;margin:20px 0 8px;border-radius:10px;overflow:hidden}.notes-table th,.notes-table td{border:1px solid #e2e8f0;padding:6px;text-align:left;vertical-align:top}.notes-table th{background:#000;color:#fff;border-color:#000}.notes-table td{border-color:#000}.notes-table tbody tr:hover{background:#f1f5f9}.notes-actions-head{text-align:right}.notes-actions-cell{white-space:nowrap;text-align:right}.notes-action-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;margin-left:6px;border-radius:8px;background:transparent;color:#000;border:1px solid #000000;transition:transform .16s ease,box-shadow .16s ease}.notes-action-btn svg{width:16px;height:16px}.notes-action-btn-danger{background:transparent;color:#000;border:1px solid #000000}.notes-action-btn:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0f172a33}.annotation-color-control{display:inline-grid;gap:4px;font-size:12px;color:#475569}.reader-note{color:#475569;margin:6px 0 0}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a73;display:grid;place-items:center;z-index:1000;padding:16px}.modal-card{width:min(560px,94vw);background:#fff;border:1px solid #cbd5e1;border-radius:12px;padding:16px;display:grid;gap:10px}.modal-card-confirm{width:min(420px,92vw);background:#fff;border:1px solid #000000}.sticker-modal{width:min(720px,96vw)}.sticker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;max-height:320px;overflow:auto}.sticker-item-btn{display:grid;gap:6px;justify-items:center;padding:10px;background:#fff;color:#0f172a;border:1px solid #cbd5e1}.sticker-item-btn:hover{background:#f8fafc}.confirm-delete-btn{background:#000;color:#fff;border:1px solid #000000;transition:transform .16s ease,box-shadow .16s ease}.cancel-delete-btn{background:#fff;color:#000;border:1px solid #000000;transition:transform .16s ease,box-shadow .16s ease}.confirm-delete-btn:hover,.cancel-delete-btn:hover{transform:translateY(-2px);box-shadow:0 8px 14px #0f172a33}@media(max-width:980px){.book-list,.dashboard-grid,.dashboard-grid-secondary,.books-search-bar{grid-template-columns:1fr}.books-page-controls{justify-content:flex-start;flex-wrap:wrap}.book-item{grid-template-columns:188px 1fr}.book-actions{grid-column:2;justify-self:start}.reader-annotation-layout{grid-template-columns:1fr}.library-search-input{width:100%}.reader-controls{align-items:stretch}.reader-control,.reader-control-wide{min-width:100%}.reader-page-controls{margin-left:0;flex-wrap:wrap}.selection-bar-inline{margin-left:0;min-width:100%}}