*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#f4f6f8;color:#333;line-height:1.6}header{background-color:#2c3e50;color:#fff;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center}.logo{font-size:1.5rem;font-weight:700}nav ul{list-style:none;display:flex;gap:1rem}nav a{color:#fff;text-decoration:none;font-weight:500}nav a:hover{text-decoration:underline}.container{max-width:900px;margin:2rem auto;padding:0 1rem}h1{margin-bottom:1rem;text-align:center;color:#2c3e50}#addBookBtn{display:block;margin:1rem auto 2rem;padding:.6rem 1.2rem;background-color:#3498db;color:#fff;border:none;border-radius:5px;font-size:1rem;cursor:pointer}#addBookBtn:hover{background-color:#2980b9}.book-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.book{background-color:#fff;padding:1rem;border-radius:8px;box-shadow:0 2px 6px #0000001a}img{width:150px;height:100px}.book h3{margin-bottom:.5rem;color:#34495e}.book p{margin:.3rem 0}.book a{display:inline-block;margin:.5rem 0;color:#3498db;text-decoration:none}.book a:hover{text-decoration:underline}.book button{margin-right:.5rem;margin-top:.5rem;padding:.4rem .8rem;border:none;border-radius:4px;background-color:#2ecc71;color:#fff;cursor:pointer;font-size:.9rem}.book button:last-of-type{background-color:#e74c3c}.book button:hover{opacity:.9}dialog#new-book{border:none;border-radius:8px;padding:2rem;max-width:500px;width:90%;box-shadow:0 4px 12px #0003}dialog::backdrop{background:#0006}form label{display:block;margin-top:1rem;font-weight:700}form input,form textarea{width:100%;padding:.5rem;margin-top:.3rem;border:1px solid #ccc;border-radius:4px}form button{margin-top:1.5rem;padding:.6rem 1.2rem;background-color:#27ae60;color:#fff;border:none;border-radius:5px;cursor:pointer}form button[type=submit]:hover{background-color:#1e8449}form button:last-of-type{background-color:#e74c3c}