@import "/assets/fonts/fonts.css";
:root{
  --lib-bg-deep:#081814; --lib-bg:#0c2420; --lib-bg-2:#123430;
  --lib-gold:#C9A24B; --lib-gold-soft:#E6C977; --lib-cream:#F3E9D2;
  --lib-card:rgba(255,255,255,.04); --lib-line:rgba(201,162,75,.22);
  --lib-mut:#8FB3A6;
  --font-display:"Amiri",Georgia,serif; --font-ui:"Tajawal",-apple-system,"Segoe UI",Tahoma,sans-serif;
}
*{box-sizing:border-box}
body.lib-body{margin:0;min-height:100vh;font-family:var(--font-ui);color:var(--lib-cream);
  background:radial-gradient(120% 90% at 50% 0%,var(--lib-bg-2) 0%,var(--lib-bg) 45%,var(--lib-bg-deep) 100%);
  background-attachment:fixed}
.lib-veil{position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(320px 320px at 50% 18%,rgba(201,162,75,.10),transparent 70%);transition:background .25s}
.lib-page{position:relative;z-index:1;max-width:1100px;margin:0 auto;padding:34px 22px 60px}
.lib-head{text-align:center;margin-bottom:8px}
.lib-logo{display:block;height:92px;width:auto;margin:0 auto 2px;opacity:.92}
.lib-title{font-family:var(--font-display);font-size:34px;color:var(--lib-cream);margin:6px 0 2px}
.lib-sub{font-size:13px;color:var(--lib-mut)}
/* الحلقة الدوّارة (مقتبسة من uiverse swift-panda-38، CSS صِرف) */
.ring-wrap{position:relative;height:340px;display:flex;align-items:center;justify-content:center;perspective:1100px}
.ring{--w:118px;--h:170px;--tz:175px;--rx:-5deg;--q:1;position:absolute;width:var(--w);height:var(--h);top:14%;
  transform-style:preserve-3d;transform:perspective(1100px);animation:ring-spin 30s linear infinite}
.ring:hover{animation-play-state:paused}
@keyframes ring-spin{from{transform:perspective(1100px) rotateX(var(--rx)) rotateY(0)}
  to{transform:perspective(1100px) rotateX(var(--rx)) rotateY(1turn)}}
.ring-card{position:absolute;inset:0;border:1.5px solid rgba(201,162,75,.55);border-radius:11px;overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.45);cursor:pointer;
  transform:rotateY(calc((360deg / var(--q)) * var(--i))) translateZ(var(--tz));backface-visibility:hidden}
.ring-card img{width:100%;height:100%;object-fit:cover;display:block}
.ring-card.soon{border-style:dashed;border-color:rgba(143,179,166,.4);box-shadow:none;
  display:flex;align-items:center;justify-content:center;color:var(--lib-mut);
  font-family:var(--font-display);font-size:15px;background:linear-gradient(150deg,#1f3d37,#142a25)}
/* شبكة البطاقات (التنقّل الفعلي) */
.book-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,168px));justify-content:center;gap:16px;margin-top:26px}
.book-card{background:var(--lib-card);border:1px solid var(--lib-line);border-radius:12px;padding:9px;
  text-align:center;text-decoration:none;color:inherit;display:block;transition:transform .15s,border-color .15s}
.book-card:hover{transform:translateY(-4px);border-color:rgba(201,162,75,.5)}
.book-card .cov{width:100%;aspect-ratio:2/3;border-radius:10px;object-fit:cover;border:1px solid rgba(201,162,75,.4);display:block}
.book-card .bn{font-family:var(--font-display);font-size:14px;margin-top:8px;color:var(--lib-cream)}
.book-card .bs{font-size:11px;margin-top:3px;color:var(--lib-mut)}
.book-card .bp{font-family:var(--font-ui);font-size:13px;margin-top:7px;color:var(--lib-gold-soft)}
.lib-intro{max-width:560px;margin:10px auto 0;font-size:13px;line-height:1.9;color:var(--lib-mut);text-align:center}
.lib-foot{margin-top:46px;padding-top:18px;border-top:1px solid var(--lib-line);
  text-align:center;font-size:12px;color:var(--lib-mut)}
