:root {
  --clr-primary:#6B2D3E;
  --clr-primary-dark:#4A1E2B;
  --clr-primary-light:#9B4D60;
  --clr-primary-pale:#F9F0F2;
  --clr-primary-glow:rgba(107,45,62,0.15);
  --clr-gold:#C9963F;
  --clr-gold-light:#F0C97A;
  --clr-gold-pale:#FDF6E7;
  --clr-success:#2D7D4F;
  --clr-success-pale:#EBF7F0;
  --clr-warning:#C47B1A;
  --clr-warning-pale:#FEF3E2;
  --clr-danger:#C0392B;
  --clr-danger-pale:#FDECEA;
  --clr-info:#1A6B9A;
  --clr-info-pale:#EAF4FB;
  --clr-digital:#2D5F8A;
  --clr-digital-pale:#E8F2FA;
  --clr-bg:#FAF8F5;
  --clr-surface:#FFFFFF;
  --clr-surface-warm:#FEFCF8;
  --clr-border:#E8E2DA;
  --clr-border-light:#F0EBE3;
  --clr-text-h:#1C1410;
  --clr-text-body:#3D3530;
  --clr-text-muted:#8C7B70;
  --clr-text-light:#B5A99E;
  --shadow-xs:0 1px 3px rgba(28,20,16,0.06);
  --shadow-sm:0 2px 8px rgba(28,20,16,0.08), 0 1px 3px rgba(28,20,16,0.04);
  --shadow-md:0 4px 20px rgba(28,20,16,0.10), 0 2px 6px rgba(28,20,16,0.06);
  --shadow-lg:0 12px 40px rgba(28,20,16,0.14), 0 4px 12px rgba(28,20,16,0.08);
  --shadow-card:0 0 0 1px var(--clr-border), 0 4px 16px rgba(28,20,16,0.07);
  --shadow-book:4px 4px 20px rgba(28,20,16,0.18), -1px 0 0 rgba(0,0,0,0.1);
  --space-xs:0.25rem;
  --space-sm:0.5rem;
  --space-md:1rem;
  --space-lg:1.5rem;
  --space-xl:2rem;
  --space-2xl:3rem;
  --r-sm:6px;
  --r-md:10px;
  --r-lg:16px;
  --r-xl:24px;
  --r-pill:9999px;
  --font-display:'Playfair Display', Georgia, serif;
  --font-body:'Source Sans 3', system-ui, sans-serif;
  --font-mono:'JetBrains Mono', monospace;
  --ease:cubic-bezier(0.4, 0, 0.2, 1);
  --t-fast:0.15s var(--ease);
  --t-normal:0.25s var(--ease);
  --t-slow:0.4s var(--ease);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);color:var(--clr-text-body);background:radial-gradient(circle at top right,#fff7ee 0%,var(--clr-bg) 45%,#f5efe8 100%);min-height:100vh;direction:rtl;text-align:right}
h1,h2,h3,h4,h5,h6,.heading,.book-title,.brand-title{font-family:var(--font-display);color:var(--clr-text-h);margin:0}
h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.1}
h2{font-size:clamp(1.5rem,3vw,2.3rem);line-height:1.15}
a{color:var(--clr-primary);text-decoration:none;transition:color var(--t-fast)}
a:hover{color:var(--clr-primary-dark)}
img{max-width:100%;display:block}
[dir='rtl']{text-align:right;font-family:var(--font-body)}
.mono,.isbn,.code{font-family:var(--font-mono)}
.container{width:min(1240px,100% - 2.5rem);margin-inline:auto}
.section{padding:4.5rem 0}
.card{background:var(--clr-surface);border-radius:var(--r-lg);box-shadow:var(--shadow-card);padding:1.15rem}
.grid-2{display:grid;gap:1.25rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{display:grid;gap:1.25rem;grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{display:grid;gap:1.25rem;grid-template-columns:repeat(4,minmax(0,1fr))}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:0;border-radius:var(--r-md);padding:.75rem 1rem;font-weight:600;font-size:.95rem;cursor:pointer;transition:transform var(--t-fast),box-shadow var(--t-fast),background var(--t-fast),color var(--t-fast)}
.btn:hover{transform:translateY(-1px)}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn-primary{background:linear-gradient(135deg,var(--clr-primary) 0%,var(--clr-primary-dark) 100%);color:#fff;box-shadow:var(--shadow-sm)}
.btn-primary:hover{box-shadow:var(--shadow-md)}
.btn-outline{background:transparent;border:1px solid var(--clr-primary);color:var(--clr-primary)}
.btn-outline:hover{background:var(--clr-primary-pale)}
.btn-soft{background:var(--clr-surface-warm);color:var(--clr-text-body);border:1px solid var(--clr-border)}
.btn-danger{background:var(--clr-danger);color:#fff}
.btn-gold{background:linear-gradient(135deg,var(--clr-gold) 0%,#d9a853 100%);color:#fff}

.field{display:grid;gap:.45rem}
.field label{font-size:.8rem;font-weight:600;color:var(--clr-text-muted)}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--clr-border);border-radius:var(--r-md);padding:.7rem .85rem;background:#fff;color:var(--clr-text-body);transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--clr-primary);outline:0;box-shadow:0 0 0 3px var(--clr-primary-glow)}

.status-badge{display:inline-flex;align-items:center;border-radius:var(--r-pill);padding:.2rem .6rem;font-size:.72rem;font-weight:700}
.badge-success{background:var(--clr-success-pale);color:var(--clr-success)}
.badge-warning{background:var(--clr-warning-pale);color:var(--clr-warning)}
.badge-danger{background:var(--clr-danger-pale);color:var(--clr-danger)}
.badge-info{background:var(--clr-info-pale);color:var(--clr-info)}
.badge-muted{background:#f1ece6;color:var(--clr-text-muted)}
.badge-gold{background:var(--clr-gold-pale);color:#8a5f16}

.sidebar{width:270px;flex:0 0 270px;background:linear-gradient(180deg,#2f1720 0%,#211016 50%,#1a0d12 100%);color:#f8f2ed;position:fixed;inset:0 0 0 auto;z-index:120;box-shadow:-12px 0 24px rgba(28,20,16,.2);overflow-y:auto}
.sidebar-brand{padding:1.15rem 1rem;border-bottom:1px solid rgba(255,255,255,.08)}
.sidebar-brand h2{color:#fff;font-size:1.25rem}
.sidebar nav{padding:1rem .65rem}
.sidebar nav a{display:flex;align-items:center;gap:.6rem;color:rgba(255,255,255,.82);padding:.65rem .75rem;border-radius:var(--r-md);font-size:.92rem;margin-bottom:.25rem}
.sidebar nav a:hover,.sidebar nav a.active{background:rgba(255,255,255,.12);color:#fff}
.main-content{flex:1;margin-right:270px;min-height:100vh}
.topbar{position:sticky;top:0;z-index:80;height:64px;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0 1.25rem;background:rgba(250,248,245,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--clr-border)}
.topbar .search{flex:1;max-width:500px}
.topbar-actions{display:flex;align-items:center;gap:.75rem}
.menu-toggle{display:none;width:40px;height:40px;border-radius:var(--r-md);border:1px solid var(--clr-border);background:#fff;align-items:center;justify-content:center}

.public-nav{position:sticky;top:0;z-index:90;background:rgba(255,255,255,.9);border-bottom:1px solid var(--clr-border);backdrop-filter:blur(12px)}
.public-nav-inner{display:flex;align-items:center;justify-content:space-between;min-height:72px;gap:1rem}
.public-brand{display:inline-flex;flex-direction:column;font-family:var(--font-display);color:var(--clr-text-h)}
.public-brand small{color:var(--clr-text-muted);font-family:var(--font-body);font-size:.68rem}
.public-links{display:flex;align-items:center;gap:.85rem}
.public-links a{padding:.48rem .75rem;border-radius:var(--r-md)}
.public-links a:hover,.public-links a.active{background:var(--clr-primary-pale)}

.site-footer{margin-top:3.5rem;background:linear-gradient(120deg,#28131c 0%,#180d12 100%);color:#fff;padding:2.5rem 0 2rem}
.site-footer h4{color:#fff;margin-bottom:.75rem}
.site-footer p,.site-footer a{color:rgba(255,255,255,.82)}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:1.5rem}
.home-hero{position:relative;min-height:72vh;display:grid;align-items:center;background:linear-gradient(135deg,rgba(107,45,62,.92) 0%,rgba(74,30,43,.85) 100%),radial-gradient(circle at 20% 30%,rgba(255,255,255,.16) 0%,transparent 55%),repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0,rgba(255,255,255,.05) 2px,transparent 2px,transparent 14px);color:#fff;overflow:hidden}
.hero-inner{padding:5rem 0;display:grid;gap:1rem;max-width:760px;animation:fadeInUp .6s both}
.hero-inner h1{color:#fff}
.hero-ar{font-size:1.35rem;opacity:.9}
.hero-search{margin-top:.5rem;display:flex;gap:.7rem;background:rgba(255,255,255,.16);border-radius:var(--r-pill);padding:.4rem;border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(8px)}
.hero-search input{flex:1;border:0;border-radius:var(--r-pill);background:#fff;padding:.82rem 1rem}
.hero-stats{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:.3rem}
.stat-pill{padding:.42rem .72rem;border-radius:var(--r-pill);background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.2);font-size:.8rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.45rem}
.features-grid{display:grid;gap:1rem;grid-template-columns:repeat(4,minmax(0,1fr))}
.feature-card{background:var(--clr-surface);border-radius:var(--r-lg);box-shadow:var(--shadow-card);padding:1.1rem;border-top:3px solid var(--clr-primary)}

.books-scroll {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 1rem;
  scrollbar-width: thin;
  scrollbar-color: var(--clr-primary-light) var(--clr-border);
}
.book-card-mini { scroll-snap-align: start; flex-shrink: 0; width: 180px; }
.book-card-mini{background:#fff;border-radius:var(--r-md);box-shadow:var(--shadow-card);overflow:hidden}
.book-card-mini img{aspect-ratio:3/4;object-fit:cover;width:100%}
.book-card-mini .meta{padding:.65rem .75rem}
.categories-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.category-tile{position:relative;overflow:hidden;border-radius:var(--r-lg);padding:1rem;color:#fff;min-height:130px;box-shadow:var(--shadow-md)}
.category-tile .count{position:absolute;top:.65rem;right:.65rem;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);border-radius:var(--r-pill);padding:.12rem .45rem;font-size:.72rem}
.join-us-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}

.catalog-layout{display:flex;gap:1.4rem}
.filter-sidebar{width:280px;flex:0 0 280px;background:var(--clr-surface);border-radius:var(--r-lg);box-shadow:var(--shadow-card);padding:1rem;position:sticky;top:86px;max-height:calc(100vh - 100px);overflow:auto}
.filter-group{margin-bottom:1rem}
.filter-list{display:grid;gap:.42rem}
.filter-item{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.year-range{display:grid;gap:.45rem}
.catalog-main{flex:1}
.books-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.15rem}

/* Book card — THE most important UI element */
.book-card {
  background: var(--clr-surface);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  transition: var(--t-normal);
  display: flex;
  flex-direction: column;
  cursor: pointer;
}
.book-card:hover {
  transform: translateY(-6px) rotate(-0.5deg);
  box-shadow: var(--shadow-book);
}
.book-cover-wrap {
  position: relative;
  aspect-ratio: 3/4;
  overflow: hidden;
  background: linear-gradient(135deg, var(--clr-primary-pale), var(--clr-gold-pale));
}
.book-cover-wrap img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.4s var(--ease);
}
.book-card:hover .book-cover-wrap img { transform: scale(1.05); }
/* Spine effect on left side */
.book-cover-wrap::before {
  content: '';
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 6px;
  background: linear-gradient(to right, rgba(0,0,0,0.2), transparent);
  z-index: 1;
}
/* Available/Unavailable overlay badge */
.book-status-badge {
  position: absolute; top: 0.75rem; right: 0.75rem;
  padding: 0.25rem 0.625rem;
  border-radius: var(--r-pill);
  font-size: 0.6875rem;
  font-weight: 700;
  backdrop-filter: blur(8px);
}
.badge-available   { background: rgba(45,125,79,0.9);  color: white; }
.badge-unavailable { background: rgba(192,57,43,0.9);  color: white; }
.badge-ebook       { background: rgba(45,95,138,0.9);  color: white; }
/* E-book icon overlay */
.ebook-indicator {
  position: absolute; bottom: 0.75rem; left: 0.75rem;
  width: 28px; height: 28px;
  background: var(--clr-digital);
  border-radius: var(--r-sm);
  display: flex; align-items: center; justify-content: center;
  color: white; font-size: 0.75rem;
}
.book-info { padding: 1rem; flex: 1; display: flex; flex-direction: column; gap: 0.375rem; }
.book-title {
  font-family: var(--font-display);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--clr-text-h);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.book-author { font-size: 0.8125rem; color: var(--clr-primary); font-weight: 500; }
.book-category-tag {
  display: inline-block;
  padding: 0.125rem 0.5rem;
  background: var(--clr-primary-pale);
  color: var(--clr-primary);
  border-radius: var(--r-pill);
  font-size: 0.6875rem;
  font-weight: 600;
  margin-top: auto;
}
.book-rating { display: flex; align-items: center; gap: 0.25rem; font-size: 0.75rem; color: var(--clr-gold); }

.pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.4rem;margin-top:1.2rem}
.page-btn,.page-num{border:1px solid var(--clr-border);border-radius:var(--r-md);padding:.45rem .68rem;color:var(--clr-text-body);background:#fff}
.page-num.active,.page-btn:hover,.page-num:hover{background:var(--clr-primary);color:#fff;border-color:var(--clr-primary)}

.book-hero{display:grid;grid-template-columns:35% 65%;gap:1.4rem}
.book-cover-xl{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-book);background:#efe7dd}
.book-cover-xl img{width:100%;aspect-ratio:3/4;object-fit:cover}
.book-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.75rem}
.meta-grid{display:grid;gap:.6rem;grid-template-columns:repeat(3,minmax(0,1fr));margin:.9rem 0}
.meta-item{background:#fff;border:1px solid var(--clr-border);border-radius:var(--r-md);padding:.6rem .75rem}
.tab-switch{display:flex;flex-wrap:wrap;gap:.4rem;margin:1.1rem 0 .8rem}
.tab-btn{border:1px solid var(--clr-border);background:#fff;border-radius:var(--r-pill);padding:.35rem .78rem;cursor:pointer}
.tab-btn.active{background:var(--clr-primary);border-color:var(--clr-primary);color:#fff}
.tab-pane{display:none}
.tab-pane.active{display:block;animation:fadeIn .25s both}
.ebooks-portal { background: #0F1B2D; color: white; min-height: 100vh; }
.ebook-hero {
  background: linear-gradient(135deg, #0F1B2D 0%, #1A3A5C 50%, #0F1B2D 100%);
  padding: 5rem 2rem;
  text-align: center;
}
.ebooks-portal .public-nav{background:rgba(15,27,45,.84);border-color:rgba(255,255,255,.08)}
.ebooks-portal .public-brand,.ebooks-portal .public-brand small,.ebooks-portal .public-links a{color:#f5f8ff}

.featured-ebook {
  background: linear-gradient(135deg, var(--clr-digital) 0%, #1a3a5c 100%);
  border-radius: var(--r-xl);
  padding: 3rem;
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 2rem;
  position: relative;
  overflow: hidden;
}
.featured-ebook::after {
  content: '';
  position: absolute; top: -50%; right: -10%;
  width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(201,150,63,0.2) 0%, transparent 70%);
  border-radius: 50%;
}
.featured-ebook .cover{width:200px;border-radius:var(--r-md);box-shadow:0 18px 34px rgba(0,0,0,.45);animation:float 4s ease-in-out infinite}
.ebooks-grid{display:grid;gap:1rem;grid-template-columns:repeat(4,minmax(0,1fr))}
.ebook-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: var(--t-normal);
}
.ebook-card:hover {
  background: rgba(255,255,255,0.1);
  border-color: var(--clr-gold);
  transform: translateY(-4px);
  box-shadow: 0 20px 40px rgba(0,0,0,0.4);
}
.ebook-card .cover{aspect-ratio:3/4;width:100%;object-fit:cover}
.ebook-card .body{padding:.85rem}
/* Bottom bar: file type badge + pages + read button */
.ebook-meta-bar {
  display: flex; align-items: center;
  padding: 0.75rem 1rem;
  background: rgba(0,0,0,0.3);
  gap: 0.5rem;
}
.file-type-badge {
  padding: 0.25rem 0.5rem;
  border-radius: var(--r-sm);
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  font-weight: 600;
  background: var(--clr-digital);
  color: white;
}

.profile-header{display:grid;gap:1rem;grid-template-columns:1fr auto}
.avatar-circle{width:76px;height:76px;border-radius:50%;background:linear-gradient(135deg,var(--clr-primary),var(--clr-primary-dark));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:1.3rem;font-weight:700}
/* Membership card — show as physical card */
.membership-card {
  width: 340px;
  height: 200px;
  background: linear-gradient(135deg, var(--clr-primary) 0%, var(--clr-primary-dark) 60%, var(--clr-gold) 100%);
  border-radius: 16px;
  padding: 1.5rem;
  color: white;
  position: relative;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(107,45,62,0.4);
}
.membership-card::before {
  content: '';
  position: absolute; right: -40px; top: -40px;
  width: 200px; height: 200px;
  background: rgba(255,255,255,0.05);
  border-radius: 50%;
}
.card-number { font-family: var(--font-mono); font-size: 1rem; letter-spacing: 0.15em; }
.card-plan { position: absolute; top: 1.5rem; right: 1.5rem; font-size: 0.75rem; font-weight: 700; }
.card-expiry { font-size: 0.75rem; color: rgba(255,255,255,0.7); margin-top: 0.25rem; }
.stats-row{display:grid;gap:.85rem;grid-template-columns:repeat(4,minmax(0,1fr))}
.stat-mini{padding:.9rem;border-radius:var(--r-md);border:1px solid var(--clr-border);background:#fff}

.due-progress {
  height: 6px;
  border-radius: var(--r-pill);
  background: var(--clr-border);
  overflow: hidden;
  margin-top: 0.5rem;
}
.due-progress-fill { height: 100%; border-radius: inherit; transition: width 0.5s; }
.due-safe     { background: var(--clr-success); }
.due-warning  { background: var(--clr-warning); }
.due-critical { background: var(--clr-danger); animation: pulse-bar 1s infinite; }
@keyframes pulse-bar { 0%,100% { opacity: 1; } 50% { opacity: 0.6; } }

.queue-badge {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--clr-gold);
  color: white;
  font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem;
}

.reading-ring {
  position: relative; width: 56px; height: 56px;
}
.reading-ring svg { transform: rotate(-90deg); }
.ring-track  { fill: none; stroke: var(--clr-border); stroke-width: 4; }
.ring-fill   { fill: none; stroke: var(--clr-digital); stroke-width: 4; stroke-linecap: round;
               stroke-dasharray: 138.2;
               transition: stroke-dashoffset 0.5s var(--ease); }
.ring-label  { position: absolute; inset: 0; display: flex; align-items: center;
               justify-content: center; font-size: 0.6875rem; font-weight: 700; }

.fine-card{border-left:4px solid var(--clr-danger)}
.fine-card.paid{border-left-color:var(--clr-success);opacity:.8}
.stats-grid-6{display:grid;gap:.8rem;grid-template-columns:repeat(3,minmax(0,1fr))}
.quick-stat{background:#fff;border:1px solid var(--clr-border);border-radius:var(--r-md);padding:.9rem}
/* CSS Bar chart */
.chart-bar-wrap { display: flex; align-items: flex-end; gap: 0.5rem; height: 160px; }
.chart-bar {
  flex: 1; border-radius: var(--r-sm) var(--r-sm) 0 0;
  background: linear-gradient(to top, var(--clr-primary) 0%, var(--clr-primary-light) 100%);
  position: relative;
  transition: height 0.5s var(--ease);
  min-width: 24px;
}
.chart-bar:hover { filter: brightness(1.15); }
.chart-bar-tooltip {
  position: absolute; bottom: calc(100% + 6px); left: 50%;
  transform: translateX(-50%);
  background: var(--clr-text-h);
  color: white; padding: 0.25rem 0.5rem;
  border-radius: var(--r-sm); font-size: 0.75rem;
  white-space: nowrap;
  opacity: 0; transition: var(--t-fast);
}
.chart-bar:hover .chart-bar-tooltip { opacity: 1; }

.table-wrap{overflow:auto;border-radius:var(--r-md);border:1px solid var(--clr-border)}
table.data-table{width:100%;border-collapse:collapse;min-width:840px;background:#fff}
table.data-table th,table.data-table td{border-bottom:1px solid var(--clr-border-light);padding:.65rem .7rem;text-align:left;font-size:.88rem}
table.data-table th{position:sticky;top:0;z-index:1;background:#fdfaf6;color:var(--clr-text-muted)}
.member-row { cursor: pointer; }
.member-detail { max-height: 0; overflow: hidden; transition: max-height 0.3s var(--ease); }
.member-row.open + .member-detail { max-height: 400px; }

.subscription-timeline {
  position: relative;
  padding-left: 2rem;
}
.subscription-timeline::before {
  content: '';
  position: absolute; left: 0.75rem; top: 0; bottom: 0;
  width: 2px; background: var(--clr-border);
}

.cover-upload-zone {
  border: 2px dashed var(--clr-border);
  border-radius: var(--r-lg);
  padding: 2rem;
  text-align: center;
  cursor: pointer;
  transition: var(--t-normal);
}
.cover-upload-zone:hover, .cover-upload-zone.dragover {
  border-color: var(--clr-primary);
  background: var(--clr-primary-pale);
}
.cover-preview {
  width: 120px; height: 160px;
  object-fit: cover;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-book);
}

.upload-progress {
  height: 6px;
  background: var(--clr-border);
  border-radius: var(--r-pill);
  overflow: hidden;
  margin-top: 0.5rem;
}
.upload-progress-fill {
  height: 100%;
  background: linear-gradient(to right, var(--clr-digital), var(--clr-gold-light));
  border-radius: inherit;
  transition: width 0.2s;
  animation: shimmer 1.5s infinite;
}
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}

#toast-container {
  position: fixed; bottom: 2rem; right: 2rem;
  display: flex; flex-direction: column; gap: 0.75rem;
  z-index: 9999;
}
.toast {
  display: flex; align-items: center; gap: 0.75rem;
  padding: 0.875rem 1.25rem;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-lg);
  font-weight: 500; font-size: 0.875rem;
  max-width: 360px;
  transform: translateX(120%);
  transition: transform 0.3s var(--ease);
  backdrop-filter: blur(10px);
}
.toast.show { transform: translateX(0); }
.toast-success { background: #D1FAE5; color: #065F46; border-left: 4px solid var(--clr-success); }
.toast-error   { background: #FEE2E2; color: #7F1D1D; border-left: 4px solid var(--clr-danger); }
.toast-warning { background: #FEF3C7; color: #78350F; border-left: 4px solid var(--clr-warning); }
.toast-info    { background: #DBEAFE; color: #1E3A5F; border-left: 4px solid var(--clr-info); }

.empty-state {
  padding: 4rem 2rem;
  text-align: center;
  color: var(--clr-text-muted);
}
.empty-state-icon { font-size: 4rem; display: block; margin-bottom: 1rem; opacity: 0.5; }
.empty-state h3 { font-family: var(--font-display); color: var(--clr-text-body); margin-bottom: 0.5rem; }

.stars { display: flex; gap: 2px; }
.star  { font-size: 1rem; color: var(--clr-border); }
.star.filled { color: var(--clr-gold); }
/* Interactive: */
.stars-input input[type=radio] { display: none; }
.stars-input label { font-size: 1.5rem; cursor: pointer; color: var(--clr-border); transition: var(--t-fast); }
.stars-input:hover label, .stars-input input:checked ~ label { color: var(--clr-border); }
.stars-input label:hover, .stars-input label:hover ~ label { color: var(--clr-gold) !important; }

@keyframes fadeInUp    { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeIn      { from { opacity:0; } to { opacity:1; } }
@keyframes slideInLeft { from { opacity:0; transform:translateX(-20px); } to { opacity:1; transform:translateX(0); } }
@keyframes bookOpen    { from { opacity:0; transform:perspective(600px) rotateY(-15deg); } to { opacity:1; transform:perspective(600px) rotateY(0); } }
@keyframes float       { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-8px); } }
@keyframes glow        { 0%,100% { box-shadow: 0 0 20px rgba(201,150,63,0.3); } 50% { box-shadow: 0 0 40px rgba(201,150,63,0.6); } }
@keyframes skeletonShimmer {
  0%   { background-position: -200% 0; }
  100% { background-position:  200% 0; }
}
.skeleton {
  background: linear-gradient(90deg, #f5ede6 25%, #ede0d4 50%, #f5ede6 75%);
  background-size: 200% 100%;
  animation: skeletonShimmer 1.4s infinite;
  border-radius: var(--r-sm);
}

/* Staggered card entrance */
.book-card:nth-child(1)  { animation: fadeInUp 0.4s 0.00s both; }
.book-card:nth-child(2)  { animation: fadeInUp 0.4s 0.05s both; }
.book-card:nth-child(3)  { animation: fadeInUp 0.4s 0.10s both; }
.book-card:nth-child(4)  { animation: fadeInUp 0.4s 0.15s both; }
.book-card:nth-child(5)  { animation: fadeInUp 0.4s 0.20s both; }
.book-card:nth-child(6)  { animation: fadeInUp 0.4s 0.25s both; }

/* Tablet */
@media (max-width: 1024px) {
  .sidebar { width: 240px; }
  .main-content { margin-right: 240px; }
  .books-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Mobile */
@media (max-width: 768px) {
  .sidebar { transform: translateX(-100%); position: fixed; z-index: 200; transition: var(--t-normal); }
  .sidebar.open { transform: translateX(0); }
  .main-content { margin-right: 0; }
  .topbar { padding: 0 1rem; }
  .menu-toggle { display: flex; }
  .books-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  .book-card { }
  .catalog-layout { flex-direction: column; }
  .filter-sidebar { width: 100%; }
}

.app-shell{display:flex;min-height:100vh}
.panel-pad{padding:1.2rem}

.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:2rem 1rem}
.auth-card{width:min(980px,100%);background:#fff;border-radius:var(--r-xl);box-shadow:var(--shadow-lg);overflow:hidden;display:grid;grid-template-columns:42% 58%}
.auth-side{background:linear-gradient(135deg,#6b2d3e 0%,#4a1e2b 100%);color:#fff;padding:2rem;display:grid;align-content:center;gap:.7rem}
.auth-side h2,.auth-side h3{color:#fff}
.auth-form{padding:1.5rem}
.plan-select{display:grid;gap:.7rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.plan-option{border:1px solid var(--clr-border);border-radius:var(--r-md);padding:.75rem;cursor:pointer;transition:var(--t-fast)}
.plan-option.active,.plan-option:hover{border-color:var(--clr-primary);box-shadow:inset 0 0 0 1px var(--clr-primary)}

.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;z-index:200;padding:1rem}
.modal-overlay.open{display:flex;animation:fadeIn .2s both}
.modal{width:min(920px,100%);max-height:calc(100vh - 2rem);overflow:auto;background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-lg)}
.modal-head,.modal-body,.modal-foot{padding:.95rem 1rem}
.modal-head{border-bottom:1px solid var(--clr-border)}
.modal-foot{border-top:1px solid var(--clr-border);display:flex;justify-content:flex-end;gap:.55rem}

.tabs{display:flex;flex-wrap:wrap;gap:.4rem}
.tab-link{padding:.43rem .7rem;border-radius:var(--r-pill);background:#fff;border:1px solid var(--clr-border)}
.tab-link.active{background:var(--clr-primary);border-color:var(--clr-primary);color:#fff}

.timeline{display:grid;gap:.8rem}
.timeline-item{display:grid;grid-template-columns:50px 1fr auto;gap:.65rem;align-items:center}

.reader-launch{display:inline-flex;align-items:center;gap:.35rem;background:#e8f2fa;color:#174f75;border:1px solid #b9d3e9;border-radius:var(--r-pill);padding:.36rem .66rem}

.search-hit{display:grid;gap:.15rem;padding:.45rem .55rem;border:1px solid var(--clr-border);border-radius:8px;margin-top:.3rem;background:#fff}
.search-hit:hover{border-color:var(--clr-primary);background:var(--clr-primary-pale)}

.activity-feed{max-height:460px;overflow:auto;display:grid;gap:.6rem}

@media (max-width: 900px){
  .auth-card{grid-template-columns:1fr}
  .plan-select{grid-template-columns:1fr}
}