:root {
  --bg: #f7f3ef;
  --surface: #fffdfb;
  --accent: #8f6e52;
  --text: #2f2a24;
  --muted: #70655a;
  --border: #ded2c4;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: "Vazirmatn", "IRANSans", system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.7;
}
.app-header, .reader-header { padding: 1.5rem 1rem; text-align: center; }
.app-header h1, .reader-header h1 { margin: 0; }
.app-header p, .reader-header p, .book-description, .book-author { color: var(--muted); }
main { max-width: 1180px; margin-inline: auto; }
.upload-panel {
  margin: 0 1rem 1.5rem;
  padding: 1.2rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.upload-heading, .section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.upload-heading h2, .section-heading h2 { margin: 0; }
.upload-heading p { margin: .25rem 0 0; color: var(--muted); }
.local-note { color: var(--muted); font-size: .85rem; }
.upload-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
  margin-top: 1rem;
}
.upload-form label { display: grid; gap: .35rem; font-size: .9rem; }
.upload-form input:not([type="file"]) {
  width: 100%; min-height: 42px; padding: .55rem .7rem;
  border: 1px solid var(--border); border-radius: 7px;
  background: white; color: var(--text); font: inherit;
}
.file-picker { grid-column: 1 / -1; }
.file-picker input { padding: .5rem 0; max-width: 100%; }
.upload-form button { justify-self: start; margin: 0; }
.upload-status { margin: .8rem 0 0; color: var(--muted); font-size: .9rem; }
.section-heading { padding: 0 1rem; }
#book-count { color: var(--muted); font-size: .9rem; }
.bookshelf {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 1rem;
  padding: 1rem;
}
.book-card {
  display: flex; min-width: 0; background: var(--surface);
  border: 1px solid var(--border); border-radius: 12px; overflow: hidden;
}
.book-cover { width: 110px; min-height: 170px; object-fit: cover; background: #efe7de; }
.book-content { padding: .75rem; display: flex; flex-direction: column; width: 100%; min-width: 0; }
.book-title { margin: 0; font-size: 1.05rem; }
.book-author, .book-description { margin: .25rem 0; font-size: .92rem; overflow-wrap: anywhere; }
.book-footer {
  margin-top: auto; display: flex; justify-content: space-between;
  gap: .5rem; font-size: .82rem; color: var(--muted); flex-wrap: wrap;
}
.book-actions { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.book-action, button, .back-link {
  margin-top: .6rem; display: inline-block; border: 1px solid var(--accent);
  color: var(--accent); text-decoration: none; background: transparent;
  border-radius: 7px; padding: .4rem .7rem; cursor: pointer; font: inherit;
}
button:disabled { opacity: .5; cursor: wait; }
.delete-book { border-color: #b45b50; color: #9b4037; }
.reader-main { padding: 1rem; }
.reader-status {
  background: var(--surface); border: 1px solid var(--border);
  padding: .6rem .8rem; border-radius: 8px; margin-bottom: .75rem;
}
.reader-controls { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.reader-controls button { margin: 0; }
.reader-root {
  min-height: 60vh; background: var(--surface);
  border: 1px solid var(--border); border-radius: 9px;
  padding: .5rem; overflow: auto;
}
.pdf-page-host { display: flex; justify-content: center; min-width: 0; }
#pdf-canvas { display: block; max-width: 100%; height: auto; box-shadow: 0 2px 12px #00000012; }
.html-book-frame { display: block; width: 100%; height: 72vh; min-height: 560px; border: 0; background: white; }
#epub-view { width: 100%; min-height: 65vh; }
.bookmark-list { padding-inline-start: 1rem; }
@media (max-width: 640px) {
  .upload-form { grid-template-columns: 1fr; }
  .file-picker { grid-column: auto; }
  .book-card { flex-direction: column; }
  .book-cover { width: 100%; height: 190px; min-height: 0; }
  .html-book-frame { height: 70vh; min-height: 460px; }
}
.page-input { width: 5.5rem; padding: .35rem .5rem; border: 1px solid #d9cbbd; border-radius: 6px; background: #fff; }

.epub-viewer { width: 100%; min-height: 70vh; background: #fffdfb; border-radius: 8px; }

.shelf-tools { display: flex; gap: .5rem; flex-wrap: wrap; margin: .5rem 1rem 1rem; }
.shelf-tools input, .shelf-tools select { flex: 1 1 200px; padding: .5rem .7rem; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); font: inherit; }
