body { font-family: Arial, sans-serif; margin: 20px; }
.book-card { border: 1px solid #ccc; border-radius: 8px; padding: 15px; margin-bottom: 15px; position: relative; }
.tags { margin-top: 10px; }
.tag { display: inline-block; background: #f0f0f0; padding: 4px 8px; margin: 2px; border-radius: 4px; cursor: pointer; }
.filter-buttons { margin-bottom: 20px; }
.filter-buttons .tag { background: #d0eaff; }
.filter-buttons .tag.active { background: #007acc; color: white; font-weight: bold; }
a { color: #1a0dab; text-decoration: none; }
a:hover { text-decoration: underline; }
.form-section { margin-top: 40px; border-top: 1px solid #ccc; padding-top: 20px; }
.form-section input, .form-section textarea { width: 100%; margin-bottom: 10px; padding: 8px; }
.form-section textarea {height: 100px;}
.hidden { display: none; }
.admin-buttons { position: absolute; top: 10px; right: 10px; }
.admin-buttons button { margin-left: 5px; }
#save-exit { margin-top: 20px; display: none; }
.open-button { margin-top: 10px; display: inline-block; padding: 6px 12px; background: #007acc; color: white; border: none; border-radius: 4px; text-decoration: none; }
.tag-btn {background-color: transparent; border: none; cursor: pointer; outline: none; margin: 0px; padding: 1px;}
.flexible {display: inline-flex; align-items: flex-start; gap: 10px; margin: 5px;}
.search-container {width: 100%;}
.search-container input {flex: auto; padding: 8px; box-sizing: border-box;}
.text-indented {text-indent: 10px; margin: 5px 0;}
