*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;color:#333;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh}
.container{max-width:1200px;margin:0 auto;padding:20px}
.navbar{background:rgba(255,255,255,0.95);padding:15px 20px;box-shadow:0 2px 10px rgba(0,0,0,0.1);position:sticky;top:0;z-index:1000}
.navbar .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}
.logo{font-size:1.5rem;font-weight:bold;color:#667eea;text-decoration:none}
.nav-links{display:flex;gap:20px;list-style:none;flex-wrap:wrap}
.nav-links a{color:#333;text-decoration:none;padding:8px 16px;border-radius:5px;transition:all 0.3s}
.nav-links a:hover,.nav-links a.active{background:#667eea;color:white}
.books-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:25px;margin-top:30px}
.book-card{background:white;border-radius:15px;overflow:hidden;box-shadow:0 5px 15px rgba(0,0,0,0.1);transition:transform 0.3s;cursor:pointer}
.book-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(0,0,0,0.2)}
.book-cover{height:200px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);display:flex;align-items:center;justify-content:center;font-size:4rem}
.book-info{padding:20px}
.book-title{font-size:1.2rem;font-weight:bold;margin-bottom:10px;color:#333}
.book-author{color:#666;font-size:0.9rem;margin-bottom:10px}
.book-meta{display:flex;justify-content:space-between;color:#888;font-size:0.85rem}
.book-chapter-count{background:#667eea;color:white;padding:3px 10px;border-radius:10px;font-size:0.8rem}
.book-detail{background:white;border-radius:15px;padding:30px;box-shadow:0 5px 15px rgba(0,0,0,0.1);margin-top:20px}
.detail-header{margin-bottom:30px;padding-bottom:20px;border-bottom:2px solid #f0f0f0}
.detail-title{font-size:2rem;color:#667eea;margin-bottom:15px}
.detail-info{display:flex;gap:30px;color:#666;flex-wrap:wrap}
.chapter-list{margin-top:30px}
.chapter-item{padding:15px 20px;border-bottom:1px solid #f0f0f0;cursor:pointer;transition:background 0.3s}
.chapter-item:hover{background:#f8f9ff}
.chapter-item.active{background:#667eea;color:white}
.chapter-title{font-weight:bold;margin-bottom:5px}
.chapter-meta{font-size:0.85rem;color:#888}
.reader{background:#f9f9f9;min-height:60vh;padding:30px;border-radius:10px}
.reader-content{background:white;padding:40px;border-radius:10px;line-height:2;font-size:1.1rem;max-width:800px;margin:0 auto;box-shadow:0 2px 10px rgba(0,0,0,0.05)}
.reader-content h1{font-size:1.8rem;color:#667eea;margin-bottom:20px}
.reader-content p{margin-bottom:25px;text-indent:2em}
.reader-nav{display:flex;justify-content:space-between;margin-top:20px;gap:10px}
.nav-btn{flex:1;padding:12px 20px;border:none;border-radius:8px;background:#667eea;color:white;cursor:pointer;font-size:1rem;transition:background 0.3s}
.nav-btn:hover{background:#5568d3}
.nav-btn:disabled{opacity:0.5;cursor:not-allowed}
.api-panel{background:white;border-radius:15px;padding:30px;box-shadow:0 5px 15px rgba(0,0,0,0.1);margin-top:20px}
.api-form{display:flex;flex-direction:column;gap:20px;max-width:600px}
.form-group{display:flex;flex-direction:column;gap:8px}
.form-group label{font-weight:bold;color:#333}
.form-group input,.form-group textarea,.form-group select{padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:border-color 0.3s}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:#667eea}
.form-group textarea{min-height:100px;resize:vertical}
.btn{padding:12px 24px;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:all 0.3s;font-weight:bold}
.btn-primary{background:#667eea;color:white}
.btn-primary:hover{background:#5568d3}
.toast{position:fixed;bottom:30px;right:30px;padding:15px 25px;border-radius:8px;color:white;font-weight:bold;animation:slideIn 0.3s ease;z-index:10000}
.toast-success{background:#27ae60}
.toast-error{background:#e74c3c}
@keyframes slideIn{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}
@media (max-width:768px){.navbar .container{flex-direction:column;gap:15px}.nav-links{flex-wrap:wrap;justify-content:center;gap:10px}.books-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:15px;padding:0 10px}.book-cover{height:180px}.reader-content{padding:20px 15px;font-size:1rem}}