:root{--color-white:#fff;--color-gray-50:#f9fafb;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-300:#d1d5db;--color-gray-400:#9ca3af;--color-gray-500:#6b7280;--color-gray-600:#4b5563;--color-gray-700:#374151;--color-gray-800:#1f2937;--color-gray-900:#111827;--color-black:#000;--color-reading:#ef476f;--color-read:#00a896;--color-want:#f59e0b;--color-red-50:#fef2f2;--color-red-100:#fee2e2;--color-red-600:#dc2626;--color-primary:#2563eb;--color-danger:#ef4444;--color-success:#10b981;--color-warning:#f59e0b;--font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;--font-size-xs:12px;--font-size-sm:14px;--font-size-base:16px;--font-size-lg:18px;--font-size-xl:20px;--font-size-2xl:24px;--font-size-3xl:30px;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:12px;--spacing-lg:16px;--spacing-xl:20px;--spacing-2xl:24px;--spacing-3xl:32px;--border-radius-sm:4px;--border-radius-md:12px;--border-radius-lg:16px;--border-radius-full:9999px;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px #0000001a;--shadow-lg:0 10px 15px #0000001a}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--color-gray-50);color:var(--color-gray-700);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}#root{flex-direction:column;min-height:100vh;display:flex}.btn{padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;text-align:center;border:none;justify-content:center;align-items:center;transition:all .2s;display:inline-flex}.tag{background:linear-gradient(135deg, var(--color-gray-50) 0%, var(--color-gray-100) 100%);border:1px solid var(--color-gray-200);border-radius:var(--border-radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-gray-700);-webkit-user-select:none;user-select:none;align-items:center;gap:2px;padding:2px 6px;display:inline-flex}.editable-tag{padding-right:20px;position:relative}.remove-tag-btn{color:var(--color-gray-400);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:16px;height:16px;padding:0;font-size:14px;line-height:1;transition:all .2s;display:inline-flex;position:absolute;top:50%;right:4px;transform:translateY(-50%)}.remove-tag-btn:hover{color:var(--color-gray-600);background-color:#0000000d}.star{justify-content:center;align-items:center;font-family:Segoe UI Emoji,Apple Color Emoji,Noto Color Emoji,sans-serif;font-size:14px;line-height:1;transition:transform .1s;display:inline-flex}.star.filled{filter:drop-shadow(0 1px 2px #ffb8004d)}.rating,.rating-input{align-items:center;gap:6px;display:flex}.rating-input .star{cursor:pointer}.rating-input .star:hover{transform:scale(1.2)}.save-btn,.save-edit-btn,.edit-confirm-btn{color:var(--color-white);border-radius:var(--border-radius-md);cursor:pointer;justify-content:center;align-items:center;gap:var(--spacing-xs);box-sizing:border-box;background-color:#1f2937;border:1px solid #1f2937;min-height:34px;padding:8px 20px;font-size:14px;font-weight:500;transition:all .2s;display:inline-flex}.save-btn:hover,.save-edit-btn:hover,.edit-confirm-btn:hover{background-color:#1f2937;border-color:#1f2937}.save-btn:active,.edit-confirm-btn:active{transform:translateY(0)}.save-btn svg{width:16px;height:16px}.cancel-edit-btn,.edit-cancel-btn{background-color:var(--color-white);color:var(--color-gray-600);border:1px solid var(--color-gray-300);border-radius:var(--border-radius-md);cursor:pointer;justify-content:center;align-items:center;gap:var(--spacing-xs);box-sizing:border-box;min-height:34px;padding:8px 20px;font-size:14px;font-weight:500;transition:all .2s;display:inline-flex}.cancel-edit-btn:hover,.edit-cancel-btn:hover{background-color:var(--color-gray-50);border-color:var(--color-gray-400)}.btn-danger{background-color:var(--color-danger);color:var(--color-white)}.btn-danger:hover{background-color:#dc2626}input,textarea,select{padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-gray-300);border-radius:var(--border-radius-md);font-size:var(--font-size-sm);font-family:var(--font-family);background-color:var(--color-white);color:var(--color-gray-800);box-sizing:border-box;line-height:1.5;transition:border-color .2s}input:focus,textarea:focus,select:focus{border-color:var(--color-primary);outline:none}input:hover,textarea:hover,select:hover{border-color:var(--color-gray-400)}@media (width<=768px){:root{--font-size-base:14px;--spacing-compact-xs:2px;--spacing-compact-sm:4px;--spacing-compact-md:6px;--spacing-compact-lg:8px}.rating,.rating-input,.novel-rating{gap:4px}}.app{background-color:var(--color-gray-50);height:100vh;font-family:var(--font-family);cursor:default;-webkit-user-select:none;user-select:none;display:flex;position:relative;overflow:hidden}.sidebar-overlay{z-index:1000;background-color:#00000080;display:none;position:fixed;inset:0}.hamburger-menu{color:var(--color-gray-600);cursor:pointer;padding:var(--spacing-sm);border-radius:var(--border-radius-md);background:0 0;border:none;justify-content:center;align-items:center;transition:all .2s;display:none}.hamburger-menu:hover{background-color:var(--color-gray-100);color:var(--color-gray-800)}.sidebar{background-color:var(--color-white);border-right:1px solid var(--color-gray-200);padding:20px var(--spacing-xl) 4px var(--spacing-xl);flex-direction:column;flex-shrink:0;width:250px;display:flex;overflow:hidden}.sidebar-header{justify-content:space-between;align-items:flex-start;gap:var(--spacing-md);height:auto;min-height:50px;margin-bottom:var(--spacing-md);flex-shrink:0;display:flex}.sidebar-title{flex-direction:column;align-items:flex-start;margin:0;line-height:1;display:flex}.sidebar-title .title-small,.sidebar-title .title-large{font-size:32px;font-weight:var(--font-weight-bold);color:var(--color-gray-800);font-family:var(--font-family);letter-spacing:-.5px;line-height:1}.sidebar-auth{flex-direction:column;flex-shrink:0;justify-content:flex-start;align-items:center;min-height:50px;padding:2px 0 4px;display:flex}.login-btn{padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-gray-800);color:var(--color-white);border-radius:var(--border-radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;font-family:var(--font-family);white-space:nowrap;text-align:center;box-sizing:border-box;border:none;justify-content:center;align-items:center;height:38px;transition:all .2s;display:inline-flex}.login-btn:hover{background-color:var(--color-gray-700)}.category-list{padding-bottom:var(--spacing-lg);-webkit-overflow-scrolling:touch;flex:1;overflow:hidden auto}.category-list::-webkit-scrollbar{width:6px}.content-scroll-wrapper::-webkit-scrollbar{width:6px}.category-list::-webkit-scrollbar-track{background:0 0}.content-scroll-wrapper::-webkit-scrollbar-track{background:0 0}.category-list::-webkit-scrollbar-thumb{background:var(--color-gray-300);border-radius:3px}.content-scroll-wrapper::-webkit-scrollbar-thumb{background:var(--color-gray-300);border-radius:3px}.category-list::-webkit-scrollbar-thumb:hover{background:var(--color-gray-400)}.content-scroll-wrapper::-webkit-scrollbar-thumb:hover{background:var(--color-gray-400)}.stats-btn-inline{width:100%;padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-gray-800);color:var(--color-white);border-radius:var(--border-radius-md);cursor:pointer;justify-content:center;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-sm);font-family:var(--font-family);margin-top:var(--spacing-md);margin-bottom:var(--spacing-md);border:none;transition:all .2s;display:flex}.stats-btn-inline:hover{background-color:var(--color-gray-700)}.stats-btn-inline svg{flex-shrink:0}.stats-btn{width:100%;padding:var(--spacing-sm) var(--spacing-md);color:var(--color-gray-600);cursor:pointer;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-sm);font-family:var(--font-family);background-color:#0000;border:none;justify-content:flex-start;transition:color .2s;display:flex}.stats-btn:hover{color:var(--color-gray-800)}.stats-btn svg{flex-shrink:0}.category-item .count{font-size:var(--font-size-sm);background-color:var(--color-gray-200);border-radius:var(--border-radius-full);font-family:var(--font-family);padding:4px 8px}.add-category-btn{margin-top:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);border:1px dashed var(--color-gray-300);border-radius:var(--border-radius-md);color:var(--color-gray-500);cursor:pointer;font-size:var(--font-size-base);font-family:var(--font-family);background-color:#0000;transition:all .2s}.add-category-btn:hover{border-color:var(--color-gray-400);color:var(--color-gray-600)}.add-category-form{margin-top:var(--spacing-md);gap:var(--spacing-sm);flex-direction:column;display:flex}.add-category-form input{padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-gray-300);border-radius:var(--border-radius-md);font-size:var(--font-size-base);font-family:var(--font-family)}.add-category-form .form-buttons{gap:var(--spacing-sm);display:flex}.add-category-form .form-buttons .btn{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm);flex:1}.category-item-wrapper{margin-bottom:var(--spacing-xs);position:relative}.category-item{padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--border-radius-md);cursor:pointer;font-size:var(--font-size-base);font-family:var(--font-family);background-color:var(--color-gray-50);justify-content:space-between;align-items:center;transition:background-color .2s;display:flex;position:relative}.category-item:hover{background-color:var(--color-gray-100)}.category-item.active{background-color:var(--color-gray-200);color:var(--color-gray-800)}.category-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.category-menu-popup{background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--border-radius-md);box-shadow:var(--shadow-md);z-index:1000;min-width:120px;padding:var(--spacing-xs) 0;position:fixed}.category-menu-item{align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);text-align:left;cursor:pointer;width:100%;font-size:var(--font-size-sm);font-family:var(--font-family);color:var(--color-gray-700);background:0 0;border:none;transition:background-color .2s;display:flex}.category-menu-item:hover{background-color:var(--color-gray-50)}.category-menu-item svg{flex-shrink:0}.category-menu-item-danger{color:var(--color-red-600)}.category-menu-item-danger:hover{background-color:#fef2f2}.main-content{font-family:var(--font-family);cursor:default;flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.header{padding:var(--spacing-xl) var(--spacing-2xl) var(--spacing-lg);background-color:var(--color-white);border-bottom:1px solid var(--color-gray-200);min-height:80px;font-family:var(--font-family);z-index:10;align-items:center;gap:var(--spacing-md);flex-shrink:0;display:flex;position:relative}.header-left{align-items:center;gap:var(--spacing-md);flex-shrink:0;display:flex}.header-right{align-items:center;gap:var(--spacing-md);margin-left:auto;display:flex}.content-scroll-wrapper{-webkit-overflow-scrolling:touch;flex:1;overflow:hidden auto}.btn{padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--border-radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;font-family:var(--font-family);box-sizing:border-box;text-align:center;border:none;justify-content:center;align-items:center;height:38px;transition:all .2s;display:inline-flex}.btn-primary{background-color:var(--color-gray-800);color:var(--color-white)}.btn-primary:hover{background-color:var(--color-gray-700)}.btn-secondary{background-color:var(--color-white);color:var(--color-gray-700);border:1px solid var(--color-gray-300)}.btn-secondary:hover{background-color:var(--color-gray-50)}.btn-secondary.active-filter{background-color:var(--color-gray-800);border-color:var(--color-gray-800)}.header-filters{align-items:center;gap:var(--spacing-md);display:flex}.dropdown,.dropdown-toggle{position:relative}.dropdown-toggle:after{content:"▼";margin-left:var(--spacing-xs);font-size:10px}.dropdown-menu{margin-top:var(--spacing-xs);background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--border-radius-md);box-shadow:var(--shadow-md);z-index:1000;min-width:150px;padding:var(--spacing-xs) 0;position:absolute;top:100%;left:0}.dropdown-item{padding:var(--spacing-sm) var(--spacing-md);cursor:pointer;font-size:var(--font-size-sm);font-family:var(--font-family);align-items:center;transition:background-color .2s;display:flex}.dropdown-item:hover{background-color:var(--color-gray-50)}.dropdown-item.active{background-color:var(--color-gray-100);color:var(--color-gray-800);font-weight:var(--font-weight-medium)}.status-indicator{border-radius:50%;width:8px;height:8px;margin-right:6px;display:inline-block}.checkbox{border:2px solid var(--color-gray-300);border-radius:var(--border-radius-sm);width:16px;height:16px;margin-right:var(--spacing-sm);flex-shrink:0;transition:all .2s;position:relative}.checkbox.checked{background-color:var(--color-gray-800);border-color:var(--color-gray-800)}.checkbox.checked:after{content:"✓";color:var(--color-white);font-size:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.view-toggle{gap:var(--spacing-xs);display:flex}.view-search-group{align-items:center;gap:var(--spacing-md);display:flex}.btn-icon{width:38px;height:38px;padding:var(--spacing-sm);border:1px solid var(--color-gray-300);background-color:var(--color-white);color:var(--color-gray-600);border-radius:var(--border-radius-md);cursor:pointer;box-sizing:border-box;justify-content:center;align-items:center;transition:all .2s;display:flex}.btn-icon svg{width:22px;height:22px}.btn-icon:hover{background-color:var(--color-gray-50)}.btn-icon.active{background-color:var(--color-gray-800);border-color:var(--color-gray-800);color:var(--color-white)}.search-input{padding:0 var(--spacing-lg);border:1px solid var(--color-gray-300);border-radius:var(--border-radius-md);font-size:var(--font-size-base);width:200px;font-family:var(--font-family);-webkit-user-select:text;user-select:text;box-sizing:border-box;align-items:center;height:38px;display:flex}.search-input:focus{border-color:var(--color-gray-400);outline:none}.novel-grid{padding:var(--spacing-xl);gap:var(--spacing-lg);cursor:default;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));display:grid}.novel-list{padding:var(--spacing-xl);gap:var(--spacing-md);cursor:default;flex-direction:column;width:100%;max-width:none;display:flex}.empty-state{text-align:center;padding:var(--spacing-3xl) var(--spacing-xl);color:var(--color-gray-400);grid-column:1/-1}.empty-state p{margin-bottom:var(--spacing-sm);font-size:var(--font-size-base);font-family:var(--font-family)}@media (width<=1024px){.sidebar{width:200px}.header{padding:var(--spacing-md) var(--spacing-lg)}.novel-grid{padding:var(--spacing-lg);grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}@media (width<=768px) and (orientation:portrait){.novel-grid{gap:var(--spacing-md);grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.novel-list{padding:var(--spacing-md)}}@media (width<=768px) and (orientation:landscape){.novel-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}}@media (width<=768px){.app{flex-direction:column}.sidebar{z-index:1001;width:280px;height:100vh;transition:left .3s;display:flex;position:fixed;top:0;left:-100%;box-shadow:2px 0 8px #0000001a}.sidebar.sidebar-open{left:0}.sidebar-overlay{display:block}.hamburger-menu{display:flex}.btn{padding:var(--spacing-compact-sm) var(--spacing-compact-md);font-size:var(--font-size-xs)}.btn-primary{font-size:var(--font-size-sm);white-space:nowrap;min-width:100px;padding:6px 12px}.btn-icon{width:38px;height:38px;padding:var(--spacing-compact-xs)}.btn-icon svg{width:14px;height:14px;fill:var(--color-gray-600)}.btn-icon.active svg{fill:var(--color-white)}.dropdown-toggle,.search-input{font-size:var(--font-size-xs);padding:var(--spacing-compact-sm) var(--spacing-compact-md)}.header{height:auto;min-height:auto;padding:var(--spacing-compact-sm) var(--spacing-compact-md);gap:var(--spacing-compact-sm);flex-wrap:nowrap;align-items:center}.header-left{gap:var(--spacing-compact-xs);flex-direction:row;flex-shrink:0;align-items:center;display:flex}.header-right{gap:var(--spacing-compact-xs);flex-direction:column;flex:1;align-items:flex-end;margin-left:auto;display:flex}.header-filters{justify-content:flex-end;gap:var(--spacing-compact-xs);flex-wrap:wrap;display:flex}.view-toggle{flex-shrink:0}.view-search-group{justify-content:flex-end;gap:var(--spacing-compact-xs);white-space:nowrap;display:flex}.search-input{padding:var(--spacing-compact-sm) var(--spacing-compact-md);font-size:var(--font-size-xs);width:auto;max-width:200px}.novel-grid{padding:var(--spacing-md)}}.date-picker-container{box-sizing:border-box;display:flex;position:relative}.date-picker-input{box-sizing:border-box;cursor:pointer;width:100%;box-sizing:border-box!important;width:100%!important}.date-picker-input:focus{border-color:var(--color-gray-400);outline:none}.date-picker-popup{background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--border-radius-md);box-shadow:var(--shadow-lg);z-index:2500;min-width:280px;position:fixed}.date-picker-header{padding:var(--spacing-xs) var(--spacing-sm);border-bottom:1px solid var(--color-gray-200);justify-content:space-between;align-items:center;display:flex}.date-picker-nav{cursor:pointer;color:var(--color-gray-700);border-radius:var(--border-radius-sm);background:0 0;border:none;justify-content:center;align-items:center;width:32px;height:32px;padding:4px 8px;font-size:18px;transition:background-color .2s;display:flex}.date-picker-nav:hover{background-color:var(--color-gray-100)}.date-picker-title{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;border-radius:var(--border-radius-sm);color:var(--color-gray-800);text-align:center;background:0 0;border:none;flex:1;padding:6px 12px;transition:background-color .2s}.date-picker-title:hover{background-color:var(--color-gray-100)}.date-picker-body{padding:var(--spacing-xs) var(--spacing-sm)}.date-picker-weekdays{grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px;display:grid}.date-picker-weekdays>div{text-align:center;font-size:var(--font-size-xs);color:var(--color-gray-500);font-weight:var(--font-weight-medium);padding:2px}.date-picker-days{grid-template-columns:repeat(7,1fr);gap:2px;display:grid}.date-picker-day{text-align:center;font-size:var(--font-size-sm);cursor:pointer;border-radius:var(--border-radius-sm);color:var(--color-gray-700);justify-content:center;align-items:center;min-height:28px;padding:4px 2px;transition:background-color .2s;display:flex}.date-picker-day:hover:not(.empty){background-color:var(--color-gray-100)}.date-picker-day.empty{cursor:default}.date-picker-day.selected{background-color:var(--color-gray-800);color:var(--color-white)}.date-picker-months,.date-picker-years{gap:var(--spacing-sm);grid-template-columns:repeat(3,1fr);max-height:200px;display:grid;overflow-y:auto}.date-picker-month,.date-picker-year{text-align:center;padding:var(--spacing-sm);font-size:var(--font-size-sm);cursor:pointer;border-radius:var(--border-radius-sm);color:var(--color-gray-700);transition:background-color .2s}.date-picker-month:hover,.date-picker-year:hover{background-color:var(--color-gray-100)}.date-picker-month.current,.date-picker-year.current{background-color:var(--color-gray-200);font-weight:var(--font-weight-medium)}.novel-card{background-color:var(--color-white);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);cursor:default;overflow:visible}.novel-card:hover{box-shadow:var(--shadow-lg);cursor:default}.novel-cover{width:calc(100% - var(--spacing-sm) * 2);aspect-ratio:3/4;max-height:180px;margin:var(--spacing-sm) var(--spacing-sm) 0;border-radius:var(--border-radius-md);cursor:pointer;cursor:default;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.novel-cover-title{color:var(--color-white);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);text-align:center;padding:var(--spacing-sm);text-shadow:0 2px 4px #0000004d;-webkit-user-select:none;user-select:none}.cover-status-badge{font-size:10px;font-weight:var(--font-weight-medium);color:var(--color-white);clip-path:polygon(0 0,calc(100% - 6px) 0,100% 50%,calc(100% - 6px) 100%,0 100%);-webkit-user-select:none;user-select:none;padding:3px 10px 3px 6px;position:absolute;bottom:6px;left:0}.cover-status-badge.status-reading{background-color:var(--color-reading)}.cover-status-badge.status-read{background-color:var(--color-read)}.cover-status-badge.status-want{background-color:var(--color-want)}.novel-content{padding:var(--spacing-xs) var(--spacing-sm) var(--spacing-sm);cursor:default}.novel-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-gray-800);text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;margin-bottom:2px;overflow:hidden}.novel-author{font-size:var(--font-size-xs);color:var(--color-gray-500);-webkit-user-select:none;user-select:none;margin-bottom:2px}.novel-status{font-size:var(--font-size-xs);color:var(--color-gray-600);-webkit-user-select:none;user-select:none;align-items:center;margin-bottom:2px;display:flex}.status-indicator{border-radius:50%;width:6px;height:6px;margin-right:4px}.status-reading{background-color:var(--color-reading)}.status-read{background-color:var(--color-read)}.status-want{background-color:var(--color-want)}.card-view-content{flex-direction:column;gap:2px;display:flex}.novel-status-row{white-space:nowrap;justify-content:space-between;align-items:center;gap:4px;margin-bottom:2px;display:flex;overflow:hidden}.novel-status-row .novel-status{font-size:var(--font-size-xs);color:var(--color-gray-600);-webkit-user-select:none;user-select:none;align-items:center;margin-bottom:0;display:flex}.novel-status-row .novel-reading-date{font-size:var(--font-size-xs);color:var(--color-gray-500);-webkit-user-select:none;user-select:none;align-items:center;gap:2px;margin-bottom:0;display:flex}.card-view-content .novel-reading-date{color:var(--color-gray-500);-webkit-user-select:none;user-select:none;align-items:center;gap:2px;font-size:12px;display:flex}.card-view-content .novel-reading-date.empty,.novel-status-row .novel-reading-date.empty{display:none}.card-view-content .novel-rating,.novel-rating{gap:6px;margin-bottom:2px;display:flex}.novel-rating .star{font-size:14px}.novel-tags{-webkit-user-select:none;user-select:none;flex-wrap:wrap;gap:2px;display:flex}.edit-confirm-btn,.edit-cancel-btn{padding:10px var(--spacing-lg);min-width:100px;font-size:16px;font-weight:var(--font-weight-semibold);white-space:nowrap;box-shadow:0 2px 8px #0000004d}.edit-confirm-btn{background-color:var(--color-gray-800);color:var(--color-white);border:1px solid #fff3}.edit-confirm-btn:hover{background-color:#111827;box-shadow:0 4px 12px #0006}.edit-cancel-btn{background-color:var(--color-white);color:var(--color-gray-800);border:1px solid #0000001a}.edit-cancel-btn:hover{background-color:var(--color-gray-50);box-shadow:0 4px 12px #0006}.edit-field{margin-bottom:var(--spacing-xs);cursor:default}.edit-field label{font-size:var(--font-size-xs);color:var(--color-gray-600);cursor:default;margin-bottom:2px;display:block}.edit-field input,.edit-field select{width:100%;font-size:var(--font-size-xs);appearance:none;text-align:left;padding:2px 6px;line-height:1.4}.edit-field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='%236b7280'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");background-position:right 6px center;background-repeat:no-repeat;padding-right:24px}.edit-field input:focus,.edit-field select:focus{border-color:var(--color-gray-400)}.rating-input .star{font-size:16px}.edit-field .rating-input .star svg{width:18px;height:18px}.tags-edit{cursor:default;flex-direction:column;gap:2px;display:flex}.tags-edit .tags-list{cursor:default;flex-wrap:wrap;gap:2px;display:flex}.tags-edit .editable-tag .remove-tag-btn{width:12px;height:12px;font-size:10px}.tags-edit input{width:100%;font-size:var(--font-size-xs);padding:2px 6px;line-height:1.4}.context-menu{background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--border-radius-md);box-shadow:var(--shadow-lg);z-index:1000;min-width:120px;padding:var(--spacing-xs) 0;position:fixed}.menu-item{align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm);cursor:pointer;transition:background-color .2s;display:flex}.menu-item svg{flex-shrink:0}.menu-item:hover{background-color:var(--color-gray-50)}.menu-item.danger{color:var(--color-danger)}.menu-item.danger:hover{background-color:#fee2e2}.color-picker-submenu{border-top:1px solid var(--color-gray-200);background-color:var(--color-gray-50)}.color-picker-submenu .color-picker-title{font-size:var(--font-size-xs);color:var(--color-gray-600);padding:var(--spacing-sm) var(--spacing-md) var(--spacing-xs);font-weight:var(--font-weight-medium)}.color-picker-submenu .color-options{gap:var(--spacing-xs);padding:0 var(--spacing-md) var(--spacing-sm);grid-template-columns:repeat(4,1fr);display:grid}.color-option:hover{border-color:var(--color-gray-400);transform:scale(1.1)}.category-picker-submenu{border-top:1px solid var(--color-gray-200);background-color:var(--color-gray-50)}.category-picker-title{font-size:var(--font-size-xs);color:var(--color-gray-600);padding:var(--spacing-sm) var(--spacing-md) var(--spacing-xs);font-weight:var(--font-weight-medium)}.category-option{align-items:center;gap:var(--spacing-sm);padding:var(--spacing-xs) var(--spacing-md);font-size:var(--font-size-sm);cursor:pointer;transition:background-color .2s;display:flex}.category-option:hover{background-color:var(--color-gray-100)}.category-option.selected{background-color:var(--color-gray-200);font-weight:var(--font-weight-medium)}.novel-list-item{background-color:var(--color-white);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm);gap:var(--spacing-2xl);padding:2px var(--spacing-md);cursor:default;align-items:center;width:100%;margin-bottom:4px;transition:box-shadow .2s;display:flex}.novel-list-item:hover{box-shadow:var(--shadow-md);cursor:default}.novel-list-item .novel-cover{border-radius:var(--border-radius-md);aspect-ratio:auto;flex-shrink:0;justify-content:center;align-items:center;width:90px;height:120px;max-height:none;margin:0;display:flex;overflow:hidden}.novel-list-item .novel-content{flex-direction:column;flex:1;justify-content:flex-start;gap:0;min-width:0;padding:0;display:flex}.list-view-content{flex-direction:column;gap:10px;display:flex}.novel-list-item .content-row{align-items:center;gap:var(--spacing-md);flex-wrap:nowrap;display:flex;overflow:hidden}.novel-list-item .content-separator{color:var(--color-gray-300);font-size:var(--font-size-sm);margin:0 var(--spacing-xs);flex-shrink:0}.novel-list-item .novel-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);white-space:nowrap;text-overflow:ellipsis;flex-shrink:1;overflow:hidden}.novel-list-item .novel-author{font-size:var(--font-size-sm);color:var(--color-gray-600);white-space:nowrap;text-overflow:ellipsis;flex-shrink:1;overflow:hidden}.novel-list-item .novel-status{font-size:var(--font-size-sm);margin-right:var(--spacing-md);flex-shrink:0}.novel-list-item .novel-rating{margin-right:var(--spacing-md);flex-shrink:0;align-items:center;height:16px;padding-top:2px;display:flex}.novel-list-item .novel-rating .star{font-size:14px}.novel-list-item .novel-reading-date{font-size:var(--font-size-sm);color:var(--color-gray-500);margin-right:var(--spacing-md);flex-shrink:0;align-items:center;gap:2px;display:flex}.novel-list-item .novel-reading-date.empty{display:none}.novel-list-item .novel-tags{flex-wrap:nowrap;flex-shrink:1;align-items:center;gap:4px;display:flex;overflow:hidden}.novel-list-item .tag{flex-shrink:0;padding:3px 6px;font-size:12px}.novel-list-item .novel-details-preview{font-size:var(--font-size-sm);color:var(--color-gray-500);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;overflow:hidden}.novel-list-item .novel-cover-title{font-size:var(--font-size-sm);padding:var(--spacing-sm);-webkit-user-select:none;user-select:none;word-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;line-height:1.3}.novel-details-preview{font-size:var(--font-size-sm);color:var(--color-gray-500);text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;margin-top:2px;overflow:hidden}.novel-list-item .edit-buttons{margin-top:var(--spacing-xs);flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex;position:static;transform:none}.novel-list-item .edit-confirm-btn,.novel-list-item .edit-cancel-btn{padding:8px var(--spacing-md);min-width:80px;font-size:14px}.novel-list-item .rating-input .star{font-size:14px!important}@media (width<=768px) and (orientation:portrait){.novel-cover{max-height:140px}.novel-cover-title{font-size:var(--font-size-sm)}.novel-content{padding:var(--spacing-xs) var(--spacing-xs)}.novel-title{font-size:var(--font-size-xs)}.novel-author{font-size:11px}.edit-confirm-btn{font-size:var(--font-size-xs);min-width:60px;padding:6px 12px}.cover-status-badge{padding:2px 8px 2px 5px;font-size:9px;bottom:4px;left:0}.rating-input .star{font-size:14px}.edit-field .rating-input .star svg{width:16px;height:16px}.novel-rating,.card-view-content .novel-rating{gap:4px}}@media (width<=768px){.novel-list-item{gap:var(--spacing-sm);padding:2px var(--spacing-sm)}.list-view-content{gap:4px}.novel-list-item .content-row{gap:var(--spacing-xs)}.novel-list-item .novel-cover{width:70px;height:100px}.novel-list-item .novel-title{font-size:var(--font-size-sm)}.novel-list-item .novel-author{font-size:var(--font-size-xs)}.novel-list-item .novel-cover-title{font-size:var(--font-size-xs);padding:2px}.novel-list-item .edit-confirm-btn,.novel-list-item .edit-cancel-btn{min-width:50px;padding:5px 10px;font-size:11px}}.modal-overlay{z-index:2000;background-color:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--color-white);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-lg);flex-direction:column;width:90%;max-width:500px;max-height:90vh;display:flex;overflow:hidden}.modal-header{padding:var(--spacing-lg);border-bottom:1px solid var(--color-gray-200);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.modal-header h3{color:#1f2937;margin:0;font-size:18px;font-weight:600}.close-btn{cursor:pointer;color:var(--color-gray-400);border-radius:var(--border-radius-md);background:0 0;border:none;justify-content:center;align-items:center;width:32px;height:32px;padding:0;font-size:24px;line-height:1;transition:background-color .2s;display:flex}.close-btn:hover{background-color:var(--color-gray-100);color:var(--color-gray-600)}.novel-form{padding:var(--spacing-lg);flex:1;overflow-y:auto}.form-group{margin-bottom:var(--spacing-md)}.form-group label{margin-bottom:var(--spacing-sm);color:#4b5563;text-transform:uppercase;letter-spacing:.3px;font-size:14px;font-weight:600;display:block}.novel-form input,.novel-form select{border:1px solid var(--color-gray-300);border-radius:var(--border-radius-md);width:100%;font-size:14px;font-family:var(--font-family);color:var(--color-gray-800);box-sizing:border-box;background-color:var(--color-white);padding:8px 12px;line-height:1.5;transition:border-color .2s}.novel-form input:focus,.novel-form select:focus{border-color:var(--color-gray-400);outline:none}.novel-form input::placeholder{color:var(--color-gray-400)}.novel-form .date-picker-input{padding:8px 12px!important;font-size:14px!important;line-height:1.5!important}.form-row{grid-template-columns:1fr 1fr;gap:20px;display:grid}.status-buttons{gap:10px;display:flex}.status-btn{border:1px solid var(--color-gray-300);border-radius:var(--border-radius-md);background-color:var(--color-white);font-size:12px;font-family:var(--font-family);color:var(--color-gray-600);cursor:pointer;flex:1;padding:7px 6px;transition:all .2s}.status-btn:hover{border-color:var(--color-gray-400);background-color:var(--color-gray-50)}.status-btn.active{background-color:var(--color-gray-800);border-color:var(--color-gray-800);color:var(--color-white)}.rating-input{padding:var(--spacing-xs) 0}.rating-input .star{-webkit-user-select:none;user-select:none;font-size:24px}.rating-input .star .star-icon{display:block}.color-options{gap:var(--spacing-sm);grid-template-columns:repeat(8,1fr);display:grid}.color-option{border-radius:var(--border-radius-md);cursor:pointer;border:3px solid #0000;width:36px;height:36px;transition:transform .2s,box-shadow .2s}.color-option:hover{transform:scale(1.1)}.color-option.selected{border-color:var(--color-gray-800);box-shadow:0 0 0 2px var(--color-white), 0 0 0 4px var(--color-gray-800)}.tags-input{flex-direction:column;gap:4px;display:flex}.tags-input input{width:100%;padding:10px 12px;font-size:14px;line-height:1.4}.tags-input input:focus{border-color:var(--color-gray-400)}.tags-input input::placeholder{color:var(--color-gray-400)}.tags-input .editable-tag{font-size:13px}.form-actions{justify-content:flex-end;gap:var(--spacing-sm);margin-top:var(--spacing-lg);padding-top:var(--spacing-md);border-top:1px solid var(--color-gray-200);flex-shrink:0;display:flex}.form-actions .btn{box-sizing:border-box!important;width:auto!important;min-width:auto!important;max-width:none!important;height:38px!important;font-size:14px!important;font-family:var(--font-family)!important;font-weight:var(--font-weight-medium)!important;border-radius:var(--border-radius-md)!important;cursor:pointer!important;text-align:center!important;border:1px solid #0000!important;flex-grow:0!important;flex-shrink:0!important;justify-content:center!important;align-items:center!important;padding:8px 20px!important;transition:all .2s!important;display:inline-flex!important}.form-actions .btn-secondary{background-color:var(--color-white)!important;color:var(--color-gray-700)!important;border-color:var(--color-gray-300)!important}.form-actions .btn-secondary:hover{background-color:var(--color-gray-50)!important;border-color:var(--color-gray-400)!important}.form-actions .btn-primary{background-color:var(--color-gray-800)!important;color:var(--color-white)!important;border-color:var(--color-gray-800)!important}.form-actions .btn-primary:hover{background-color:var(--color-gray-700)!important;border-color:var(--color-gray-700)!important}@media (width<=480px){.status-btn{padding:8px 4px;font-size:12px}.color-options{grid-template-columns:repeat(6,1fr)}.color-option{width:32px;height:32px}.form-actions .btn{box-sizing:border-box!important;width:auto!important;min-width:auto!important;max-width:none!important;height:36px!important;font-size:13px!important;font-family:var(--font-family)!important;font-weight:var(--font-weight-medium)!important;border-radius:var(--border-radius-md)!important;cursor:pointer!important;text-align:center!important;border:1px solid #0000!important;flex-grow:0!important;flex-shrink:0!important;justify-content:center!important;align-items:center!important;padding:8px 16px!important;transition:all .2s!important;display:inline-flex!important}.form-actions .btn-secondary{background-color:var(--color-white)!important;color:var(--color-gray-700)!important;border-color:var(--color-gray-300)!important}.form-actions .btn-secondary:hover{background-color:var(--color-gray-50)!important;border-color:var(--color-gray-400)!important}.form-actions .btn-primary{background-color:var(--color-gray-800)!important;color:var(--color-white)!important;border-color:var(--color-gray-800)!important}.form-actions .btn-primary:hover{background-color:var(--color-gray-700)!important;border-color:var(--color-gray-700)!important}}.reading-sessions{flex-direction:column;gap:8px;display:flex}.reading-session-row{align-items:center;gap:8px;display:flex}.session-label{color:var(--color-gray-500);flex-shrink:0;width:20px;font-size:14px}.session-inputs{flex:1;align-items:center;gap:8px;display:flex}.session-inputs .date-picker-input{flex:1;min-width:0}.remove-session-btn{width:28px;height:28px;color:var(--color-gray-400);cursor:pointer;border-radius:var(--border-radius-sm);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;transition:all .2s;display:flex}.remove-session-btn:hover{background-color:var(--color-gray-100);color:var(--color-red-600)}.add-session-btn{border:1px dashed var(--color-gray-300);border-radius:var(--border-radius-md);color:var(--color-gray-500);cursor:pointer;font-size:14px;font-family:var(--font-family);background:0 0;padding:8px 12px;transition:all .2s}.add-session-btn:hover{border-color:var(--color-gray-400);color:var(--color-gray-700)}@media (width<=480px){.reading-session-row{flex-wrap:wrap}.session-inputs{width:calc(100% - 48px)}.session-arrow{display:none}}.excerpt-detail-overlay{z-index:3000;cursor:default;background-color:#00000080;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.excerpt-detail-content{background-color:#fff;border-radius:8px;flex-direction:column;width:100%;max-width:600px;height:95vh;display:flex;overflow:hidden;box-shadow:0 4px 20px #00000026}.excerpt-detail-header{border-bottom:1px solid #e5e5e5;flex-shrink:0;justify-content:flex-end;padding:8px 16px;display:flex}.excerpt-detail-close-btn{cursor:pointer;padding:4px;font-size:24px;line-height:1;transition:color .2s;color:#999!important;background:0 0!important;border:none!important}.excerpt-detail-close-btn:hover{color:#4b5563!important}.excerpt-detail-body{flex-direction:column;flex:1;gap:10px;min-height:0;padding:12px 16px;display:flex;overflow:hidden}.excerpt-detail-body .meta-section{flex-shrink:0}.excerpt-detail-body .meta-row{align-items:center;gap:24px;width:100%;display:flex}.excerpt-detail-body .meta-item{flex-direction:row;flex:1;align-items:center;min-width:0;display:flex}.excerpt-detail-body .meta-label{color:#4b5563;text-transform:uppercase;letter-spacing:.3px;flex-shrink:0;width:40px;margin-right:2px;font-size:14px;font-weight:600}.excerpt-detail-body .meta-input{text-align:left;flex:1;min-width:0;transition:all .2s;font-size:var(--font-size-sm)!important;color:#4b5563!important;background:#fafafa!important;border:1px solid #e0e0e0!important;border-radius:4px!important;outline:none!important;padding:6px 8px!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important}.excerpt-detail-body .meta-input:focus{box-shadow:0 0 0 3px #0000000d;background:#fff!important;border-color:#999!important}.excerpt-detail-body input[type=number].meta-input{-moz-appearance:textfield;appearance:none}.excerpt-detail-body input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.excerpt-detail-body input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.excerpt-detail-body .date-picker-input{flex:1;min-width:0;font-size:var(--font-size-sm)!important;color:#4b5563!important;text-align:left!important;background:#fafafa!important;border:1px solid #e0e0e0!important;border-radius:4px!important;outline:none!important;padding:6px 8px!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important;transition:all .2s!important}.excerpt-detail-body .section-title{color:#4b5563;letter-spacing:.3px;text-transform:uppercase;text-align:left;flex-shrink:0;margin:0 0 6px;font-size:14px;font-weight:600}.excerpt-detail-body .content-section{flex-direction:column;flex:1;min-height:0;display:flex}.excerpt-detail-body .content-textarea{resize:none;white-space:pre-wrap;word-wrap:break-word;outline:none;flex:1;width:100%;min-height:0;line-height:1.6;transition:all .2s;overflow-y:auto;font-size:var(--font-size-sm)!important;color:#4b5563!important;background:#fafafa!important;border:1px solid #e0e0e0!important;border-radius:4px!important;padding:10px 12px!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important}.excerpt-detail-body .content-textarea:focus{box-shadow:0 0 0 3px #0000000d;background:#fff!important;border-color:#999!important}.excerpt-detail-body .content-textarea::placeholder{color:#999!important}.excerpt-detail-body .note-section{flex-direction:column;flex:1;min-height:0;display:flex}.excerpt-detail-body .note-textarea{resize:none;white-space:pre-wrap;word-wrap:break-word;outline:none;flex:1;width:100%;min-height:0;line-height:1.6;transition:all .2s;overflow-y:auto;font-size:var(--font-size-sm)!important;color:#4b5563!important;background:#fafafa!important;border:1px solid #e0e0e0!important;border-radius:4px!important;padding:10px 12px!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important}.excerpt-detail-body .note-textarea:focus{box-shadow:0 0 0 3px #0000000d;background:#fff!important;border-color:#999!important}.excerpt-detail-body .note-textarea::placeholder{color:#999!important}.excerpt-detail-content .action-buttons{background-color:#fff;border-top:1px solid #eee;flex-shrink:0;justify-content:flex-end;gap:8px;padding:10px 16px;display:flex}.excerpt-detail-content .action-btn{cursor:pointer;padding:6px 20px;font-weight:500;transition:all .2s;color:#fff!important;font-size:var(--font-size-sm)!important;background-color:#333!important;border:1px solid #333!important;border-radius:4px!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important}.excerpt-detail-content .action-btn.cancel-btn{color:#4b5563!important;background-color:#fff!important;border:1px solid #e0e0e0!important}.excerpt-detail-content .action-btn.cancel-btn:hover{background-color:#f5f5f5!important;border-color:#d1d5db!important}.excerpt-detail-content .action-btn:hover{background-color:#555!important;border-color:#555!important}@media (width<=768px){.excerpt-detail-overlay{padding:0}.excerpt-detail-content{-webkit-overflow-scrolling:touch;border-radius:0;max-width:100%;height:100vh;position:relative;overflow-y:auto}.excerpt-detail-header{padding:8px 12px}.excerpt-detail-body{-webkit-overflow-scrolling:touch;gap:8px;padding:10px 12px;overflow-y:auto}.excerpt-detail-body .meta-row{gap:6px}.excerpt-detail-body .content-textarea,.excerpt-detail-body .note-textarea{font-size:var(--font-size-sm)!important;padding:8px!important}.excerpt-detail-content .action-buttons{padding:8px 12px}.excerpt-detail-content .action-btn{padding:6px 16px;font-size:var(--font-size-sm)!important}.excerpt-detail-body .section-title{font-size:var(--font-size-sm);margin-bottom:4px}}.excerpt-card{background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--border-radius-md);padding:var(--spacing-md);cursor:pointer;flex-direction:column;gap:4px;transition:all .2s;display:flex;position:relative}.excerpt-card:hover{box-shadow:var(--shadow-md);border-color:var(--color-gray-300)}.excerpt-delete-btn{background:var(--color-gray-100);border:1px solid var(--color-gray-200);width:28px;height:28px;color:var(--color-gray-600);cursor:pointer;opacity:0;text-align:center;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:20px;line-height:28px;transition:all .2s;display:flex;position:absolute;top:6px;right:6px}.excerpt-card:hover .excerpt-delete-btn{opacity:1}.excerpt-delete-btn:hover{background:var(--color-red-100);border-color:var(--color-red-300);color:var(--color-red-600)}.excerpt-content{font-size:var(--font-size-sm);color:var(--color-gray-800);padding-left:var(--spacing-md);border-left:3px solid var(--color-gray-800);font-style:italic;line-height:1.4}.excerpt-meta{gap:var(--spacing-md);font-size:var(--font-size-xs);color:var(--color-gray-500);display:flex}.excerpt-chapter{font-weight:var(--font-weight-medium)}.excerpt-page{color:var(--color-gray-500)}.excerpt-note{background-color:var(--color-gray-50);border-radius:var(--border-radius-sm);padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm);color:var(--color-gray-700);line-height:1.4}@media (width<=768px){.excerpt-card{padding:var(--spacing-sm)}.excerpt-content{font-size:var(--font-size-sm);padding-left:var(--spacing-sm)}.excerpt-delete-btn{opacity:1}}.excerpts-list{width:100%;max-width:1200px;padding-top:0;padding-bottom:var(--spacing-xl);padding-left:var(--spacing-xl);padding-right:var(--spacing-xl);margin:0 auto}.excerpts-header{margin-bottom:var(--spacing-md);justify-content:space-between;align-items:center;display:flex}.excerpts-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-gray-800);margin:0}.excerpts-actions{align-items:center;gap:var(--spacing-sm);display:flex}.add-excerpt-btn{background-color:var(--color-gray-800);width:32px;height:32px;color:var(--color-white);border-radius:var(--border-radius-md);font-size:18px;font-weight:var(--font-weight-medium);cursor:pointer;border:none;justify-content:center;align-items:center;padding:0;line-height:1;transition:all .2s;display:flex}.add-excerpt-btn:hover{background-color:var(--color-gray-700)}.search-excerpt-btn{width:32px;height:32px;color:var(--color-gray-600);border:1px solid var(--color-gray-300);border-radius:var(--border-radius-md);cursor:pointer;background-color:#0000;justify-content:center;align-items:center;padding:0;transition:all .2s;display:flex}.search-excerpt-btn:hover{background-color:var(--color-gray-50);border-color:var(--color-gray-400)}.excerpts-search-bar{margin-bottom:var(--spacing-sm)}.excerpts-search-input{border:1px solid var(--color-gray-300);border-radius:var(--border-radius-md);width:100%;font-size:var(--font-size-sm);font-family:var(--font-family);background-color:var(--color-white);box-sizing:border-box;outline:none;padding:6px 10px;transition:border-color .2s}.excerpts-search-input:focus{border-color:var(--color-gray-400)}.excerpts-search-input::placeholder{color:var(--color-gray-400)}.excerpts-grid{gap:var(--spacing-md);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.excerpts-empty{padding:var(--spacing-2xl);text-align:center;color:var(--color-gray-400);flex-direction:column;justify-content:center;align-items:center;display:flex}.excerpts-empty svg{margin-bottom:var(--spacing-lg);opacity:.5}.excerpts-empty p{font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);color:var(--color-gray-500);margin:0}.excerpts-empty .empty-hint{font-size:var(--font-size-sm);color:var(--color-gray-400);margin-top:var(--spacing-xs);margin-bottom:var(--spacing-lg)}.add-first-excerpt-btn{background-color:var(--color-gray-800);color:var(--color-white);padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--border-radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;border:none;transition:all .2s}.add-first-excerpt-btn:hover{background-color:var(--color-gray-700)}@media (width<=768px){.excerpts-list{padding:var(--spacing-sm)}.excerpts-header{justify-content:space-between;align-items:center;gap:var(--spacing-sm);flex-direction:row}.excerpts-title{font-size:var(--font-size-sm)}.add-excerpt-btn{width:28px;height:28px;padding:0;font-size:18px}.search-excerpt-btn{width:28px;height:28px}.search-excerpt-btn svg{width:14px;height:14px}.excerpts-actions{gap:var(--spacing-xs)}.excerpts-search-input{font-size:var(--font-size-xs)}.excerpts-grid{grid-template-columns:1fr}.add-first-excerpt-btn{width:100%;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm)}.excerpts-empty p{font-size:var(--font-size-sm)}.excerpts-empty .empty-hint{font-size:var(--font-size-xs)}}.ai-book-tab{padding:var(--spacing-lg);gap:var(--spacing-md);box-sizing:border-box;flex-direction:column;height:100%;display:flex}.ai-book-toolbar{flex-shrink:0;justify-content:flex-end;align-items:center;display:flex}.ai-book-config-btn{border-radius:var(--border-radius-md);cursor:pointer;align-items:center;gap:6px;min-height:34px;padding:7px 16px;font-size:14px;font-weight:500;transition:all .2s;display:inline-flex}.ai-book-error{align-items:center;gap:var(--spacing-sm);border-radius:var(--border-radius-md);color:#dc2626;background:#fef2f2;border:1px solid #fecaca;flex-shrink:0;padding:10px 14px;font-size:13px;display:flex}.ai-book-error span{flex:1}.ai-book-retry-btn{flex-shrink:0;min-height:28px;padding:5px 14px;font-size:13px}@keyframes ai-bounce{0%,80%,to{opacity:.5;transform:scale(.6)}40%{opacity:1;transform:scale(1)}}.ai-book-content{color:#1f2937;line-height:1.8;font-size:var(--font-size-base);padding-top:var(--spacing-xs);flex:1;overflow-y:auto}.ai-book-content--streaming{opacity:.9}.ai-book-content blockquote.ai-blockquote{background:var(--color-gray-50);padding:var(--spacing-md) var(--spacing-lg);margin:var(--spacing-md) 0;border-radius:0 var(--border-radius-md) var(--border-radius-md) 0;border-left:3px solid #1f2937}.ai-book-content blockquote.ai-blockquote p{margin:var(--spacing-xs) 0;line-height:1.6}.ai-book-empty{min-height:200px;color:var(--color-gray-400);text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}.ai-book-empty-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-gray-500);margin:var(--spacing-md) 0 0;max-width:280px;line-height:1.6}.ai-config-overlay{z-index:3000;background:#00000073;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.ai-config-modal{background:#fff;border-radius:16px;flex-direction:column;width:95%;max-width:1100px;max-height:90vh;display:flex;overflow:hidden;box-shadow:0 20px 40px #0000002e}.ai-config-header{background:#fff;border-bottom:1px solid #e5e7eb;flex-shrink:0;justify-content:space-between;align-items:center;height:60px;padding:0 24px;display:flex}.ai-config-title{color:#111827;margin:0;font-size:18px;font-weight:700}.ai-config-close{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;padding:6px;transition:background .15s,color .15s;display:flex}.ai-config-close:hover{color:#111827;background:#f3f4f6}.ai-config-body{flex:1;min-height:0;display:flex;overflow:hidden}.ai-config-left{border-right:1px solid #e5e7eb;flex:1;min-width:0;padding:24px;overflow-y:auto}.ai-config-right{flex-direction:column;flex:1;gap:16px;min-width:0;padding:24px;display:flex;overflow:hidden}.ai-config-field{margin-bottom:16px}.ai-config-field:last-child{margin-bottom:0}.ai-config-field--sm{margin-bottom:12px}.ai-config-field--row{justify-content:space-between;align-items:center;display:flex}.ai-config-field--row .ai-config-label{margin-bottom:0}.ai-config-label{color:#374151;margin-bottom:6px;font-size:13px;font-weight:600;display:block}.ai-config-select,.ai-config-input{color:#1f2937;box-sizing:border-box;background:#fff;border:1px solid #d1d5db;border-radius:12px;width:100%;padding:8px 12px;font-family:inherit;font-size:14px;transition:border-color .2s}.ai-config-select:focus,.ai-config-input:focus{border-color:#2563eb;outline:none;box-shadow:0 0 0 3px #2563eb1a}.ai-config-select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:36px}.ai-config-advanced-toggle{color:#374151;cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:10px;align-items:center;gap:6px;margin-bottom:0;padding:6px 12px;font-size:13px;font-weight:500;transition:background .15s,border-color .15s;display:inline-flex}.ai-config-advanced-toggle:hover{background:#f9fafb;border-color:#9ca3af}.ai-config-advanced-panel{background:#f9fafb;border:1px solid #e5e7eb;border-radius:12px;margin-top:10px;padding:16px}.ai-switch{cursor:pointer;background:#d1d5db;border:none;border-radius:11px;flex-shrink:0;width:40px;height:22px;padding:0;transition:background .2s;position:relative}.ai-switch--on{background:#1f2937}.ai-switch-thumb{pointer-events:none;background:#fff;border-radius:50%;width:18px;height:18px;transition:transform .2s;position:absolute;top:2px;left:2px;box-shadow:0 1px 3px #0003}.ai-switch--on .ai-switch-thumb{transform:translate(18px)}.ai-config-prompt-block{flex-direction:column;min-height:0;display:flex}.ai-config-prompt-block--system{flex:1;min-height:0}.ai-config-prompt-block--user{flex-shrink:0}.ai-config-prompt-textarea{color:#1f2937;box-sizing:border-box;background:#fff;border:1px solid #d1d5db;border-radius:12px;padding:12px;font-family:inherit;font-size:13px;line-height:1.6;transition:border-color .2s}.ai-config-prompt-textarea:focus{border-color:#2563eb;outline:none;box-shadow:0 0 0 3px #2563eb1a}.ai-config-prompt-textarea--system{resize:none;flex:1;width:100%;height:100%;min-height:180px}.ai-config-prompt-textarea--user{resize:vertical;width:100%;height:72px;min-height:72px}.ai-config-footer{background:#fff;border-top:1px solid #e5e7eb;flex-shrink:0;justify-content:flex-end;align-items:center;gap:8px;padding:12px 24px;display:flex}.ai-config-footer .cancel-edit-btn{border-radius:var(--border-radius-md);cursor:pointer;color:#374151;background:#fff;border:1px solid #d1d5db;min-height:36px;padding:8px 20px;font-size:14px;font-weight:500;transition:all .2s}.ai-config-footer .cancel-edit-btn:hover{background:#f9fafb;border-color:#9ca3af}.ai-config-footer .save-btn{border-radius:var(--border-radius-md);cursor:pointer;color:#fff;background:#1f2937;border:1px solid #1f2937;min-height:36px;padding:8px 24px;font-size:14px;font-weight:500;transition:all .2s}.ai-config-footer .save-btn:hover:not(:disabled){background:#111827;border-color:#111827}.ai-config-footer .save-btn:disabled{opacity:.45;cursor:not-allowed}@media (width<=900px){.ai-config-body{flex-direction:column;overflow-y:auto}.ai-config-left{border-bottom:1px solid #e5e7eb;border-right:none;overflow-y:visible}.ai-config-right{overflow:visible}.ai-config-prompt-textarea--system{height:240px}}@media (width<=600px){.ai-config-modal{border-radius:0;width:100%;max-height:100vh}.ai-config-left,.ai-config-right{padding:16px}.ai-config-footer{padding:10px 16px}.ai-book-tab{padding:var(--spacing-md)}}.reading-history{padding:0}.history-timeline{flex-direction:column;display:flex;position:relative}.timeline-vertical-line{background-color:var(--color-gray-300);z-index:0;width:2px;position:absolute;left:12px}.history-empty{text-align:center;color:var(--color-gray-400);font-size:var(--font-size-sm);padding:32px 16px}.timeline-item{align-items:flex-start;padding-bottom:8px;display:flex;position:relative}.timeline-vertical-line{background-color:var(--color-gray-300);z-index:0;width:2px;position:absolute;top:52px;left:12px}.timeline-marker{z-index:1;flex-direction:column;flex-shrink:0;align-items:center;width:24px;display:flex;position:relative}.timeline-dot{background-color:var(--color-gray-600);z-index:2;border-radius:50%;flex-shrink:0;width:16px;height:16px;margin-top:22px;position:relative}.add-dot{border:2px dashed var(--color-gray-400);background-color:#0000;border-style:dashed;border-radius:50%;flex-shrink:0;width:16px;height:16px;margin-top:22px}.timeline-record:not(:last-child):after{content:"";background-color:var(--color-gray-300);z-index:1;width:2px;position:absolute;top:38px;bottom:-10px;left:11px}.timeline-add{z-index:2;position:relative}.timeline-add .timeline-marker{display:none}.timeline-add+.timeline-record:not(:last-child):after{top:38px}.timeline-content{flex-direction:column;flex:1;align-items:stretch;padding-top:8px;padding-left:8px;display:flex}.session-display{cursor:pointer;border-radius:var(--border-radius-md);border:1px solid var(--color-gray-200);background-color:var(--color-white);box-sizing:border-box;flex-direction:row;flex:1;align-items:center;gap:12px;width:100%;padding:10px 12px;transition:background-color .2s;display:flex}.session-display:hover{background-color:var(--color-gray-50);border-color:var(--color-gray-300)}.session-display .session-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-gray-700);flex-shrink:0;min-width:72px;margin-right:16px}.session-dates{font-size:var(--font-size-sm);color:var(--color-gray-500);flex-wrap:nowrap;align-items:center;gap:6px;display:flex}.ongoing-tag{color:#d97706;border-radius:var(--border-radius-full);font-size:11px;font-weight:var(--font-weight-medium);background-color:#fef3c7;margin-left:4px;padding:1px 8px;display:inline-block}.session-edit{background-color:var(--color-gray-50);border:1px solid var(--color-gray-200);border-radius:var(--border-radius-md);box-sizing:border-box;flex:1;width:100%}.session-edit-row{box-sizing:border-box;flex-shrink:0;align-items:center;gap:8px;width:100%;padding:10px 12px;display:flex}.session-edit-row .session-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-gray-700);flex-shrink:0;min-width:72px;margin-right:16px}.session-edit-row .date-picker-input{flex:1;min-width:0;font-size:var(--font-size-sm)!important;padding:6px 8px!important}.session-arrow{color:var(--color-gray-400);flex-shrink:0}.session-edit-actions{flex-shrink:0;gap:6px;margin-left:auto;display:flex}.session-edit-cancel,.session-delete{padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--border-radius-md);font-size:var(--font-size-sm);cursor:pointer;font-family:var(--font-family);box-sizing:border-box;text-align:center;border:none;flex-shrink:0;justify-content:center;align-items:center;height:28px;transition:all .2s;display:inline-flex}.session-edit-cancel{background-color:var(--color-gray-800);color:var(--color-white);border:none}.session-edit-cancel:hover{background-color:var(--color-gray-700)}.session-delete{background-color:var(--color-white);color:var(--color-gray-700);border:1px solid var(--color-gray-300)}.session-delete:hover{background-color:var(--color-gray-50);border-color:var(--color-gray-400);color:var(--color-gray-700)}.add-history-btn{border:1px dashed var(--color-gray-300);border-radius:var(--border-radius-md);width:100%;color:var(--color-gray-500);font-size:var(--font-size-sm);cursor:pointer;font-family:var(--font-family);text-align:center;background:0 0;padding:10px 12px;transition:all .2s;display:block}.add-history-btn:hover{border-color:var(--color-gray-400);color:var(--color-gray-700)}@media (width<=768px){.reading-history{padding:4px 0}.timeline-item{padding-bottom:8px;display:flex;position:relative}.timeline-marker{z-index:1;flex-direction:column;align-items:center;width:18px;display:flex}.timeline-dot,.add-dot{width:14px;height:14px;margin-top:18px}.add-dot+.timeline-vertical-line{bottom:8px}.timeline-content{align-items:flex-start;padding-top:6px;padding-left:4px;display:flex}.timeline-marker:not(:last-child):after{top:32px;bottom:16px;left:8px}.session-display{gap:12px;padding:10px 8px}.session-display .session-label{white-space:nowrap;flex-shrink:0;min-width:84px;margin-right:0;font-size:15px}.session-dates{white-space:nowrap;gap:4px;font-size:15px;overflow:hidden}.add-history-btn{padding:8px 10px;font-size:15px}.history-empty{padding:16px 8px;font-size:15px}.session-edit{padding:0}.session-edit-row{box-sizing:border-box;flex-wrap:wrap;gap:6px;width:100%;padding:8px 10px}.session-edit-row .session-label{flex-shrink:0;min-width:84px;margin-right:0;font-size:15px}.session-arrow{color:var(--color-gray-400);flex-shrink:0;font-size:14px;display:inline-block}.session-edit-row .date-picker-input{flex:none!important;width:110px!important;padding:4px 6px!important;font-size:15px!important}.session-edit-actions{justify-content:flex-end;width:100%;margin-top:6px}.session-edit-cancel,.session-delete{min-width:50px;height:24px;padding:4px 10px;font-size:13px}.timeline-line{top:32px;left:8px}}.detail-overlay{background-color:var(--color-gray-50);z-index:2000;cursor:default;flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden}.detail-content{cursor:default;flex-direction:column;height:100%;display:flex;overflow:hidden}.detail-header{padding:var(--spacing-lg) var(--spacing-xl);background-color:var(--color-white);border-bottom:1px solid var(--color-gray-200);flex-shrink:0;justify-content:space-between;align-items:center;height:64px;display:flex;box-shadow:0 1px 3px #0000000d}.back-btn{color:var(--color-gray-700);cursor:pointer;font-size:var(--font-size-base);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius-md);align-items:center;gap:var(--spacing-xs);font-weight:var(--font-weight-medium);background:0 0;border:none;transition:all .2s;display:flex}.back-btn:hover{background-color:var(--color-gray-100);color:var(--color-gray-900)}.back-btn svg{width:20px;height:20px}.save-btn{font-size:var(--font-size-base)}.detail-info-section{gap:var(--spacing-xl);padding:var(--spacing-lg) var(--spacing-xl);background-color:var(--color-white);border-bottom:1px solid var(--color-gray-200);flex-shrink:0;align-items:center;width:100%;max-width:1000px;margin:0 auto;display:flex}.detail-cover-wrapper{align-items:center;gap:var(--spacing-sm);flex-direction:column;flex-shrink:0;display:flex}.detail-cover{border-radius:var(--border-radius-lg);flex-shrink:0;justify-content:center;align-items:center;width:140px;height:196px;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 12px #00000026}.detail-cover:before{content:"";pointer-events:none;background:linear-gradient(135deg,#ffffff1a 0%,#0000000d 100%);position:absolute;inset:0}.detail-cover-title{color:var(--color-white);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);text-align:center;padding:var(--spacing-md);text-shadow:0 2px 8px #0006;z-index:1;line-height:1.4}.detail-meta{cursor:default;flex-direction:column;flex:1;justify-content:center;min-width:0;display:flex}.detail-title{font-size:22px;font-weight:var(--font-weight-bold);color:var(--color-gray-900);margin:0;line-height:1.2}.meta-row{font-size:var(--font-size-sm);color:var(--color-gray-600);margin-bottom:var(--spacing-sm);align-items:center;gap:var(--spacing-xs);flex-wrap:wrap;min-height:34px;display:flex}.detail-view-mode .meta-row{min-height:24px}.meta-row:first-child{margin-top:0}.meta-label{color:#4b5563;margin-right:var(--spacing-sm);flex-shrink:0;width:40px;min-width:40px;font-size:14px;font-weight:600}.meta-row .date-picker-container{flex:unset;width:200px}.meta-row .date-picker-input{height:34px;padding:8px 12px;font-size:14px;width:100%!important}.meta-row .date-picker-input:focus{box-shadow:0 0 0 3px #0ea5e91a}.rating .star{font-size:16px}.rating .star.filled{color:#ffb800}.tags{gap:var(--spacing-xs);flex-wrap:wrap;display:flex}.tag:hover{background:var(--color-gray-200);border-color:var(--color-gray-300)}.novel-reading-date{align-items:center;gap:4px;display:flex}.no-tags{color:var(--color-gray-400);font-style:italic}.edit-info-btn{border:1px solid var(--color-gray-300);color:var(--color-gray-600);cursor:pointer;padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--border-radius-md);align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);background:0 0;flex-shrink:0;transition:all .2s;display:flex}.edit-info-btn:hover{background-color:var(--color-gray-100);border-color:var(--color-gray-400);color:var(--color-gray-800);transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.edit-info-btn svg{width:12px;height:12px}.save-edit-btn,.cancel-edit-btn{box-sizing:border-box;min-height:34px;padding:8px 20px;font-size:14px}.detail-section h2.detail-title{font-size:18px}.edit-actions-desktop{gap:var(--spacing-sm);flex-shrink:0;margin-left:auto;display:flex}.edit-actions-mobile{display:none}@media (width>=769px){.edit-actions-mobile{display:none!important}}.detail-edit-input{width:200px;height:34px;padding:8px 12px;font-size:14px}.meta-row select.detail-edit-input{appearance:none;text-align:left;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%236b7280'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");background-position:right 8px center;background-repeat:no-repeat;width:200px;padding:0 30px 0 8px}.detail-section .meta-label{color:#4b5563;font-size:14px;font-weight:600}.detail-edit-input:focus{box-shadow:0 0 0 3px #0ea5e91a}.tags-edit{flex-direction:column;flex-shrink:0;flex-basis:200px;display:flex}.tags-edit .editable-tag{font-size:13px}.tags-list{gap:var(--spacing-xs);flex-wrap:wrap;display:flex}.add-tag-row{gap:var(--spacing-xs);flex-shrink:0;align-items:center;display:flex}.add-tag-row .tag-input{flex:1;min-width:0;height:34px;padding:8px 12px;font-size:14px}.tag-input:focus,.add-tag-row .tag-input:focus{box-shadow:0 0 0 3px #0ea5e91a}.tag-input::placeholder,.meta-row .date-picker-input::placeholder{color:var(--color-gray-400);text-align:left;font-size:14px}.add-tag-btn{background-color:var(--color-gray-800);border-radius:var(--border-radius-md);padding:4px var(--spacing-sm);cursor:pointer;min-height:32px;color:var(--color-white);border:none;justify-content:center;align-items:center;font-size:16px;transition:all .2s;display:flex;box-shadow:0 1px 2px #0000001a}.add-tag-btn:hover{background-color:var(--color-gray-700);transform:scale(1.05)}.detail-tabs-nav{background-color:var(--color-white);padding:0 var(--spacing-xl);border-bottom:1px solid var(--color-gray-200);flex-shrink:0;gap:0;width:100%;max-width:1000px;margin:0 auto;display:flex}.detail-tab{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base);color:var(--color-gray-600);cursor:pointer;font-weight:var(--font-weight-medium);background:0 0;border:none;border-bottom:3px solid #0000;align-items:center;gap:6px;transition:all .3s;display:flex;position:relative}.detail-tab:after{content:"";background-color:var(--color-gray-800);height:3px;transition:transform .3s;position:absolute;bottom:-1px;left:0;right:0;transform:scaleX(0)}.detail-tab:hover{color:var(--color-gray-900);background-color:var(--color-gray-50)}.detail-tab.active{color:var(--color-gray-800);background-color:var(--color-white)}.detail-tab.active:after{transform:scaleX(1)}.detail-tab svg{flex-shrink:0}.detail-tab.active svg{color:var(--color-gray-800)}.detail-tab-content{background-color:var(--color-gray-50);flex-direction:column;flex:1;display:flex;overflow:hidden}.detail-editor-section{padding:var(--spacing-xl);background-color:var(--color-white);width:100%;max-width:1000px;box-shadow:none;border-top:1px solid var(--color-gray-200);border-radius:0;flex:1;margin:0 auto;display:flex}.detail-textarea{width:100%;height:100%;font-size:var(--font-size-base);font-family:var(--font-family);resize:none;color:var(--color-gray-700);border:none;outline:none;line-height:1.8}.detail-textarea::placeholder{color:var(--color-gray-400)}.detail-excerpts-section,.detail-history-section{padding:var(--spacing-xl);background-color:var(--color-white);width:100%;max-width:1000px;box-shadow:none;border-top:1px solid var(--color-gray-200);border-radius:0;flex:1;margin:0 auto;overflow-y:auto}.excerpts-empty-state{height:100%;min-height:300px;color:var(--color-gray-400);flex-direction:column;justify-content:center;align-items:center;display:flex}.excerpts-empty-state svg{margin-bottom:var(--spacing-lg);opacity:.4}.excerpts-empty-state p{font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);color:var(--color-gray-500);margin:0}.excerpts-empty-state .empty-hint{font-size:var(--font-size-sm);color:var(--color-gray-400);margin-top:var(--spacing-xs)}@media (width<=768px){.detail-header{padding:var(--spacing-xs) var(--spacing-sm);height:36px}.back-btn{padding:2px var(--spacing-xs);font-size:var(--font-size-xs)}.back-btn span,.save-btn span{display:none}.detail-content{padding:var(--spacing-md)}.detail-info-section{padding:var(--spacing-md);align-items:center;gap:var(--spacing-xl);flex-flow:wrap}.detail-cover-wrapper{flex-direction:column;flex-shrink:0;align-items:center;width:120px;display:flex}.detail-cover{border-radius:var(--border-radius-lg);flex-shrink:0;justify-content:center;align-items:center;width:120px;height:168px;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 12px #00000026}.detail-cover:before{content:"";pointer-events:none;background:linear-gradient(135deg,#ffffff1a 0%,#0000000d 100%);position:absolute;inset:0}.detail-cover-title{color:var(--color-white);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);text-align:center;padding:var(--spacing-sm);text-shadow:0 2px 8px #0006;z-index:1;line-height:1.4}.edit-actions-mobile{gap:var(--spacing-xs);flex-shrink:0;margin-left:auto;display:flex}.edit-actions-desktop{display:none}.detail-meta{text-align:left;flex:1;width:auto;min-width:0}.detail-title{margin:0 0 2px;font-size:20px;line-height:1.4}.detail-view-mode>div:first-child{margin-top:0;margin-bottom:2px}.meta-row{justify-content:flex-start;min-height:28px;margin-bottom:4px;font-size:12px}.meta-label{flex-shrink:0;width:28px;min-width:28px;font-size:12px}.rating .star{font-size:16px}.rating .star svg{width:16px;height:16px}.detail-edit-input,.meta-row select.detail-edit-input,.meta-row .date-picker-input,.add-tag-row .tag-input{width:100%;max-width:160px;height:28px;padding:2px 6px;font-size:12px}.meta-row select.detail-edit-input{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='%236b7280'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");background-position:right 6px center;background-repeat:no-repeat;padding:0 24px 0 6px}.meta-row .date-picker-container{width:100%;max-width:160px;height:28px;box-shadow:none;box-sizing:border-box;background:0 0;border:none;flex:1;padding:0}.meta-row .date-picker-input{box-shadow:none!important}.tags-edit{flex-basis:auto;width:auto;max-width:none}.add-tag-row{gap:0;width:auto;max-width:none}.add-tag-row .tag-input{border-radius:var(--border-radius-md) 0 0 var(--border-radius-md);flex-shrink:0;width:132px;max-width:none}.add-tag-btn{border-radius:0 var(--border-radius-md) var(--border-radius-md) 0;box-sizing:border-box;flex-shrink:0;width:28px;min-height:28px;padding:2px 6px;font-size:14px}.tag-input::placeholder,.meta-row .date-picker-input::placeholder{font-size:12px}.tags{gap:3px}.tag{border-radius:10px;padding:1px 5px;font-size:11px;line-height:1.5}.tags-edit .editable-tag{padding:2px 20px 2px 6px;font-size:11px}.remove-tag-btn{width:14px;height:14px;font-size:12px;right:3px}.detail-tabs-nav{padding:0 var(--spacing-md);-webkit-overflow-scrolling:touch;flex-wrap:nowrap;justify-content:flex-start;max-width:100%;overflow-x:auto}.detail-tabs-nav::-webkit-scrollbar{display:none}.detail-tab{padding:var(--spacing-sm) var(--spacing-md);flex-shrink:0;min-width:auto;font-size:14px}.detail-tab span{font-size:14px}.detail-editor-section{margin:var(--spacing-sm);padding:var(--spacing-sm);width:calc(100% - var(--spacing-md))}.detail-textarea{font-size:var(--font-size-sm);line-height:1.5}.detail-excerpts-section{padding:var(--spacing-sm);font-size:var(--font-size-sm)}.save-btn,.save-edit-btn,.cancel-edit-btn,.edit-info-btn{box-sizing:border-box;min-height:28px;padding:4px 6px;font-size:12px}}.detail-ai-section{background-color:var(--color-white);width:100%;max-width:1000px;box-shadow:none;border-top:1px solid var(--color-gray-200);border-radius:0;flex:1;margin:0 auto;overflow-y:auto}.ai-book-tab{padding:var(--spacing-lg);flex-direction:column;height:100%;display:flex}.ai-book-toolbar{margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-md);border-bottom:1px solid var(--color-gray-200);justify-content:space-between;align-items:center;display:flex}.ai-book-toolbar-info{align-items:center;gap:var(--spacing-sm);display:flex}.ai-book-target{font-size:var(--font-size-sm);color:var(--color-gray-600);font-weight:var(--font-weight-medium)}.ai-book-generate-btn{align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-md);background-color:var(--color-gray-800);color:var(--color-white);border:1px solid var(--color-gray-800);border-radius:var(--border-radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;box-sizing:border-box;height:38px;transition:all .2s;display:flex}.ai-book-generate-btn:hover:not(:disabled){background-color:var(--color-gray-700);border-color:var(--color-gray-700)}.ai-book-generate-btn:disabled{opacity:.6;cursor:not-allowed}.ai-book-generate-btn.loading{background-color:var(--color-gray-700)}.ai-book-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:14px;height:14px;animation:.8s linear infinite ai-spin}@keyframes ai-spin{to{transform:rotate(360deg)}}.ai-book-content{color:var(--color-gray-700);line-height:1.8;font-size:var(--font-size-base);flex:1;overflow-y:auto}.ai-book-content strong{color:var(--color-gray-900);font-weight:var(--font-weight-semibold)}.ai-book-content blockquote{padding:var(--spacing-md) var(--spacing-lg);margin:var(--spacing-md) 0;border-radius:0 var(--border-radius-md) var(--border-radius-md) 0;background:linear-gradient(135deg,#f8fafc 0%,#f1f5f9 100%);border-left:3px solid #667eea}.ai-book-content blockquote p{margin:var(--spacing-xs) 0;line-height:1.6}.ai-book-content blockquote strong{color:#667eea}.ai-book-content li{margin-left:var(--spacing-lg);margin-bottom:var(--spacing-xs);position:relative}.ai-book-content li:before{content:"•";left:calc(var(--spacing-lg) * -1);color:var(--color-gray-400);position:absolute}.ai-book-content br{content:"";margin-bottom:var(--spacing-sm);display:block}.ai-book-empty{color:var(--color-gray-400);text-align:center;padding:var(--spacing-xl);flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}.ai-book-empty-idle{min-height:300px}.ai-book-empty-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);color:var(--color-gray-500);margin:var(--spacing-md) 0 var(--spacing-xs)}.ai-book-empty-hint{font-size:var(--font-size-sm);color:var(--color-gray-400);margin:0}.ai-book-env-code{background:var(--color-gray-100);padding:var(--spacing-md);border-radius:var(--border-radius-md);font-family:monospace;font-size:var(--font-size-sm);text-align:left;margin:var(--spacing-md) 0;white-space:pre-wrap;word-break:break-all;color:var(--color-gray-700)}.ai-book-error{align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md);border-radius:var(--border-radius-md);color:#dc2626;margin-bottom:var(--spacing-lg);background:#fef2f2;border:1px solid #fecaca;display:flex}.ai-book-retry-btn{padding:var(--spacing-xs) var(--spacing-md);color:#fff;border-radius:var(--border-radius-md);font-size:var(--font-size-sm);cursor:pointer;background:#dc2626;border:none;margin-left:auto;transition:background .2s}.ai-book-retry-btn:hover{background:#b91c1c}.ai-book-loading{min-height:300px;color:var(--color-gray-500);flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}.ai-book-loading p{margin-top:var(--spacing-md);font-size:var(--font-size-sm)}.ai-book-loading-dots{gap:var(--spacing-xs);display:flex}.ai-book-loading-dots span{background:#667eea;border-radius:50%;width:8px;height:8px;animation:1.4s ease-in-out infinite ai-bounce}.ai-book-loading-dots span:first-child{animation-delay:0s}.ai-book-loading-dots span:nth-child(2){animation-delay:.2s}.ai-book-loading-dots span:nth-child(3){animation-delay:.4s}@media (width<=768px){.detail-ai-section{padding:var(--spacing-sm)}.ai-book-tab{padding:var(--spacing-md)}.ai-book-toolbar{gap:var(--spacing-sm);flex-direction:column;align-items:stretch}.ai-book-toolbar-info,.ai-book-generate-btn{justify-content:center}.ai-book-content{font-size:var(--font-size-sm);line-height:1.6}.ai-book-content blockquote{padding:var(--spacing-sm) var(--spacing-md);margin:var(--spacing-sm) 0}.ai-book-env-code{padding:var(--spacing-sm);font-size:12px}}.stats-overlay{background-color:var(--color-gray-50);z-index:3000;--trend-dash-len:10000;flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden}@keyframes trendDraw{0%{stroke-dashoffset:var(--trend-dash-len)}to{stroke-dashoffset:0}}@keyframes trendFadeIn{0%{opacity:0}to{opacity:1}}.trend-chart-svg path:not([fill]){stroke-dasharray:var(--trend-dash-len);animation:.5s forwards trendDraw}.trend-line-mobile{opacity:0;animation:.4s .1s forwards trendFadeIn}.trend-area-mobile{opacity:0;animation:.5s .2s forwards trendFadeIn}.trend-chart-svg circle,.trend-chart-svg text{animation:.3s forwards trendFadeIn}.stats-overlay{cursor:default}.stats-content{cursor:default;flex-direction:column;flex:1;height:100%;min-height:0;display:flex;overflow:hidden auto}.stats-header{padding:var(--spacing-lg) var(--spacing-2xl);background-color:var(--color-white);border-bottom:1px solid var(--color-gray-200);z-index:10;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.back-stats-btn{color:#374151;cursor:pointer;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius-md);align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);background:0 0;border:none;transition:all .2s;display:flex}.back-stats-btn:hover{background-color:var(--color-gray-100);color:var(--color-gray-800)}.stats-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-gray-800);margin:0}.stats-body{padding:var(--spacing-2xl);width:100%;max-width:1400px;margin:0 auto}.stats-section{background-color:var(--color-white);border-radius:var(--border-radius-lg);padding:var(--spacing-xl);margin-bottom:var(--spacing-xl);box-shadow:var(--shadow-sm)}.stats-row{gap:var(--spacing-xl);margin-bottom:var(--spacing-xl);grid-template-columns:1fr 1fr;display:grid}.section-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-gray-800);margin:0 0 var(--spacing-lg);justify-content:space-between;align-items:center;display:flex}.section-value{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:#374151}.section-header-with-controls{margin-bottom:var(--spacing-lg);justify-content:space-between;align-items:center;display:flex}.section-header-with-controls .section-title{margin:0}.trend-controls{background-color:var(--color-gray-100);border-radius:var(--border-radius-full);padding:3px;display:flex;position:relative}.trend-btn{padding:var(--spacing-xs) var(--spacing-lg);border-radius:var(--border-radius-full);cursor:pointer;font-size:var(--font-size-sm);color:var(--color-gray-500);z-index:1;background:0 0;border:none;transition:color .25s;position:relative}.trend-btn:hover{color:var(--color-gray-700)}.trend-btn.active{color:var(--color-gray-800);background-color:var(--color-white);box-shadow:0 1px 3px #00000014}.pie-chart-container{align-items:center;gap:var(--spacing-lg);padding:var(--spacing-md) 0;flex-direction:column;display:flex}.pie-legend{gap:var(--spacing-lg);flex-wrap:wrap;justify-content:center;display:flex}.legend-item{align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-sm);color:var(--color-gray-700);display:flex}.legend-color{border-radius:50%;width:12px;height:12px}.legend-label{color:var(--color-gray-600)}.legend-value{font-weight:var(--font-weight-medium);color:var(--color-gray-800)}.empty-chart{text-align:center;padding:var(--spacing-3xl);color:var(--color-gray-400)}.rating-bar-chart{height:240px;padding:var(--spacing-md) var(--spacing-md);justify-content:space-around;align-items:flex-end;display:flex}.rating-bar-column{flex-direction:column;flex:1;justify-content:flex-end;align-items:center;gap:0;max-width:80px;height:100%;display:flex}.rating-bar{border-radius:9999px 9999px 0 0;width:50px;min-height:2px;transition:height .3s}.rating-value{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-gray-800);order:-1;margin-bottom:4px}.rating-label{font-size:var(--font-size-xs);color:var(--color-gray-500);margin-top:4px}.leaderboard-section{background-color:var(--color-white);border-radius:var(--border-radius-lg);padding:var(--spacing-xl);box-shadow:var(--shadow-sm)}.leaderboard-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-gray-800);margin:0 0 var(--spacing-lg)}.leaderboard-list{gap:var(--spacing-sm);flex-direction:column;display:flex}.leaderboard-item{align-items:center;gap:var(--spacing-md);padding:var(--spacing-sm);background-color:var(--color-gray-50);border-radius:var(--border-radius-md);display:flex}.leaderboard-rank{color:#fff;width:24px;height:24px;font-size:12px;font-weight:var(--font-weight-semibold);background:#ef476f;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.leaderboard-content{flex-direction:column;flex:1;gap:6px;display:flex}.leaderboard-name{font-size:var(--font-size-sm);color:var(--color-gray-800);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.leaderboard-bar{background-color:var(--color-gray-200);border-radius:3px;height:6px;overflow:hidden}.leaderboard-bar-fill{border-radius:3px;height:100%;transition:width .3s}.leaderboard-count{text-align:right;min-width:30px;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-gray-800)}.empty-leaderboard{text-align:center;padding:var(--spacing-3xl);color:var(--color-gray-400)}.line-chart-container{width:100%;padding:var(--spacing-md) 0;scroll-behavior:smooth;animation:.3s chartFadeSlide;overflow-x:auto}.line-chart-container::-webkit-scrollbar{height:6px}.line-chart-container::-webkit-scrollbar-track{background:var(--color-gray-100);border-radius:3px}.line-chart-container::-webkit-scrollbar-thumb{background:var(--color-gray-300);border-radius:3px}@keyframes chartFadeSlide{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.line-chart-container svg{min-width:100%;margin:0 auto;display:block}@media (width<=1024px){.stats-row{grid-template-columns:1fr}}@media (width<=768px){.stats-header{padding:var(--spacing-md) var(--spacing-lg)}.stats-title{font-size:var(--font-size-xl)}.stats-body{padding:var(--spacing-lg)}.rating-bar-chart{height:180px;padding:var(--spacing-md) var(--spacing-sm)}.rating-bar{width:35px}.pie-chart-container svg{width:160px;height:160px}.line-chart-container svg,.line-chart-container{font-size:9px}}.recent-section{border-top:1px solid var(--color-gray-200);align-items:stretch;gap:24px;margin-top:24px;padding-top:24px;display:flex}.recent-books,.recent-excerpts{flex:1;min-width:0}.recent-books h3,.recent-excerpts h3{font-size:16px;font-weight:var(--font-weight-semibold);color:var(--color-gray-800);margin:0 0 12px}.recent-books-list{gap:12px;padding-bottom:4px;display:flex;overflow-x:auto}.recent-book-item{cursor:pointer;text-align:center;flex-shrink:0;transition:transform .2s}.recent-book-item:hover{transform:translateY(-2px)}.recent-book-cover{border-radius:6px;justify-content:center;align-items:center;width:110px;height:154px;margin-bottom:8px;display:flex;box-shadow:0 2px 8px #00000026}.cover-initial{color:#fffc;font-size:38px;font-weight:700}.recent-book-title{text-overflow:ellipsis;white-space:nowrap;max-width:110px;color:var(--color-gray-600);font-size:13px;overflow:hidden}.recent-excerpts-list{grid-template-columns:1fr 1fr;gap:10px;display:grid}.recent-excerpt-card{background:var(--color-gray-50);cursor:pointer;border-radius:6px;padding:10px 12px;transition:background .2s}.recent-excerpt-card:hover{background:var(--color-gray-100)}.excerpt-card-header{color:var(--color-gray-500);margin-bottom:6px;font-size:13px}.excerpt-card-content{color:var(--color-gray-700);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:13px;line-height:1.5;display:-webkit-box;overflow:hidden}.empty-recent{color:var(--color-gray-400);padding:20px 0;font-size:13px}@media (width<=768px){.recent-section{flex-direction:column;gap:16px}.recent-book-cover{width:80px;height:112px}.cover-initial{font-size:28px}.recent-book-title{max-width:80px;font-size:11px}}.auth-overlay{z-index:3000;background-color:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.auth-modal{background-color:var(--color-white);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-lg);width:90%;max-width:400px;max-height:90vh;overflow-y:auto}.auth-header{padding:var(--spacing-lg);border-bottom:1px solid var(--color-gray-200);justify-content:space-between;align-items:center;display:flex}.auth-header h2{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-gray-800);margin:0}.auth-close-btn{cursor:pointer;color:var(--color-gray-400);border-radius:var(--border-radius-md);background:0 0;border:none;justify-content:center;align-items:center;width:32px;height:32px;padding:0;font-size:24px;transition:background-color .2s;display:flex}.auth-close-btn:hover{background-color:var(--color-gray-100)}.auth-form{padding:var(--spacing-lg)}.auth-error{color:#dc2626;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius-md);margin-bottom:var(--spacing-md);font-size:var(--font-size-sm);background-color:#fee2e2}.auth-form .form-group{margin-bottom:var(--spacing-md)}.auth-form label{margin-bottom:var(--spacing-sm);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-gray-700);display:block}.auth-form input{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-gray-300);border-radius:var(--border-radius-md);font-size:var(--font-size-base);font-family:var(--font-family);transition:border-color .2s}.auth-form input:focus{border-color:var(--color-gray-400);outline:none}.auth-form button[type=submit]{width:100%;padding:var(--spacing-md);margin-top:var(--spacing-md)}.auth-toggle{text-align:center;margin-top:var(--spacing-md);font-size:var(--font-size-sm);color:var(--color-gray-600)}.auth-toggle button{color:var(--color-gray-800);font-weight:var(--font-weight-medium);cursor:pointer;margin-left:var(--spacing-xs);background:0 0;border:none;padding:0;text-decoration:underline}.auth-toggle button:hover{color:var(--color-gray-600)}.user-avatar-container{padding:2px 0 36px;position:relative}.user-avatar{width:36px;height:36px;color:var(--color-white);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:50%;justify-content:center;align-items:center;transition:all .2s;display:flex;box-shadow:0 2px 4px #0000001a}.user-avatar:hover{transform:scale(1.05);box-shadow:0 4px 8px #00000026}.user-menu-compact{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--border-radius-md);z-index:1000;width:80px;position:absolute;top:calc(100% - 36px);right:0;overflow:hidden;box-shadow:0 2px 8px #0000001a}.user-menu-item-compact{width:100%;color:var(--color-text);font-size:var(--font-size-sm);cursor:pointer;text-align:left;font-family:var(--font-family);background:0 0;border:none;padding:8px 12px;transition:background .2s}.user-menu-item-compact:hover{background:var(--color-bg-hover)}.user-menu{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--border-radius-md);z-index:1000;min-width:200px;max-width:100%;position:absolute;top:calc(100% + 8px);right:0;overflow:hidden;box-shadow:0 4px 12px #00000026}.user-menu-info{padding:12px 16px}.user-menu-email{font-size:var(--font-size-sm);color:var(--color-text-secondary);word-break:break-all}.user-menu-divider{background:var(--color-border);height:1px}.user-menu-item{width:100%;color:var(--color-text);font-size:var(--font-size-sm);cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;padding:10px 16px;transition:background .2s;display:flex}.user-menu-item:hover{background:var(--color-bg-hover)}.user-menu-item svg{flex-shrink:0}