
:root{--bg:#f6f0e1;--card:#fffaf0;--ink:#1f2a24;--green:#1f4d3a;--gold:#b8923a;--muted:#6b6b5e}
@media(prefers-color-scheme:dark){:root{--bg:#0f1a15;--card:#17261f;--ink:#efe6cf;--green:#6fb391;--gold:#d4b05a;--muted:#a9a58f}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'Noto Nastaliq Urdu','Noto Naskh Arabic',serif;line-height:2.2;font-size:18px;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
header{background:var(--green);color:#f6f0e1;text-align:center;padding:2.5rem 1rem;border-bottom:4px solid var(--gold)}
header h1{margin:0;font-size:2rem}
header p{margin:.5rem 0 0;opacity:.85}
main{max-width:1000px;margin:auto;padding:1.5rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1.2rem}
.card{background:var(--card);border:1px solid var(--gold);border-radius:12px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.card .cover{aspect-ratio:3/4;width:100%;object-fit:cover;display:flex;align-items:center;justify-content:center;text-align:center;padding:1rem;background:linear-gradient(160deg,var(--green),#0e2a20);color:#f6f0e1;font-size:1.4rem}
.card .info{padding:.6rem 1rem}
.card .info small{color:var(--muted)}
.book{display:flex;flex-wrap:wrap;gap:1.5rem}
.book .cover{width:220px;border-radius:12px;border:2px solid var(--gold)}
.book .meta{flex:1;min-width:240px}
.btn{display:inline-block;background:var(--green);color:#f6f0e1;padding:.2rem 1.4rem;border-radius:8px;margin:.3rem;text-decoration:none;border:1px solid var(--gold);font-size:1.1rem}
.contact{margin-top:1.5rem;padding:1rem;border:1px dashed var(--gold);border-radius:10px;background:var(--card)}
.allow{-webkit-user-select:text;user-select:text}
.contact a{color:var(--gold)}
a.back{color:var(--gold)}
.sizes button{background:var(--card);color:var(--ink);border:1px solid var(--gold);border-radius:6px;padding:.1rem .8rem;margin:0 .2rem;font-size:1rem}
.reader{max-width:720px;margin:auto;font-size:1.25rem;line-height:2.5;background:var(--card);padding:1.2rem 1.5rem;border-radius:12px;border:1px solid var(--gold)}
.reader p{margin:0 0 1.2rem;text-align:justify}
footer{text-align:center;color:var(--muted);padding:2rem}
@media print{body{display:none}}
