/* ==========================================================================
   TafsirKurd 2.0 — homepage «پەرتوکخانە»: a 3D bookcase that drifts slowly.
   Books are real CSS 3D objects (cover + page block; Kurdish/Arabic books open
   on the left, spine on the right). The whole row is ONE track whose only
   animation is a transform (compositor-only, no repaint): the A25 floor.
   - drift runs only while the section is on screen (JS adds .is-off otherwise)
   - hover / touch / keyboard focus pauses it (.is-hold)
   - prefers-reduced-motion or a weak non-Apple device (.is-flat, set in JS) → a normal scrollable
     shelf of flat covers, no animation at all
   No box-shadow/filter animations, no backdrop-filter, nothing infinite that
   repaints (see CLAUDE.md "Ambient-animation GPU class").
   ========================================================================== */
.tk-lib { --bk-w: 148px; position: relative; margin-top: var(--s2); }
.tk-lib__viewport { position: relative; z-index: 1; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; padding: 26px 0 8px; }
.tk-lib__viewport::-webkit-scrollbar { display: none; }
.tk-lib__track { display: flex; width: max-content; }
.tk-lib__set { display: flex; gap: 38px; padding-inline-end: 38px; }   /* end padding = gap → seamless loop */

/* auto drift: two identical sets; moving by exactly one set (50%) loops without a seam.
   RTL page → books travel to the right (new ones enter from the left, like an RTL ticker). */
.tk-lib.is-auto .tk-lib__viewport { overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%); }
.tk-lib.is-auto .tk-lib__track { animation: tkLibDrift var(--dur, 100s) linear infinite; will-change: transform; }
.tk-lib.is-auto.is-off .tk-lib__track, .tk-lib.is-auto.is-hold .tk-lib__track { animation-play-state: paused; }
@keyframes tkLibDrift { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(50%, 0, 0); } }
[dir="ltr"] .tk-lib.is-auto .tk-lib__track { animation-name: tkLibDriftLtr; }
@keyframes tkLibDriftLtr { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } }

/* ── one book ── */
.bk3 { flex: none; width: var(--bk-w); display: block; color: var(--ink); text-align: start; outline: none; }
.bk3:hover, .bk3:focus-visible { color: var(--ink); }
.bk3__stage { position: relative; display: block; perspective: 900px; perspective-origin: 50% 40%; }
/* floor shadow — static gradient, never animated */
.bk3__stage::after { content: ''; position: absolute; inset: auto 4% -14px 10%; height: 22px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(20, 14, 6, .38), rgba(20, 14, 6, 0)); z-index: -1; }
.bk3__book { --T: 20px; position: relative; display: block; aspect-ratio: 3 / 4.3; transform-style: preserve-3d;
  transform: rotateY(26deg); transition: transform var(--d4) var(--ease); }
.bk3:hover .bk3__book, .bk3:focus-visible .bk3__book { transform: rotateY(8deg) translate3d(0, -8px, 0); }
.bk3__cover { position: absolute; inset: 0; overflow: hidden; border-radius: 7px 2px 2px 7px; background: var(--green-deep);
  transform: translateZ(calc(var(--T) / 2)); backface-visibility: hidden;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .12) inset, 0 18px 26px -14px rgba(15, 20, 12, .55); }
.bk3__cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* spine (right) shading + a soft gloss across the cover */
.bk3__cover::after { content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(270deg, rgba(0, 0, 0, .34) 0, rgba(255, 255, 255, .22) 3px, rgba(0, 0, 0, .12) 7px, rgba(0, 0, 0, 0) 16px),
              linear-gradient(118deg, rgba(255, 255, 255, .2) 0, rgba(255, 255, 255, 0) 38%); }
/* the page block on the open (left) edge, turned 90° into the depth */
.bk3__pages { position: absolute; left: 0; top: 3px; bottom: 3px; width: var(--T); transform-origin: left center;
  transform: translateZ(calc(var(--T) / -2)) rotateY(-90deg); backface-visibility: hidden;
  background: repeating-linear-gradient(90deg, #f4ecd9 0 1px, #ddd0b3 1px 2px), #efe5cd;
  box-shadow: inset 0 0 6px rgba(80, 60, 30, .35); }
.bk3__t { display: -webkit-box; margin-top: 18px; font-weight: 600; font-size: var(--t-sm); line-height: 1.45;
  -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bk3__a { display: block; margin-top: 2px; color: var(--muted); font-size: var(--t-xs); }
.bk3 .tkt-new { display: none; }

/* wooden shelf the books stand on: its top edge sits exactly at the covers' feet
   (viewport top padding 26px + cover height = width × 4.3/3) */
.tk-lib__plank { position: absolute; inset-inline: 0; top: calc(26px + var(--bk-w) * 4.3 / 3 - 3px); height: 14px; z-index: 0; border-radius: 3px;
  background: linear-gradient(180deg, #caa576 0, #b28a58 45%, #8e6b41 100%);
  box-shadow: 0 10px 18px -10px rgba(40, 25, 8, .55); }
:root[data-theme="sakina"] .tk-lib__plank { background: linear-gradient(180deg, #6f5433 0, #5a4228 55%, #3e2d1a 100%); }

@media (max-width: 600px) {
  .tk-lib { --bk-w: 118px; }
  .tk-lib__set { gap: 26px; padding-inline-end: 26px; }
  .bk3__book { --T: 16px; }
}

/* no motion / low-end: flat covers on a normal scrollable shelf */
@media (prefers-reduced-motion: reduce) {
  .tk-lib.is-auto .tk-lib__track { animation: none; }
  .bk3__book { transition: none; }
}
/* flat covers: the bookcase on weak devices (.tk-lib.is-flat) and pages that flag the whole
   document (html.is-flat, e.g. treasure.html) */
.is-flat .bk3__book { transform: none; }
.is-flat .bk3:hover .bk3__book, .is-flat .tkt-book:hover .bk3__book { transform: translate3d(0, -4px, 0); }
.is-flat .bk3__pages { display: none; }
.is-flat .bk3__cover { transform: none; }