.lib-foot a{color:var(--lib-gold-soft);text-decoration:none}
/* الجوال: تصغير الحلقة لتسع الشاشة الضيقة، وبطاقتان أنيقتان في الصف (الكتابة من الجوال) */
@media (max-width: 600px){
  .lib-page{padding:24px 14px 48px}
  .lib-head{margin-bottom:4px}
  .lib-logo{height:72px}
  .lib-title{font-size:27px}
  .lib-sub{font-size:12px}
  .ring-wrap{height:228px;perspective:820px}
  .ring{--w:90px;--h:130px;--tz:108px;top:12%;animation-duration:34s}
  .ring-card.soon{font-size:12px}
  .book-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;margin-top:18px}
  .book-card .bn{font-size:13px}
}

/* صفحة الكتاب */
.bk-wrap{display:grid;grid-template-columns:260px 1fr;gap:30px;align-items:start;margin-top:26px}
.bk-cover{width:100%;border-radius:12px;border:1px solid rgba(201,162,75,.45);
  box-shadow:0 14px 40px rgba(0,0,0,.5);display:block}
.bk-title{font-family:var(--font-display);font-size:30px;margin:0 0 4px}
.bk-sub{color:var(--lib-mut);font-size:14px;margin-bottom:18px}
.bk-blurb{line-height:2;font-size:14px;color:var(--lib-cream);margin:0 0 20px}
.bk-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:26px}
.bk-fact{background:var(--lib-card);border:1px solid var(--lib-line);border-radius:10px;padding:10px 12px}
.bk-fact dt{font-size:11px;color:var(--lib-mut);margin-bottom:4px}
.bk-fact dd{margin:0;font-size:14px;color:var(--lib-cream)}
.buy-head{font-family:var(--font-display);font-size:20px;margin:6px 0 12px}
.buy-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.buy-opt{background:var(--lib-card);border:1px solid var(--lib-line);border-radius:12px;padding:14px;
  text-align:center;cursor:pointer;color:inherit;font:inherit;transition:border-color .15s,transform .15s}
.buy-opt:hover{border-color:rgba(201,162,75,.55);transform:translateY(-3px)}
.buy-opt .bo-n{font-family:var(--font-display);font-size:17px;margin-bottom:6px}
.buy-opt .bo-p{color:var(--lib-gold-soft);font-size:14px}
.buy-opt .bo-x{color:var(--lib-mut);font-size:11px;margin-top:6px}
.buy-opt[disabled]{opacity:.45;cursor:not-allowed}
.bk-back{display:inline-block;margin-top:30px;color:var(--lib-gold-soft);text-decoration:none;font-size:13px}
@media (max-width:700px){ .bk-wrap{grid-template-columns:1fr} .bk-cover{max-width:220px;margin:0 auto} }

.ord{margin-top:20px;background:var(--lib-card);border:1px solid var(--lib-line);
  border-radius:14px;padding:18px}
.ord h3{font-family:var(--font-display);font-size:18px;margin:0 0 14px}
.ord label{display:block;font-size:12px;color:var(--lib-mut);margin:0 0 5px}
.ord input{width:100%;padding:10px 12px;border-radius:9px;background:rgba(0,0,0,.25);
  border:1px solid var(--lib-line);color:var(--lib-cream);font:inherit;margin-bottom:13px}
.ord input:focus{outline:none;border-color:rgba(201,162,75,.6)}
.ord .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.ord-total{font-size:15px;color:var(--lib-gold-soft);margin:4px 0 14px}
.ord-note{font-size:12px;color:var(--lib-mut);margin-bottom:14px}
.ord-send{width:100%;padding:12px;border-radius:10px;border:1px solid rgba(201,162,75,.55);
  background:rgba(201,162,75,.14);color:var(--lib-cream);font:inherit;font-size:15px;cursor:pointer}
.ord-send:hover{background:rgba(201,162,75,.24)}
.ord-send[disabled]{opacity:.5;cursor:not-allowed}
.ord-msg{margin-top:12px;font-size:13px;line-height:1.9}
.ord-msg.ok{color:#7FD1A8}
.ord-msg.err{color:#E58F8F}