*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;font-size:16px}body{color:#1a1a1a;background-color:#f8f9fa;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.5;overflow-x:hidden}#app{grid-template:"nav""content"1fr/1fr;width:100%;max-width:2560px;min-height:100vh;margin:0 auto;display:grid}@media (width>=769px){#app{grid-template:"nav content"1fr/220px 1fr}}#nav{background-color:#2c3e50;grid-area:nav;gap:.25rem;padding:1rem;display:flex;overflow-x:auto}#nav a{color:#ecf0f1;white-space:nowrap;border-radius:6px;justify-content:center;align-items:center;min-width:44px;min-height:44px;padding:.75rem 1rem;font-size:.9rem;font-weight:500;text-decoration:none;transition:background-color .2s;display:flex}#nav a:hover,#nav a:focus{background-color:#34495e;outline:none}#nav a:focus-visible{outline-offset:2px;outline:2px solid #3498db}#nav a.active{background-color:#3498db}@media (width<=768px){#nav{flex-direction:column;padding:0;position:relative}.nav-toggle{color:#ecf0f1;cursor:pointer;background:0 0;border:none;justify-content:center;align-self:flex-end;align-items:center;min-width:44px;min-height:44px;padding:.75rem 1rem;font-size:1.5rem;display:flex}.nav-links{flex-direction:column;width:100%;padding:0 .5rem .5rem;display:none}.nav-links--open{display:flex}#nav a{text-align:left;padding:.75rem 1rem;font-size:.9rem}}@media (width>=769px){#nav{flex-direction:column;height:100vh;padding:1.5rem 1rem;position:sticky;top:0;overflow-y:auto}.nav-toggle{display:none}.nav-links{flex-direction:column;gap:.25rem;display:flex}#nav a{justify-content:flex-start;padding:.75rem 1rem}}#content{grid-area:content;width:100%;min-width:0;max-width:100%;padding:1rem;overflow-x:hidden}@media (width>=769px){#content{padding:2rem}}.desktop-only{display:none!important}.mobile-only{display:block}@media (width>=769px){.desktop-only{display:block!important}table.desktop-only{display:table!important}.mobile-only{display:none!important}}.page-heading{margin-bottom:1rem;font-size:1.25rem}.reading-total{color:#2c3e50;background:#eef6fb;border:1px solid #cfe6f5;border-radius:8px;margin-bottom:1rem;padding:.75rem 1rem;font-size:.9rem}.reading-total-note{color:#6c757d;font-size:.85rem}.book-table{border-collapse:collapse;background:#fff;border-radius:8px;width:100%;box-shadow:0 1px 3px #0000001a}.book-table thead tr:first-child th:first-child{border-top-left-radius:8px}.book-table thead tr:first-child th:last-child{border-top-right-radius:8px}.book-table tbody tr:last-child td:first-child{border-bottom-left-radius:8px}.book-table tbody tr:last-child td:last-child{border-bottom-right-radius:8px}.book-table thead{background-color:#f1f3f5}.book-table th,.book-table td{text-align:left;border-bottom:1px solid #e9ecef;padding:.4rem 1rem}.book-table th{text-transform:uppercase;letter-spacing:.03em;color:#495057;font-size:.85rem;font-weight:600}.book-table td{font-size:.9rem}.book-table tbody tr:hover{background-color:#f8f9fa}.book-table tbody tr:last-child td{border-bottom:none}.book-table th button,.book-table th a{cursor:pointer;font:inherit;color:inherit;text-transform:inherit;letter-spacing:inherit;background:0 0;border:none;align-items:center;gap:.25rem;min-width:44px;min-height:44px;padding:.5rem 0;font-weight:600;display:inline-flex}.book-table th button:hover,.book-table th a:hover{color:#3498db}.book-table .row-menu-toggle{min-height:32px}.book-cards{flex-direction:column;gap:.75rem;display:flex}.book-card{background:#fff;border-radius:8px;padding:.75rem 1rem;box-shadow:0 1px 3px #0000001a}.book-card-title{color:#1a1a1a;margin-bottom:.5rem;font-size:1rem;font-weight:600}.book-card-details{grid-template-columns:auto 1fr;gap:.125rem .75rem;font-size:.85rem;display:grid}.book-card-details dt{color:#6c757d;font-weight:500}.book-card-details dd{color:#1a1a1a;margin:0}.book-card a{color:#3498db;min-width:44px;min-height:44px;padding:.5rem 0;font-weight:500;text-decoration:none;display:inline-block}.book-card a:hover{text-decoration:underline}.delete-btn{color:#dc3545;cursor:pointer;background:0 0;border:1px solid #dc3545;border-radius:4px;justify-content:center;align-items:center;min-width:44px;min-height:44px;padding:.25rem .5rem;font-size:.85rem;transition:background-color .2s,color .2s;display:inline-flex}.delete-btn:hover{color:#fff;background-color:#dc3545}.card-delete-btn{width:100%;margin-top:.5rem}.row-actions-cell{text-align:right;white-space:nowrap}.book-card-actions{position:absolute;top:.5rem;right:.5rem}.book-card{position:relative}.row-menu{display:inline-block;position:relative}.row-menu-toggle{cursor:pointer;color:#6c757d;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;min-width:44px;min-height:44px;font-size:1.25rem;line-height:1;transition:background-color .2s,color .2s;display:inline-flex}.row-menu-toggle:hover,.row-menu-toggle[aria-expanded=true]{color:#2c3e50;background-color:#f1f3f5}.row-menu-toggle:focus-visible{outline-offset:2px;outline:2px solid #3498db}.row-menu-dropdown{z-index:20;background:#fff;border:1px solid #e0e0e0;border-radius:8px;flex-direction:column;min-width:140px;padding:.25rem;display:flex;position:absolute;top:calc(100% + 4px);right:0;box-shadow:0 4px 12px #0000001f}.row-menu-dropdown[hidden]{display:none}.row-menu-item{text-align:left;cursor:pointer;font:inherit;color:#1a1a1a;background:0 0;border:none;border-radius:6px;align-items:center;min-height:44px;padding:.625rem .75rem;transition:background-color .2s;display:flex}.row-menu-item:hover,.row-menu-item:focus-visible{background-color:#f1f3f5;outline:none}.row-menu-item-danger{color:#dc3545}.row-menu-item-danger:hover,.row-menu-item-danger:focus-visible{background-color:#fdecea}.filter-controls{min-inline-size:0;border:none;flex-wrap:wrap;align-items:flex-end;gap:.75rem;min-width:0;margin-bottom:1rem;padding:0;display:flex}.filter-controls label{color:#495057;flex-direction:column;gap:.25rem;font-size:.85rem;font-weight:500;display:flex}.filter-controls select,.filter-controls input{background:#fff;border:1px solid #ced4da;border-radius:6px;min-width:44px;min-height:44px;padding:.5rem .75rem;font-size:.9rem}.filter-controls button{cursor:pointer;background:#fff;border:1px solid #ced4da;border-radius:6px;min-width:44px;min-height:44px;padding:.5rem 1rem;font-size:.9rem}.filter-controls button:hover{background-color:#f1f3f5}@media (width<=768px){.filter-controls{flex-direction:column;align-items:stretch}.filter-controls label{width:100%}.filter-controls select,.filter-controls input{width:100%;max-width:100%}.sort-controls-mobile{flex-direction:column}.sort-controls-mobile select{width:100%}}.sort-controls-mobile{flex-wrap:wrap;gap:.5rem;min-width:0;margin-bottom:1rem;display:flex}.sort-controls-mobile select,.sort-controls-mobile button{text-overflow:ellipsis;background:#fff;border:1px solid #ced4da;border-radius:6px;flex:1;min-width:0;min-height:44px;padding:.5rem .75rem;font-size:.9rem;overflow:hidden}.sort-controls-mobile button{cursor:pointer}.sort-controls-mobile button:hover{background-color:#f1f3f5}.pagination-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;margin-top:1.5rem;display:flex}.pagination-controls button{cursor:pointer;background:#fff;border:1px solid #ced4da;border-radius:6px;min-width:44px;min-height:44px;padding:.5rem 1rem;font-size:.9rem;transition:background-color .2s}.pagination-controls button:hover:not(:disabled){background-color:#e9ecef}.pagination-controls button:disabled{opacity:.5;cursor:not-allowed}.pagination-controls button.active{color:#fff;background-color:#3498db;border-color:#3498db}.pagination-controls span{color:#495057;padding:.5rem;font-size:.9rem}.book-form-container{background:#fff;border-radius:8px;max-width:600px;margin:0 auto;padding:1.5rem;box-shadow:0 1px 3px #0000001a}@media (width<=768px){.book-form-container{box-shadow:none;border-radius:0;max-width:100%;padding:1rem}}.form-field{margin-bottom:1.25rem}.form-field label{color:#333;margin-bottom:.375rem;font-size:.9rem;font-weight:500;display:block}.form-field input,.form-field select,.form-field textarea{border:1px solid #ced4da;border-radius:6px;width:100%;min-height:44px;padding:.625rem .75rem;font-size:1rem;transition:border-color .2s,box-shadow .2s}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:#3498db;outline:none;box-shadow:0 0 0 3px #3498db26}.form-field .error-message{color:#dc3545;margin-top:.25rem;font-size:.8rem}.form-field .field-hint{color:#6c757d;margin-top:.25rem;font-size:.8rem;display:block}.auth-switch{text-align:center;color:#495057;margin-top:1.25rem;font-size:.9rem}.auth-switch a{color:#3498db;font-weight:500;text-decoration:none}.auth-switch a:hover{text-decoration:underline}.form-field.has-error input,.form-field.has-error select{border-color:#dc3545}.form-actions{flex-wrap:wrap;gap:.75rem;margin-top:1.5rem;display:flex}@media (width<=768px){.form-actions{flex-direction:column}}.btn-save{color:#fff;cursor:pointer;background-color:#3498db;border:none;border-radius:6px;min-width:44px;min-height:44px;padding:.625rem 1.5rem;font-size:1rem;font-weight:500;transition:background-color .2s}.btn-save:hover{background-color:#2980b9}.btn-save:focus{outline-offset:2px;outline:2px solid #2980b9}.btn-cancel{color:#495057;cursor:pointer;background-color:#fff;border:1px solid #ced4da;border-radius:6px;min-width:44px;min-height:44px;padding:.625rem 1.5rem;font-size:1rem;font-weight:500;transition:background-color .2s,border-color .2s}.btn-cancel:hover{background-color:#f1f3f5;border-color:#adb5bd}.btn-cancel:focus{outline-offset:2px;outline:2px solid #495057}.form-delete-section{border-top:1px solid #e0e0e0;margin-top:1.5rem;padding-top:1.5rem}.btn-delete{color:#fff;cursor:pointer;background-color:#dc3545;border:none;border-radius:6px;min-width:44px;min-height:44px;padding:.625rem 1.25rem;font-size:1rem;font-weight:500;transition:background-color .2s}.btn-delete:hover{background-color:#c82333}.btn-delete:focus{outline-offset:2px;outline:2px solid #c82333}.search-view{max-width:700px;margin:0 auto}.search-view h2{margin-bottom:1rem;font-size:1.25rem}.search-view .search-input-group{gap:.5rem;margin-bottom:1rem;display:flex}.search-view .search-input-group input{border:1px solid #ced4da;border-radius:6px;flex:1;min-height:44px;padding:.625rem .75rem;font-size:1rem}.search-view .search-input-group button{color:#fff;cursor:pointer;background-color:#3498db;border:none;border-radius:6px;min-width:44px;min-height:44px;padding:.625rem 1.25rem;font-size:1rem;font-weight:500}.search-view .search-input-group button:hover{background-color:#2980b9}@media (width<=768px){.search-view .search-input-group{flex-direction:column}}.search-results-list{flex-direction:column;gap:.5rem;list-style:none;display:flex}.search-result-item{background:#fff;border:1px solid #e9ecef;border-radius:8px;justify-content:space-between;align-items:center;gap:1rem;padding:1rem;transition:border-color .2s;display:flex}.search-result-item:hover{border-color:#3498db}.search-result-item .result-info{flex:1;min-width:0}.search-result-item .result-info h4{text-overflow:ellipsis;white-space:nowrap;margin-bottom:.125rem;font-size:.95rem;overflow:hidden}.search-result-item .result-info p{color:#6c757d;font-size:.85rem}.search-result-item button{color:#fff;cursor:pointer;white-space:nowrap;background-color:#27ae60;border:none;border-radius:6px;flex-shrink:0;min-width:44px;min-height:44px;padding:.5rem 1rem;font-size:.85rem;font-weight:500}.search-result-item button:hover{background-color:#219a52}@media (width<=768px){.search-result-item{flex-direction:column;align-items:stretch}.search-result-item button{text-align:center;width:100%}}.summary-filter{flex-direction:column;gap:.25rem;max-width:260px;margin-bottom:.75rem;display:flex}.summary-filter label{color:#495057;font-size:.85rem;font-weight:500}.summary-filter select{background:#fff;border:1px solid #ced4da;border-radius:6px;min-height:44px;padding:.5rem .75rem;font-size:.95rem}.summary-scope{color:#6c757d;margin-bottom:1.25rem;font-size:.85rem}.summary-dashboard{max-width:900px;margin:0 auto}.summary-dashboard h2{margin-bottom:1.5rem;font-size:1.25rem}.summary-stats{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:2rem;display:grid}.stat-item{text-align:center;background:#fff;border-radius:8px;padding:1.25rem;box-shadow:0 1px 3px #0000001a}.stat-item .stat-value{color:#2c3e50;margin-bottom:.25rem;font-size:1.75rem;font-weight:700}.stat-item .stat-label{color:#6c757d;text-transform:uppercase;letter-spacing:.05em;font-size:.8rem}@media (width<=768px){.summary-stats{grid-template-columns:repeat(2,1fr)}}.monthly-table{border-collapse:collapse;background:#fff;border-radius:8px;width:100%;margin-bottom:2rem;overflow:hidden;box-shadow:0 1px 3px #0000001a}.monthly-table th,.monthly-table td{text-align:left;border-bottom:1px solid #e9ecef;padding:.625rem 1rem}.monthly-table th{color:#495057;background-color:#f1f3f5;font-size:.85rem;font-weight:600}.monthly-table td{font-size:.9rem}.ranked-list{background:#fff;border-radius:8px;margin-bottom:1.5rem;padding:1rem 1.25rem;box-shadow:0 1px 3px #0000001a}.ranked-list h3{color:#2c3e50;margin-bottom:.75rem;font-size:1rem}.ranked-list ol{padding-left:1.5rem}.ranked-list li{color:#333;padding:.375rem 0;font-size:.9rem}.ranked-list li span{color:#6c757d;font-size:.8rem}.chart-container{background:#fff;border-radius:8px;margin-bottom:1rem;padding:1rem 1.25rem;overflow:hidden;box-shadow:0 1px 3px #0000001a}.chart{width:100%;height:auto;display:block}.chart-bar{transition:opacity .2s}.chart-bar:hover{opacity:.85}.chart-axis{stroke:#dee2e6;stroke-width:1px}.chart-axis-label{fill:#6c757d;font-size:12px}.chart-bar-value{fill:#495057;font-size:12px;font-weight:600}.chart-hbar-track{fill:#f1f3f5}.chart-hbar{transition:opacity .2s}.chart-hbar:hover{opacity:.85}.chart-hbar-label{fill:#333;font-size:13px}.chart-hbar-value{fill:#495057;font-size:13px;font-weight:600}.chart-donut-wrap{flex-wrap:wrap;align-items:center;gap:1.5rem;display:flex}.chart-donut{flex-shrink:0;width:180px;height:180px}.chart-donut-segment{transition:opacity .2s}.chart-donut-segment:hover{opacity:.85}.chart-donut-total{fill:#2c3e50;font-size:28px;font-weight:700}.chart-donut-total-label{fill:#6c757d;text-transform:uppercase;letter-spacing:.05em;font-size:12px}.chart-legend{flex:1;min-width:180px;list-style:none}.chart-legend-item{color:#333;align-items:center;gap:.5rem;padding:.25rem 0;font-size:.9rem;display:flex}.chart-legend-swatch{border-radius:3px;flex-shrink:0;width:14px;height:14px}.chart-legend-label{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.chart-legend-value{color:#6c757d;white-space:nowrap;font-size:.85rem}@media (width<=768px){.chart-donut-wrap{flex-direction:column;align-items:center}.chart-legend{width:100%}}.import-view{max-width:600px;margin:0 auto}.import-view h2{margin-bottom:1rem;font-size:1.25rem}.import-view .file-upload-area{text-align:center;background:#fff;border:2px dashed #ced4da;border-radius:8px;margin-bottom:1rem;padding:2rem;transition:border-color .2s}.import-view .file-upload-area:hover{border-color:#3498db}.import-view .file-upload-area input[type=file]{cursor:pointer;min-width:44px;min-height:44px}.import-view .file-upload-area p{color:#6c757d;margin-top:.5rem;font-size:.9rem}.import-view button{color:#fff;cursor:pointer;background-color:#3498db;border:none;border-radius:6px;min-width:44px;min-height:44px;padding:.625rem 1.5rem;font-size:1rem;font-weight:500}.import-view button:hover{background-color:#2980b9}.import-view .import-results{background:#fff;border-radius:8px;margin-top:1rem;padding:1.25rem;box-shadow:0 1px 3px #0000001a}.import-view .import-results h3{margin-bottom:.75rem;font-size:1rem}.import-view .import-results .skipped-list{max-height:200px;list-style:none;overflow-y:auto}.import-view .import-results .skipped-list li{color:#6c757d;border-bottom:1px solid #f1f3f5;padding:.375rem 0;font-size:.85rem}.empty-state{text-align:center;color:#6c757d;padding:3rem 1rem}.empty-state p{margin-bottom:1rem;font-size:1rem}.empty-state a{color:#3498db;align-items:center;min-width:44px;min-height:44px;padding:.5rem;font-weight:500;text-decoration:none;display:inline-flex}.empty-state a:hover{text-decoration:underline}.loading{text-align:center;color:#6c757d;padding:2rem;font-size:.95rem}.error{color:#721c24;background-color:#fff5f5;border:1px solid #f5c6cb;border-radius:6px;margin-bottom:1rem;padding:1rem;font-size:.9rem}a{color:#3498db}a:focus-visible{outline-offset:2px;outline:2px solid #3498db}html,body{max-width:100vw;overflow-x:hidden}#app,#nav,#content{transition:grid-template-columns .3s,padding .3s}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
