/* main.css */
:root {
  --bg-color: #f4f4f4;
  --text-color: #2c3e50;
  --accent-color: #d4af37;
  --link-bg: #3498db;
  --link-hover: #2980b9;
}
body.dark {
  --bg-color: #1e1e1e;
  --text-color: #f4f4f4;
  --link-bg: #2980b9;
  --link-hover: #3498db;
}
* { box-sizing: border-box; margin:0; padding:0; }

body {
  font-family: 'Poppins', sans-serif;
  background: var(--bg-color);
  color: var(--text-color);
  transition: background .3s, color .3s;
  line-height:1.6;
  padding-top:80px;
}

header {
  position: fixed;
  top:0; left:0; width:100%;
  background: rgba(255,255,255,0.8);
  backdrop-filter: blur(12px);
  border-bottom:1px solid rgba(0,0,0,0.05);
  display:flex; align-items:center; justify-content:center;
  padding:1rem; z-index:1000;
}
body.dark header { background: rgba(30,30,30,0.9); }
header h1 { font-size:1.5rem; margin:0; }

#toggle-theme{
  position:absolute; right:1rem; top:1rem;
  background:none; border:none; font-size:1.75rem;
  cursor:pointer; transition:transform .3s;
}
#toggle-theme:hover{ transform:rotate(25deg); }

main{ max-width:1200px; margin:0 auto; padding:2rem 1rem; text-align:center; }

ul.book-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(160px,1fr));
  gap:1rem; list-style:none; padding:0; margin-top:2rem;
}

.book-grid li a{
  display:block; background:var(--link-bg); color:#fff;
  font-size:1rem; padding:1.25rem 1rem; border-radius:12px;
  text-decoration:none;
  transition:background .3s, transform .2s, box-shadow .2s;
  box-shadow:0 3px 6px rgba(0,0,0,.06);
}
.book-grid li a:hover{
  background:var(--link-hover);
  transform:translateY(-2px);
  box-shadow:0 5px 12px rgba(0,0,0,.1);
}

a.voltar{
  display:inline-block; margin-top:2rem;
  font-size:1rem; padding:.75rem 1.5rem;
  background:#95a5a6; color:#fff;
  border-radius:8px; text-decoration:none;
  transition:background .3s;
}
a.voltar:hover{ background:#7f8c8d; }

footer{ margin-top:4rem; font-size:.875rem; opacity:.8; }